Flexibel basisgrid

De basisopbouw van alle pagina’s is gelaagd. De eerste content laag staat 60px onder de header. Er wordt gewerkt met een afwisselend kleurenschema.

• Eerste sectie: over de volledig breedte van het scherm, wit.
• Tweede sectie: over de volledig breedte van het scherm, grijs.
• Indien er extra secties worden toegevoegd dient er beurtelings met de aangegeven kleuren gewerkt te worden.
• De footer dient in de gehele breedte van de pagina blauw te zijn met aan de bovenkant een limoengroene lijn in de dikte van 15px. Boven en onder de content dient 30px witruimte gebruikt te worden.

 

Basisopbouw

 

 

Basisgrid:

Er wordt gebruik gemaakt van het volgende basisgrid:
960 pixels: 12 kolommen van 60px met marges tussen de kolommen van 20 pixels.

 

Je kunt de kolommen samentrekken om verder te variëren in de layout. Alle layout varianten die op het basisgrid van 12 kolommen passen zijn toegestaan. Vermijd te lange regels in een tekstkolom om de leesbaarheid van een alinea prettig te houden. De basis voor Responsive Web Design bestaat uit een flexibel basisgrid (fluid grid). De maatvoering hierbij is relatief. Dus niet meer in pixels of punten. Hierdoor past de layout zich aan de schermbreedte aan. Dit kun je op verschillende manieren bereiken:

• Varieer het aantal kolommen.
• Pas de breedte van een of meerdere kolommen aan.
• Verbreed of versmal de kolommen.