Bij de trainingen die ik geef, komen vaak een aantal onderwerpen terug die regelmatig bevindingen opleveren bij een WCAG-onderzoek. Daarom hier een kort overzicht van deze meest voorkomende punten. Voor al deze punten geldt dat redacties niet altijd de mogelijkheid hebben in het gebruikte systeem, om dit correct toe te passen. Soms is het dus niet een redactionele kwestie maar ligt de oorzaak bij de techniek.
Koppenstructuur
Zorg dat iedere pagina één <h1> heeft en dat de daaropvolgende koppen geen niveau’s overslaan. Gebruik dus niet de opmaak van een kop om het niveau te kiezen. Tenslotte, zorg dat de kop de onderliggende inhoud beschrijft.
Alternatieve teksten
Bepaal eerst wat het type afbeelding is. Is de afbeelding nodig om de inhoud van de pagina te kunnen begrijpen? Dan is het een informatieve afbeeling. Geef deze afbeelding een alternatieve tekst mee.
Bepaal wat het type afbeelding is via de beslisboom van de W3C (Engels).
Media
Video is regelmatig niet goed te begrijpen als je een visuele en/of auditieve beperking hebt. Om te zorgen dat iedereen de video kan waarnemen, kun je bij een video een transcript plaaten, een voice-over en/of ondertiteling toevoegen.
Transcript
Een transcript is een volledig uitgeschreven tekst van alle hoorbare tekst en belangrijke geluiden in een video. Dit is ook handig voor degene die liever leest dan kijkt.
Voice-over
Dit is de hoorbare versie van het transcript, voor degene die slecht ziet maar via het gehoor toch de informatie uit de video tot zich wil nemen.
Ondertiteling
Mocht iemand wel goed kunnen zien, maar niet kunnen horen, dan is ondertiteling een handige toevoeging.
Contrast
Vaak zijn de kleuren bepaald door de vormgever, soms op basis van een bestaande huisstijl. Het komt regelmatig voor dat de huisstijl niet is ontwikkeld met voldoende contrast tussen de verschillende kleuren. Content editors hebben dan ook vaak niet de mogelijkheid om het contrast te beïnvloeden. Koppen en links hebben dan een van tevoren vastgestelde voor- en achtergrondkleur.
Toch kan er soms gekozen worden uit een bepaald type kop, link of knop, die verschillende kleurcombinaties hebben. In dat geval is het handig om te weten welke combinatie wel of juist niet voldoet.
Navigatie
Voor links is het belangrijk om deze een goede beschrijvende tekst te geven. Dus niet “klik hier” of “lees meer”, maar bijvoorbeeld “Lees meer over tips voor content editors”. Wat wel kan is dat alleen “Lees meer” zichtbaar is maar de volledige linktekst wordt voorgelezen door voorleessoftware.
Wees je ook bewust van het verschil tussen een link, die verwijst naar een andere (sectie op een) pagin, en een knop, die iets doet op een pagina (zoals een formulier insturen of een onderdeel openen).
Formulieren
Bij formulieren is het belangrijk om te zorgen dat ieder veld een juiste beschrijving heeft (via het <label>). Geef ook duidelijk of het verplicht is en wat er ingevuld moet worden. Als dat niet goed gaat, geef dan een duidelijke foutmelding, inclusief een beschrijving van wat er mis is gegaan en hoe dat opgelost kan worden.
Tabellen
Sommige gegevens dienen als een tabel te worden opgemaakt, omdat er een relatie is tussen alle data die alleen op die manier goed kan worden weergegeven. Geef net als bij regulier koppen ook de tabelkoppen (<th>) een juiste beschrijving van de data (in de <td>). De betere systemen geven de tabelkoppen in de code ook mee in welke richting die geörienteerd is (scope="col" of scope="row"). Als content beheerder heb je daar vaak geen controle op, helaas.
Geef de tabel zelf ook een beschrijving (<caption>).
Wees je er tenslotte bewust van dat het lastig is om tabellen goed responsive te maken. Er zijn hiervoor verschillende technieken, ook hiervoor ben je weer afhankelijk van de techniek. Gebruik een tabel dus echt alleen als het gaat ok tabulaire data en niet als hulpmiddel voor de opmaak.
PDF’s
Het kan complex zijn om PDF’s goed toegankelijk te maken. Vraag je dus altijd eerst af of het per sé nodig is om inhoud in een PDF te publiceren. Er kunnen goede redenen om dat wel te doen, maar als het mogelijk is om dit in HTML te doen, dan is het eenvoudiger toegankelijk te maken.
Een PDF moet aan dezelfde eisen voldoen als een webpagina, dus alle hierboven genoemde eisen gelden ook een een PDF-document. Dit kan eigenlijk alleen in Adobe Acrobat goed worden opgemaakt en dat vergt dan ook de nodige kennis, onder meer omdat het een draak van een programma is.
Tenslotte
De trainingen die ik geef hebben vaak de hierboven gevolgde structuur, maar zijn altijd aangepast aan de specifieke omgeving van de klant. Bovendien zorg ik ervoor dat er interactieve oefeningen zijn, toegepast op de relevante sites of PDF’s.
Wil je meer weten, neem dan contact met me op via LinkedIn.