HTML
Taalvarianten: XHTML 1.0 Strict, HTML 5
Valide en semantisch correct
HTML-code is volledig W3C-valide en semantisch correct. Elementen worden op de juiste manier ingezet, in een beschrijvende vorm, onnodige extra elementen worden vermeden. In de HTML-code wordt absolute scheiding van inhoud, opmaak en gedrag toegepast volgens het MVC-model (Model-View-Controller).
Browser-specifieke code (voor Internet Explorer X) wordt met 'Conditional Comments' aangeroepen. Toegankelijke opbouw van het HTML-document, waarbij het 'progressive enhancement' principe wordt toegepast (toegankelijke basis, aanvullende interactie). Logische indeling van elementen in componenten. Soortgelijke componenten worden hergebruikt.
Heldere beschrijving van componenten middels flagging staan in HTML commentaar regels (voorbeeld). Componenten kunnen in zowel in een layout als in een lege pagina geplaatst worden. Alle componenten worden in een verzamelpagina opgesomd, als een basis template om pagina's te genereren.
Structuur en inhoud
De structuur van het document wordt zodanig opgezet, dat de meest relevante inhoud zo ver mogelijk bovenin staat. Dat betekent dat navigatie, meta-informatie en minder-relevante inhoud minder bovenaan staan dan de paginatitel (H1) en de belangrijkste inhoud. Javascript wordt zoveel mogelijk in de 'head'-sectie van het document geplaatst.
Bovendien worden toegankelijkheidshalve extra navigatie en beschrijvende elementen ingezet, die de gebruiker in staat stellen in de pagina te navigeren naar inhoud, paginanavigatie en eventueel zoeken, in het geval dat stijl en gedrag niet beschikbaar zijn.
Conditional Comments
<!-- Laad Internet Explorer 6 of lager stylesheet -->
<!--[if lte IE 6]>
<link rel="stylesheet" href="include/inc_css/ie6-fix.css" type="text/css" />
<![endif]-->
<!-- Laad Internet Explorer 7 stylesheet -->
<!--[if IE 7]>
<link rel="stylesheet" href="include/inc_css/ie7-fix.css" type="text/css" />
<![endif]-->
<!-- Laad Internet Explorer 8 stylesheet -->
<!--[if IE 8]>
<link rel="stylesheet" href="include/inc_css/ie8-fix.css" type="text/css" />
<![endif]-->
Toegankelijke pagina-navigatie
<!-- =usable page-navigation -->
<p class="text-only">
<a href="#ContentContainer">> Direct naar inhoud</a>
<br/>
<a href="#pageNavigation">> Direct naar navigatie</a>
<br/>
<a href="#search">> Direct naar zoeken</a>
<br/>
<a href="#language">> Change language</a>
</p>
<!-- /usable page-navigation -->
Veel gestelde vragen
- Waarom gebruik je Strict?
- Het Strict Doctype schrijft voor dat er geen verouderde elementen voorkomen. De kans dat een website op verschillende browsers hetzelfde werkt en verschijnt, is met het Strict Doctype groter.
- Na de implementatie door partij X valideert de website niet
- Een partij die de html-templates implementeert, moet deze 1-op-1 overnemen. Het kan voorkomen dat externe content voor fouten zorgt, dit is op te lossen door altijd een controle uit te voeren. Templates worden altijd valide en dus foutloos aangeleverd.
- Mijn CMS genereert dynamische id's. Is dat een probleem?
- Nee, dat is geen probleem. Als het CMS om kan gaan met een (beperkte) set html-componenten wordt het class attribuut gebruikt styles te declareren. CSS-selectors op basis van id's worden zo veel mogelijk vermeden.
- Mijn hoofdmenu bovenaan de pagina moet schalen.
- Dat kan, het menu in het html-document komt daardoor wel bovenaan te staan. Het is nauwelijks mogelijk om een menu absoluut te positioneren en de menu-items te laten schalen zonder dat de onderliggende inhoud er visueel onder gaat vallen.
