Deze vertaling is nog niet redactioneel gecontroleerd. De Duitse versie is leidend. Deutsche Fassung →
Barrierefreiheit
Waarom moet de volgorde van de inhoud in de code kloppen?
De volgorde in de code moet kloppen, omdat voorzegprogramma's een pagina precies in deze volgorde voorlezen — ongeacht hoe de inhoud op het scherm is geordend. Staat in de code de prijs voor de productnaam, hoort een blinde bezoeker eerst '89 euro' en weet niet waarvoor. Zichtbare ordening en code-ordening moeten samenvallen.
Twee weergaven van dezelfde pagina
Elk website bestaat dubbel: eenmaal als zichtbare vormgeving op het scherm en eenmaal als code waarin de inhoud achter elkaar staat. Moderne vormgevingstechnieken kunnen beide ontkoppelen — een element dat in de code helemaal onderaan staat, kan optisch boven links verschijnen. Voor ziendewebsitebezoekers onzichtbaar. Een voorzegprogramma maar volgt star de code. Een voorbeeld: uw prijslijst laat drie pakketten naast elkaar zien, in de code staan echter eerst alle drie titels, dan alle drie prijzen, dan alle drie beschrijvingen. De blinde bezoeker hoort 'Basis, Comfort, Premium, 29 euro, 59 euro, 99 euro' — en kan de prijzen niet meer aan de pakketten toewijzen.
Zo test onze meethartje de volgorde
Het testwerktuig axe-core herkent enkele technische signalen die op verstoorde volgorde wijzen — bijvoorbeeld aanduidingen die elementen uit de lezesstroom reißen. Of de voorzeg-volgorde van een concrete pagina inhoudelijk verstandig is, kan een machine echter alleen beperkt beoordelen: daarvoor moet je de inhoud begrijpen. Onze meethartje volgt hier zijn basiskeuze dat een onopvallende doorloop geen vrijbrief is — wat de automatiek niet zeker kan beslissen, geeft het rapport als 'handmatig testen' aan. Bij de Gouden Standaard laat een tester zich de pagina in code-volgorde geven en oordeelt of de inhoud zo verständig blijft.
Beispiele
Reihenfolge per CSS umgestellt
<div style="display:flex; flex-direction:column-reverse">
<p>Schritt 2: Termin bestätigen</p>
<p>Schritt 1: Termin wählen</p>
</div><div>
<p>Schritt 1: Termin wählen</p>
<p>Schritt 2: Termin bestätigen</p>
</div>Vorleseprogramme lesen den Quelltext in seiner Reihenfolge. Was optisch umgedreht wird, kommt falsch herum an.
- Vraag uw bureau de belangrijkste pagina's eenmaal zonder vormgeving — alleen als code-volgorde — door te zien.
- Controleer prijslijsten en vergelijkingstabellen extra nauwkeurig: daar scheidt de vormgeving samenhorende gegevens het vaakst.
- Let bij heropstellingen erop dat inhoud in de code waar inhoudelijk thuishoort wordt ingevoegd — niet waar het technisch gemakkelijk is.
- Test na grotere ontwerp-veranderingen met de Tab-toets: springt de markering alle kanten op, klopt meestal ook de code-volgorde niet.
- Neem de voorzeg-volgorde als acceptatiecriterium in contracten met uw bureau op.