Toegankelijke websites zijn goed voor ons allemaal - overzicht met praktische tips

Johannes Mairhofer Laatst bijgewerkt op 08.05.2020
6 Min.
Toegankelijke website

Toegankelijke websites zijn niet langer een vermeend niche-onderwerp voor mensen met een handicap. Het gaat ons allemaal aan en helpt zelfs de SEO-fans onder u - een overzicht met praktische tips van Johannes Mairhofer.

Toegankelijkheid in de digitale ruimte is in feite een integrerend deel van het internet en is reeds vastgelegd in de gestandaardiseerde richtsnoeren ervan. En natuurlijk speelt het ook een belangrijke rol in de WordPress Codex. Alle gebruikers moeten gebruik kunnen maken van WordPress , ongeacht de taal die zij spreken, de economische status die zij hebben of de fysieke beperkingen waarmee zij te kampen hebben. Toch krijgt het onderwerp nog niet de aandacht die het verdient. Met name met het oog op de demografische ontwikkeling en de wil tot integratie moet de digitale barrièrevrijheid echter met WordPress -WordPress - projecten worden overwogen, aldus Johannes Mairhofer. Want: Toegankelijkheid is ook belangrijk vanuit ondernemers- en SEO-oogpunt.

Het idee van een toegankelijke website is niet nieuw

Om de technieken op het World Wide Web te standaardiseren is in 1994 het World Wide Web Consortium, of W3C, opgericht. Bijzonder belangrijke normen hier zijn:

  • HTML (nog steeds de basisstructuur van bijna elke website)
  • CSS (Cascading Style Sheets, bv. gebruikt in WordPress sjablonen)
  • WCAG (Richtlijnen voor toegankelijkheid van webinhoud)

De WCAG-richtlijnen worden ontwikkeld door het Web Accessibility Initiative (WAI), dat op zijn beurt een groep is van het W3C. Er zijn nu twee versies hier.

WCAG 1.0

  • Gebruik van opmaak en stylesheets
  • Apparaatonafhankelijk ontwerp

WCAG 2.0

Websites moeten

  • Waarneembaar (b.v. tekstalternatieven voor afbeeldingen)
  • Bedienbaar (b.v. te bedienen via toetsenbord)
  • Begrijpelijk (bijv. door eenvoudige taal)
  • Robuust (Compatibel)

zijn.

Het idee van een drempelvrije website is dan ook niet nieuw en is zelfs al sinds 2002 verankerd in de Verordening drempelvrije informatietechnologie (BITV). Dit betekent dat ten minste de websites van overheidsinstanties verplicht zijn drempelvrije inhoud aan te bieden.

Vooral voor nieuwe WordPress projecten: een drempelvrije website kan met zeer weinig moeite worden geïmplementeerd.

Hoe moet een website drempelvrij worden gemaakt? Veel punten zijn niet zo ingewikkeld als u misschien denkt en kunnen zonder veel moeite worden uitgevoerd.

De gemakkelijkste manier is natuurlijk met een pagina die net nieuw is aangemaakt en ontworpen. Maar ook reeds bestaande websites kunnen achteraf worden geoptimaliseerd. Er zijn een paar eenvoudige basisregels om te volgen.

1) Gebruik de paginatitel, navigatie en tags correct

De titel van de pagina staat daadwerkelijk in de titel en de koppen zijn logisch gestructureerd en ook als koppen opgemaakt, niet alleen vetgedrukt. Opsommingen worden uitgevoerd met opsommingstekens of punten, niet met een eenvoudige minteken. Op WordPress kan dit rechtstreeks in de editor worden gespecificeerd. Afhankelijk van het sjabloon en de gebruikte editor, zijn hier verschillende klassen van koppen beschikbaar. Door tags te gebruiken (bv. H1 en H2 voor koppen) kan de pagina gemakkelijker worden ervaren en genavigeerd door blinden die een schermlezer of het toetsenbord gebruiken.

