1.3.1 Info en relaties

(Niveau: A)

Het doel van dit succescriterium is te zorgen dat informatie en onderlinge relaties die normaal zichtbaar of hoorbaar zijn door de opmaak, ook behouden blijven als die opmaak verandert.

Bijvoorbeeld: als een schermlezer de inhoud voorleest, of als een eigen stijlblad van de gebruiker de vormgeving van de auteur vervangt, moet diezelfde betekenis en structuur nog steeds duidelijk zijn.

Fouten bij 1.3.1

Succescriterium 1.3.1 kent een grote verscheidenheid aan fouten. In deze sectie beschrijven we een aantal fouten, zodat je ze kunt herkennen en kunt voorkomen.

Incorrect geformatteerde tabellen

Schermlezers hebben duidelijke tabelstructuren nodig in tabellen. Zo kunnen ze de informatie op de juiste manier overbrengen aan hun gebruikers. Vaak is een tabel visueel wel van een kop voorzien, maar programmatisch niet. Zo is de achtergrond anders gekleurd en de tekst dikgedrukt, maar is de rij programmatisch hetzelfde als de rijen daaronder. Lees meer over digitaal toegankelijke tabellen maken in HTML.

Visuele headers

Net als bij bezoekers die wel (goed) kunnen zien, is het voor gebruikers van een schermlezer handig om via een tussenkop een pagina snel te scannen. Schermlezers hebben namelijk een functie waarbij alleen de koppen opgelezen worden, niet de hele pagina. Zo komen ze snel bij het deel van de pagina waar ze willen zijn.

Hierbij is het wel belangrijk dat de koppen niet alleen visueel een kop zijn, maar ook programmatisch. In de praktijk gebruiken webredacteuren bijvoorbeeld vaak dikgedrukte tekst of tekst die handmatig groter is gemaakt. Wanneer dit in de code nog steeds een <p> is, missen schermlezers semantiek. Gebruik daarom bij tussenkoppen altijd headers (H2, H3 etc.). Dit gaat ook vaak fout in pdf-bestanden.

Opsommingen en lijsten

Opsommingen <ol> en lijsten <ul> worden vaak verkeerd gebruikt. Een van de meest gevonden fouten, is wanneer content visueel een opsomming is, maar programmatisch niet. Schermlezers kunnen deze content dan niet herkennen.

Lees meer over digitaal toegankelijke opsommingen en lijsten.

Quotes

Het HTML-element <blockquote> is bedoeld voor lange citaten en geeft programmatisch aan dat een stuk tekst een quote is. Een veelgemaakte fout is dat een quote alleen visueel als citaat wordt opgemaakt (bijvoorbeeld met inspringen, een andere kleur of aanhalingstekens), maar in de code gewoon een <p> of <div> blijft. Voor hulptechnologie gaat dan de relatie “dit is een citaat” verloren. Dit is daarom wél een 1.3.1-fout: de informatie en structuur die je visueel communiceert (een citaat) is niet programmatisch beschikbaar.

Een andere veelvoorkomende fout is het misbruiken van <blockquote> voor opmaak (bijvoorbeeld om tekst te laten inspringen of als ‘highlight’), terwijl het geen echt citaat is. Ook dat is een 1.3.1-probleem, omdat het onjuiste semantiek toevoegt: screenreaders krijgen dan onterechte structuur mee.

Lees meer over het correct toepassen van het blockquote-element.

Pdf-bestanden

Voor pdf-bestanden is het, net als bij webpagina’s, belangrijk dat alles in het document begrepen kan worden door assisterende software. Waar er bij webpagina’s met HTML gewerkt wordt, zijn dit bij pdf-documenten tags.

De meest gemaakte fout is wanneer een pdf-document niet of niet-volledig van tags voorzien is. Als dit gebeurt kunnen schermlezers het document niet of niet volledig oplezen.

Veelgemaakte fouten bij websites, zoals tabellen, lijsten en kopstructuren gaan ook regelmatig bij pdf-documenten fout. Lees voor meer informatie het kennisbankartikel ‘Waar moet je op letten bij toegankelijke pdf’s?’.

Informatie, structuur en relaties overgebracht door presentatie kunnen door software bepaald worden of zijn beschikbaar in tekst.

Hulp bij digitale toegankelijkheid

Wij zijn een full-service partner voor digitale toegankelijkheid: bewustwording, advies en borging. Samen maken we digitale dienstverlening toegankelijk en inclusief.