Veelgemaakte fouten
De tien fouten die wij op overheidssites het vaakst tegenkomen, met per fout wat je anders doet en hoe je het zelf controleert.
Wij onderzoeken al jaren overheidswebsites en leggen elke bevinding vast. Hieronder staan de fouten die het vaakst terugkomen, en die je redactie zelf kan voorkomen.
Het mooie is dat het er niet zo veel zijn. De meeste bevindingen in een onderzoek gaan terug op een handvol misverstanden. Neem je die weg, dan verdwijnt het grootste deel in één keer.
Uit onze onderzoeken
De tien die het vaakst voorkomen
Het percentage laat zien op hoeveel van de onderzochte sites wij deze fout minstens één keer tegenkwamen.
| # | Sites | Wat er misgaat | Criterium |
|---|---|---|---|
| 1 | 68% | Tekst die er uit ziet als een kop en de functie heeft van een kop, wordt in de code niet opgemaakt als kop. | 1.3.1 |
| 2 | 57% | Tekst die er uit ziet als een lijst en de functie heeft van een lijst, wordt in de code niet opgemaakt als lijst. | 1.3.1 |
| 3 | 52% | Linkdoel is niet duidelijk af te leiden uit de linktekst of de linktekst samen met de context van de link. | 2.4.4 |
| 4 | 48% | Toegankelijke naam bevat niet alle zichtbare tekst. | 2.5.3 |
| 5 | 37% | Tekst die geen kop is, wordt in de code wel opgemaakt als kop. | 1.3.1 |
| 6 | 29% | Alleen kleur wordt gebruikt om informatie over te brengen. | 1.4.1 |
| 7 | 27% | Taalwissel van tekst is niet aangegeven in de code. | 3.1.2 |
| 8 | 26% | Titel beschrijft niet goed het onderwerp of doel van de pagina. | 2.4.2 |
| 9 | 24% | Foutmelding beschrijft niet dat er een verplicht invoerformaat is. | 3.3.3 |
| 10 | 23% | Foutmelding beschrijft niet waar de fout is. | 3.3.1 |
Nummer 1, 2 en 5 zijn niet drie fouten maar één misverstand: opmaak wordt aangezien voor structuur. Iets vet maken is niet hetzelfde als er een kop van maken.
Zelf voorkomen
Zes dingen om te leren
Hieronder bundelen wij de fouten naar het misverstand dat eronder zit. Bij elk onderwerp lees je hoe je het anders aanpakt en hoe je het zelf nakijkt, zonder ons.
1. Opmaak is geen structuur
Iets vet of groot maken is niet hetzelfde als het een kop maken.
Wie een pagina bekijkt, ziet aan de vorm wat een kop is: groter, vetter, meer ruimte eromheen. Wie de pagina laat voorlezen ziet die vorm niet. Een schermlezer leest alleen wat er in de code staat, en daar is vet gewoon vet, geen kop. Daarom kan iemand die blind is niet door de pagina springen van kop naar kop, zoals een ziende bezoeker met zijn ogen over de pagina springt. Hij moet alles van begin tot eind afluisteren. Hetzelfde geldt voor opsommingen die met streepjes zijn getypt in plaats van als lijst opgemaakt: een schermlezer kondigt dan niet aan dat er een lijst van vijf punten komt.
Wat je anders doet
Gebruik in de editor de kopniveaus (Kop 2, Kop 3) in plaats van tekst vet te maken. Gebruik de knop voor een opsomming in plaats van streepjes of bolletjes te typen. En andersom: maak geen tekst tot kop omdat hij groter moet lijken.
Hoe je het zelf controleert
Zet de opmaakweergave van de editor aan en kijk of elke tussenkop ook werkelijk een kop is. Of loop de pagina door met alleen de Tab-toets: wat niet als kop in de code staat, sla je over.
2. Afbeeldingen en hun tekstalternatief
Elke afbeelding heeft een tekstalternatief nodig, of juist uitdrukkelijk géén.
Een tekstalternatief is de zin die voorleessoftware oplest in plaats van de afbeelding. Daar gaan twee dingen mis. Soms ontbreekt hij, en dan hoort de bezoeker de bestandsnaam of niets. Soms staat er iets wat de afbeelding niet beschrijft, zoals "afbeelding" of "logo" of een lange uitleg die eigenlijk in de tekst thuishoort. Een derde geval wordt vaak vergeten: een afbeelding die puur versiering is, hoort een léég tekstalternatief te krijgen. Dan slaat een schermlezer hem over. Laat je het veld zomaar leeg, dan maakt de voorleessoftware er alsnog zelf iets van.
Wat je anders doet
Vraag je bij elke afbeelding af: draagt deze informatie over die niet al in de tekst staat? Zo ja, beschrijf kort wat er te zien is, niet "foto van", want dat wordt al aangekondigd. Zo nee, geef hem een leeg tekstalternatief.
Hoe je het zelf controleert
Dek de afbeelding af en lees de pagina. Mis je informatie, dan moet die in het tekstalternatief. Mis je niets, dan is de afbeelding decoratief.
3. Kleur als enige aanwijzing
Kleur mag iets benadrukken, maar het mag nooit het enige zijn dat iets duidelijk maakt.
Ongeveer één op de twaalf mannen ziet kleuren anders. Wie slechtziend is, ziet vooral verschil in helderheid en nauwelijks in kleur. Staat er "de verplichte velden zijn rood", dan heeft die bezoeker niets aan die zin. Contrast is hetzelfde probleem van de andere kant: lichtgrijze tekst op wit oogt rustig op een goed scherm in een donkere kamer, maar is onleesbaar op een telefoon in de zon of voor iemand met minder scherp zicht.
Wat je anders doet
Zet naast de kleur altijd iets anders: een woord, een sterretje, een pictogram, een onderstreping. Houd tekst donker genoeg tegen de achtergrond, PRO heeft daar kleuren voor die het altijd halen.
Hoe je het zelf controleert
Druk de pagina af in zwart-wit, of zet je scherm op grijstinten. Wat dan niet meer te onderscheiden is, leunde op kleur alleen.
4. Linkteksten die niets zeggen
Een link moet ook los van zijn omgeving te begrijpen zijn.
Een schermlezer kan alle links van een pagina achter elkaar opsommen, als een inhoudsopgave. Staat er dan tien keer "Lees meer", dan is die lijst waardeloos. Een tweede probleem: staat er op de knop "Aanvraag versturen" maar heet hij in de code "Verzenden", dan kan iemand die met zijn stem bedient niet zeggen "klik op Aanvraag versturen", de computer kent die naam niet.
Wat je anders doet
Schrijf in de linktekst waar de link heen gaat: "Lees meer over het onderzoek" in plaats van "Lees meer". Begin de naam van een knop met precies de woorden die erop staan.
Hoe je het zelf controleert
Lees alleen de linkteksten van de pagina, zonder de tekst eromheen. Snap je dan waar elke link heen gaat?
5. Formulieren en foutmeldingen
Een bezoeker moet vooraf weten wat er wordt gevraagd, en achteraf wat er mis ging.
Bij formulieren gaat het meestal mis op drie plekken. Een veld is verplicht, maar dat staat nergens zichtbaar, de bezoeker merkt het pas bij het versturen. Een veld vraagt een bepaald formaat, zoals een datum of een postcode, maar zegt niet welk. En als er dan iets misgaat, zegt de foutmelding wel dát er een fout is maar niet wáár, of hoe je hem oplost. Voor iemand die het formulier laat voorlezen is dat extra lastig: die kan niet even overzien welk veld rood is geworden.
Wat je anders doet
Zet "(verplicht)" in het zichtbare label, niet alleen in de code. Zeg bij het veld welk formaat wordt verwacht. Noem in een foutmelding het veld bij naam en zeg wat er moet gebeuren.
Hoe je het zelf controleert
Vul het formulier expres verkeerd in en lees wat er terugkomt. Weet je op grond van die melding precies wat je moet aanpassen?
6. Taal van de pagina en van stukken tekst
Een schermlezer moet weten in welke taal hij moet voorlezen.
Voorleessoftware kiest haar uitspraak op grond van de taal die in de code staat. Geef je bij een Engelse zin op een Nederlandse pagina niets aan, dan leest de software hem met Nederlandse klanken op en verstaat je bezoeker er weinig van. Dat speelt bij hele anderstalige pagina's, maar net zo goed bij één zin of een citaat.
Wat je anders doet
Markeer anderstalige tekst in de editor als die taal. In PRO zit daar een knop voor in de werkbalk. Voor een hele pagina in een andere taal gebruik je een anderstalige pagina.
Hoe je het zelf controleert
Laat de pagina voorlezen en luister naar de anderstalige stukken. Klinken ze als onzin, dan staat de taal niet goed.
Verantwoording
Hoe wij aan deze cijfers komen
Wij halen ze uit onze eigen opgeleverde onderzoeken van overheidswebsites, en uit de bevindingen die wij daarin hebben vastgelegd. Het zijn dus geen schattingen en geen algemene wijsheden, maar wat wij werkelijk zijn tegengekomen.
Wij tellen alleen de fouten mee die een redactie zelf kan oplossen. Technische afwijkingen laten wij erbuiten: die onderzoekt Dienst Publiek en Communicatie centraal, en jij kunt er als redacteur toch niets aan veranderen.