Toegankelijke website: Lijstentag
Toegankelijke website hoofd
Fragmenten uit de tekst editor voor dit bericht: Hierboven kunt u zien dat de opsommingstekens als zodanig zijn gedefinieerd. Ook de subrubrieken zijn gedefinieerd als H3.

2) Doe zonder JavaScript en Flash in het ontwerp

Voor het ontwerp kunt u het beste HTML en CSS gebruiken. Javascript en Flash mogen niet worden gebruikt. Javascript is, zoals de naam al zegt, een scripttaal. Los van het feit dat het onveilig is, kan niet elk apparaat en elke browser met de code overweg. Aangezien de website op zoveel mogelijk apparaten beschikbaar moet zijn, wordt Javascript niet aanbevolen.

3) Scheid inhoud en ontwerp

De inhoud (tekst) en de vormgeving (lay-out) moeten volledig los van elkaar worden gezien. Door middel van verschillende CSS-varianten kan bijvoorbeeld het contrast van de pagina worden aangepast of kunnen de kleuren worden veranderd door een eenvoudige klik van de gebruiker. Dit kan mensen met een visuele handicap of kleurenblindheid helpen. Dit wordt ook gedaan door grote bedrijven als Pfizer.

In principe gebeurt dit al automatisch op WordPress . Zo kan bijvoorbeeld ook een sjabloon worden gewijzigd zonder dat de inhoud hoeft te worden veranderd. Als de website wordt geraadpleegd met een smartphone of tablet, wordt de lay-out ook automatisch aangepast.

4) Houd je aan het twee-zintuigen principe

Inhoud moet zo worden voorbereid dat hij door twee verschillende zintuigen kan worden waargenomen. Op die manier kan de website zonder veel moeite door zoveel mogelijk mensen worden ervaren. Dit kan bijvoorbeeld worden bereikt door de volgende maatregelen:

  • Afbeeldingsbeschrijving toevoegen aan afbeeldingen (kan rechtstreeks via de WordPress editor)
  • Ondertitels toevoegen aan video's (Youtube doet dit bijvoorbeeld automatisch)
  • Tekst structureren met koppen (kan in de editor)

Mijn tip voor een beter begrip van een toegankelijke website: doe zelf ervaring op

In theorie is het onderwerp niet altijd zo gemakkelijk te begrijpen. Ik sprak met Heiko Kunert, algemeen directeur van de Vereniging voor Blinden en Slechtzienden, over drempelvrije websites. Heiko is zelf blind en surft op het net met een schermlezer. Heiko deelt zijn ervaringen met websites en sociale netwerken en vertelt ons hoe hij op het web navigeert met zijn smartphone en een brailleleesregel.

Veel dingen die hier theoretisch worden behandeld, kunt u ook zonder veel moeite zelf uitproberen. Zo kunt u een gevoel krijgen van hoe uw pagina eigenlijk wordt gezien.

toegankelijke-website-braille-lezen
Een braillelijn. Bron: Wikimedia Commons. Licentie: https://creativecommons.org/licenses/by-sa/3.0/

Schermlezer en brailleleesregel zijn de twee meest gebruikte hulpmiddelen bij het surfen

Een schermlezer is software die tekst herkent en deze hardop voorleest. Om door webpagina's en -documenten te kunnen navigeren, is het daarom belangrijk dat tags worden gebruikt voor koppen en afbeeldingen. Hierdoor kunnen gebruikers door de webpagina navigeren met een schermlezer en toetsenbord of brailleleesregel.

Een variant van een schermlezer is b.v. NVDA. Deze variant is vrije software en gratis. Ik raad u aan het uit te proberen en uw eigen website op te roepen met het beeldscherm uitgeschakeld en te proberen door de menu's te navigeren.

Een brailleleesregel vertaalt de huidige regel op het scherm in braille. Deze lijn is echte hardware die op de computer is aangesloten. De brailleleesregel werkt in combinatie met een schermlezer.

Responsiviteit is het allerbelangrijkste voor een toegankelijke website

