Het webshopgebied kan uit een linker- en rechtergedeelte, een centraal gedeelte en een kop- en voettekst bestaan. Het hele gebied is onderverdeeld in 12 kolommen op basis van het Bootstrap-raster, een onderdeel van CSS. Zie http://getbootstrap.com/css/#grid voor meer informatie.
Bootstrap biedt schaalmogelijkheden voor mobiele apparaten. Bootstrap omvat een responsief, primair voor mobiele apparaten ontwikkeld vloeiend rastersysteem waarmee maximaal 12 kolommen correct kunnen worden geschaald naarmate de omvang van het apparaat of de viewport toeneemt. Zie http://getbootstrap.com/css/#grid-example-basic voor meer informatie.
OPMERKING
U moet uw webshop testen op de verwachte weergaveresoluties van uw klanten.
Grote apparaten: grote desktops, 1200 pixels en meer.
Middelgrote apparaten: desktops, 992 pixels en meer.
|
Lay-out |
Aantal kolommen |
|---|---|
|
Links: 2 kolommen Rechts: 0 kolommen Midden: 10 kolommen |
|
Links: 2 kolommen Rechts: 2 kolommen Midden: 8 kolommen |
|
Links: 0 kolommen Rechts: 2 kolommen Midden: 10 kolommen |
|
Links: 0 kolommen Rechts: 0 kolommen Midden: 12 kolommen |
Kleine apparaten: tablets, 768 pixels en meer
|
Lay-out |
Aantal kolommen |
|---|---|
|
|
Links: 1 kolom Rechts: 0 kolommen Midden: 11 kolommen |
|
|
Links: 1 kolom Rechts: 1 kolom Midden: 10 kolommen |
|
|
Links: 0 kolommen Rechts: 1 kolom Midden: 11 kolommen |
|
|
Links: 0 kolommen Rechts: 0 kolommen Midden: 12 kolommen |
Extra kleine apparaten: telefoons, minder dan 768 pixels
Een vaste lay-out.
De hoogte van de koptekst is 48 pixels.
De hoogte van de voettekst is 48 pixels.
Geen linker- en rechterkolommen.
De breedte van het middelste gedeelte is afhankelijk van het apparaat. De breedte is bijvoorbeeld:
375 pixels op een Apple iPhone 6
412 pixels op een Motorola Nexus 6