13 | Zelf aan de slag!
Vijf tips om content toegankelijk te maken
Digitaal toegankelijke content maken? Voorkom deze 5 fouten
Een website of app kan perfect toegankelijk gebouwd zijn. Maar als je het redactioneel ‘verprutst’, is het resultaat onverbiddelijk: een ontoegankelijke website of app. Hoe zorg je voor digitaal toegankelijke content? Waar begin je? In dit artikel vind je de 5 meestgemaakte redactionele fouten. En lees je hoe je deze fouten voorkomt.
Voor wie doe je het eigenlijk?
Overheidsorganisaties bieden hun diensten steeds meer digitaal aan. Daarom is het belangrijk – en wordt het steeds urgenter – dat deze diensten voor iedereen gebruiksvriendelijk en bruikbaar zijn. Met de nadruk op iedereen. Digitale toegankelijkheid is namelijk niet alleen nodig voor mensen met een visuele of auditieve beperking. Het is ook belangrijk voor de vindbaarheid in zoekmachines. En voor mensen die tijdelijk of door de situatie beperkt zijn. Je kunt bijvoorbeeld een gebroken arm hebben en je muis niet kunnen bedienen. Of je kunt in een stiltecoupé van de trein zitten en geen geluid kunnen aanzetten. Ook dan is het fijn als je goed met je toetsenbord kunt navigeren of ondertiteling bij filmpjes kunt aanzetten. Hieronder vind je de 5 meestgemaakte redactionele fouten die uit toegankelijkheidsonderzoeken onder overheidswebsites naar voren komen.
1. Tussenkoppen die verkeerd gemarkeerd zijn
Uit onderzoek blijkt dat tussenkoppen vaak vet– of schuingedrukt zijn. Dit valt visueel wel op, voor mensen die goed kunnen zien. Maar voor blinden of slechtzienden die een schermlezer gebruiken, zijn deze opmaakkenmerken niet bruikbaar. Als zij een indruk willen krijgen van de inhoud van de webpagina, kan de schermlezer geen overzicht maken van de content. Het herkent de vet- of schuingemaakte woorden niet als tussenkoppen.
Hoe dan wel?
Pas de koppenstructuur toe die het Content Management Systeem (CMS) biedt. Die koppenstructuur zorgt ervoor dat iemand die een schermlezer gebruikt een duidelijk inhoudelijk overzicht van een webpagina krijgt. De titel van een artikel op een webpagina krijgt (vaak automatisch in het CMS) H1, oftewel Heading 1. De koppen die een niveau dieper liggen geef je H2 mee. Het volgende niveau krijgt H3. Enzovoorts. Vergelijk het met de inhoudsopgave of opbouw van een Word-document, waar je een titel hebt, hoofstukken, paragrafen en subparagrafen.
Kijk op Kennisbank DigiToegankelijk voor meer informatie over toegankelijke koppen.
2. Afbeeldingen die geen of geen goede alt-tekst hebben
Een afbeelding is niet voor iedereen toegankelijk. Daarom is het nodig dat je een toegankelijk alternatief aanbiedt. In de zogenaamde alt-tekst (kort voor alternatieve tekst) geef je een omschrijving van wat er op de afbeelding te zien is. Geef je geen omschrijving? Dan negeert de schermlezer de afbeelding. Geef je een te korte omschrijving? Dan kan het zijn dat een blinde of slechtziende persoon die de tekst voorgelezen krijgt, onvoldoende informatie meekrijgt.
Hoe dan wel?
Geef elke afbeelding een duidelijke omschrijving in de alt-tekst. Gebruik zo’n 150 leestekens inclusief spaties. Heb je meer ruimte nodig omdat je bijvoorbeeld een infographic of een kaart wilt omschrijven? Dan kun je in de alt-tekst verwijzen naar een uitgeschreven tekst. Voeg die toe onder de afbeelding of maak een link naar een tekst in een bestand. Is een afbeelding puur decoratief en heeft deze geen informatieve functie? Laat de alt-tekst dan leeg. Zo slaat de schermlezer de afbeelding over. Wees hier wel kritisch op en terughoudend in. Er is vaak een goede reden waarom je een bepaalde afbeelding toevoegt.
Kijk op de kennisbank van DigiToegankelijk voor meer informatie over toegankelijke afbeeldingen.
3. Tabellen die niet correct zijn opgemaakt
Een tabel bestaat uit rijen, kolommen en cellen met inhoud. Als je geen koppen boven de kolommen of voor de rijen zet, dan ontbreekt de structuur en leest de schermlezer de inhoud op een onlogische manier voor.
Hoe dan wel?
Om te beginnen: maak tabellen niet te ingewikkeld. Bedenk goed hoe je data zo duidelijk mogelijk kunt weergeven. Dit kan bijvoorbeeld betekenen dat je een complexe tabel opsplitst in meerdere eenvoudige tabellen. Of misschien is het wel duidelijker om de informatie niet in een tabel, maar in een opsomming te zetten. Markeer de bovenste cellen van de kolommen of de eerste cellen van de rijen als kopcellen. Dan begrijpt de schermlezer de structuur van de tabel en wordt de inhoud op een duidelijke en logische manier voorgelezen.
Kijk op DigiToegankelijk voor meer informatie over toegankelijke tabellen.
4. Opsommingen die niet goed zijn opgemaakt
Soms worden opsommingen gekopieerd vanuit Word of een ander document. Als je de informatie dan in het CMS plakt, bestaat het risico dat de juiste opmaak verloren gaat. Het gevolg: een lijst waarin de streepjes of cijfers onderdeel uitmaken van de tekstregels zelf. Een schermlezer herkent dit niet als opsommingslijst met een specifiek aantal regels. Het is voor een blinde of slechtziende gebruiker dan onduidelijk uit hoeveel items een opsomming bestaat.
Hoe dan wel?
Gebruik altijd de opsommingstekens of nummering in het CMS. Daarmee geef je een duidelijke structuur mee aan een opsommingslijst en kan de schermlezer ermee overweg.
Kijk op Kennisbank DigiToegankelijk voor meer informatie over toegankelijke opsommingen.
5. Kleuren die onvoldoende contrast hebben
Tekst wordt slecht leesbaar wanneer er onvoldoende contrast is tussen kleuren. Denk bijvoorbeeld aan gele tekst op een oranje achtergrond. Dit is slecht leesbaar voor mensen met normaal zicht, en al helemaal voor mensen met een visuele beperking.
Hoe dan wel?
Houd bij het ontwikkelen van jouw huisstijl al rekening met kleurgebruik en voldoende contrast. Dan kan de websitebouwer dit verwerken in de vormgeving en opmaakstijlen van de website. Ga je zelf aan de slag met tekst, afbeeldingen of grafieken? Check het kleurcontrast met gratis hulpmiddelen. Als je grafieken of diagrammen maakt, is het belangrijk dat je niet alleen met kleur communiceert. Stel, je maakt een taartdiagram. Zorg dan dat de verschillende taartpunten een kleur hebben, maar geef ook andere vormelementen mee. Bijvoorbeeld letters, streepjes, golfjes en stippen. Mensen die kleuren niet goed kunnen onderscheiden, zien dan toch de verschillende onderdelen.
Kijk op Kennisbank DigiToegankelijk voor meer informatie over toegankelijke kleurgebruik en een handig overzicht van hulpmiddelen.
Houd de aandacht vast
Digitaal toegankelijke content maken is geen project met een afgesproken eindstation. Je kunt toewerken naar een verklaring met status A (volledig digitaal toegankelijk) die je terugvindt op het Dashboard DigiToegankelijk. Maar ook hierna blijft er nieuwe content gemaakt worden. Houd daarom de aandacht vast en zorg dat je de opgedane kennis vastlegt, toepast en deelt met je collega’s. Blijf werken aan een bruikbare, gebruiksvriendelijke en toegankelijke website, voor iedereen.
Handleiding: naar een digitaal toegankelijke organisatie
Kennissessies en vragenuurtjes
DigiToegankelijk helpt je verder met wekelijkse gratis bijeenkomsten (kennissessies en vragenuurtjes) over allerlei onderwerpen. Weet jij bijvoorbeeld hoe je een app kunt testen op toegankelijkheid? Hoe het zit met de zogenoemde inventarisatielijsten? Of hoe je moet omgaan met zwartgelakte pdf-documenten?
Bekijk het overzicht van alle bijeenkomsten.
Kennisbank DigiToegankelijk
Van voldoen aan de wet tot weten hoe je op de juiste manier content aanbiedt: er is van alles te leren over toegankelijkheid. En dat is hard nodig, want alle overheidswebsites en -apps moeten digitaal toegankelijk zijn. Werk je bij de overheid? Dan helpt de kennisbank van DigiToegankelijk je verder.