Onze websites, waaronder enternext.com en enterware.com, zijn een goed voorbeeld van de toepassing van pagina-layouts (of gewoon layouts). De structuur (ook wel template genoemd) van de beide websites is gelijk, maar het kleurgebruik, de plaatjes en de content is anders.
Ter verduidelijking: een layout bestaat niet alleen uit een template (HTML) en een stylesheet (CSS), maar in de layout definieren we ook welke elementen op de pagina steeds automatisch dienen te verschijnen (zogenaamde vaste elementen) en welke door de eindgebruiker zelf zijn in te delen (ofwel vrije elementen).
In de praktijk blijkt echter dat de stylesheets binnen één website voor 98% aan elkaar gelijk zijn. Het is een beetje zonde om voor elke kleine wijziging een hele nieuwe stylesheet aan te maken, terwijl het enige wat je feitelijk wilt is die 2% variabelen beheren. 
De oplossing die we hebben gekozen was even simpel als doeltreffend: per pagina kan de eindgebruiker nu zelf aangeven welke sub-stylesheet gewenst is.
En ook hier geldt: als je een moeder-pagina een sub-stylesheet meegeeft, dan overerven de dochters automatisch die instelling.
Praktijkvoorbeeld
We hebben het op de website madeinalmere.nl uitgewerkt en het werkt fantastisch. Alle pagina's gebruiken momenteel één layout, bestaande uit een basis template (HTML) en een basis stylesheet (CSS). Per pagina hebben we een sub-stylesheet gekozen, die bij het thema past. Het geeft een hele dynamische beleving.
Vergelijk onderstaande pagina's (alle layouts zijn identiek, alleen de sub-stylesheet verschilt):
|