Computers, laptops, smartphones, tablets, smartwatches en tekstbrowsers. Het aantal apparaten dat kan worden gebruikt om toegang te krijgen tot een website is enorm. Een van de belangrijke punten van WCAG 2.0 is de beschikbaarheid van de website op zo veel mogelijk apparaten.

De meeste WordPress -sjablonen zijn nu min of meer responsive en maken de website in ieder geval toegankelijk op computer en smartphone. Afhankelijk van het sjabloon worden b.v. menu's aangepast, zijbalken getoond en verborgen, maar ook ontwerpen worden volledig aangepast. Dit wordt responsive web design genoemd. De toegang tot uw eigen website op een ander apparaat is gemakkelijk en onthullend.

Het net is geweldig. En het net is voor iedereen!

Het net en de permanente beschikbaarheid zijn geen nieuw terrein meer, maar vanuit het oogpunt van één generatie is het nog nieuw. De huidige generatie van 30-jarigen, maar ten laatste de daaropvolgende generaties, zijn eraan gewend dat het net altijd en overal beschikbaar is. Wij willen niet zonder de mogelijkheden van informatie en communicatie die het net met zich meebrengt, zelfs niet op oudere leeftijd.

De behoefte aan toegankelijke websites neemt dan ook toe en wordt van jaar tot jaar groter. Met behulp van de in WordPress geïntegreerde mogelijkheden en hulpmiddelen (b.v. beeldbeschrijving, koppen, CSS) is het mogelijk websites zonder veel moeite in ieder geval drempelvrij te maken.

Dat dit steeds belangrijker wordt, blijkt ook uit het feit dat steeds meer grote ondernemingen steeds meer waarde hechten aan digitale participatie. Naast het bovengenoemde voorbeeld van Pfizer biedt bijvoorbeeld Twitter al enige tijd de mogelijkheid om een beeldbeschrijving aan afbeeldingen toe te voegen, houdt Microsoft zich uitgebreid met dit onderwerp bezig en volgen vele anderen geleidelijk dit voorbeeld. Een gedetailleerd overzicht van positief toegankelijke websites is bijvoorbeeld hier te vinden.

Uiteindelijk is een toegankelijke website ook beter voor Google

Helaas maak ik veel te vaak mee dat SEO belangrijker is dan goede inhoud, dus ik ben geen grote fan van SEO-argumenten. Maar als webpagina's beter kunnen worden gelezen en geïnterpreteerd door schermlezers, is het ook gemakkelijker voor de Google bot om de bezochte pagina correct te classificeren.

Met WordPress is het al heel snel en eenvoudig om een ca. 80% drempelvrije website te maken.

Het is nog een lange weg naar 100% toegankelijkheid. En dat is voor veel kleine bedrijven en privé-blogs waarschijnlijk niet haalbaar. Maar met de mogelijkheden van WordPress is het gemakkelijk om ongeveer 80 procent toegankelijkheid te bereiken.

Door het gebruik van tags voor koppen en afbeeldingen en vooral de beschrijving van afbeeldingen, wordt al veel bereikt met weinig voordeel. Eenmaal de eigen website met een tekstbrowser te surfen geeft een idee van welke schroeven er nog gedraaid moeten en kunnen worden.

Als u de site voor een bedrijf beheert, is het altijd een goed idee om hem door blinden te laten testen om professionele feedback en tips te krijgen.

Johannes is zeer nieuwsgierig en heeft al verschillende stadia in zijn carrière bereikt. Van opgeleid IT-specialist tot freelance fotograaf, hij is veelzijdig op pad en kan dus de verschillende "brillen" van zijn klanten opzetten. Vandaag werkt hij als freelance fotograaf en consultant voor WordPress en fotografie. [Foto: Dennis Weißmantel]

Reacties op dit artikel

Laat een opmerking achter

Jouw e-mailadres zal niet worden gepubliceerd. Verplichte velden zijn met een * gemarkeerd.