WordPress Accessibility: Hoe maak je een toegankelijke website (+ plugins hiervoor)?

Maddy Osman Laatst bijgewerkt op 10/19/2020
12 Min.
WordPress-Toegankelijkheid
Laatst bijgewerkt op 10/19/2020

Toegankelijkheid in WordPress is een belangrijk onderdeel van het bouwen van websites dat niet genoeg wordt besproken. Maar hoe toegankelijk is het populaire CMS eigenlijk? Waarom is toegankelijkheid zo belangrijk? En hoe kunt u uw website voor iedereen toegankelijk maken?

Toegang voor iedereen: feiten over toegankelijkheid

WordPress krijgt meer dan 35 procent van alle websites aan de praat. E-commercesites, grote online publicaties, nieuwskanalen, blogs en bedrijfswebsites gebruiken WordPress omdat het gemakkelijk te gebruiken is.

En juist omdat WordPress zo populair is, heeft het een grote invloed op de toegankelijkheid van het web. Toegankelijkheid is echter niet altijd het belangrijkste aandachtspunt bij het ontwikkelen en herontwerpen van een website. In plaats daarvan houden veel WP-gebruikers zich bezig met het kiezen van de juiste Theme , het verbeteren van hun SEO-ranking, en ervoor zorgen dat hun site snel laadt. Daar is niets mis mee - maar het zou net zo belangrijk moeten zijn dat uw WordPress site voor iedereen toegankelijk is. 

Volgens de statistieken van Interactive Accessibility leven 56 miljoen Amerikanen met een handicap. Bovendien stelt het Pew Research Center dat 54 procent van de Amerikaanse volwassenen met een handicap regelmatig gebruik maakt van het internet. En dat is alleen de Verenigde Staten. Wereldwijd nemen deze aantallen toe.

Als u de kwestie van toegankelijkheid negeert, sluit u vandaag al 20 procent van de wereldbevolking uit van de mogelijkheid om uw website te gebruiken. Kortom, verwaarlozing van de toegankelijkheid is niet goed voor uw bedrijf. Maar belangrijker nog, het is vreselijk voor het creëren van een rechtvaardigere en eerlijkere wereld. 

Dus als je je ooit hebt afgevraagd hoe je een toegankelijke website maakt met WordPress , dan is deze gids iets voor jou. We zullen een aantal belangrijke vragen beantwoorden, waaronder:

  • Wat is webtoegankelijkheid?
  • Is WordPress "out of the box" toegankelijk?
  • Welke tools en Plugins helpen je om een toegankelijke WP site te maken? 

Wat is webtoegankelijkheid?

Webtoegankelijkheid verwijst naar de hulpmiddelen die mensen met een handicap in staat stellen het web te gebruiken en er toegang toe te krijgen. Dit is met name relevant voor handicaps die van invloed kunnen zijn op de manier waarop mensen toegang krijgen tot en gebruik maken van het web, zoals:

  • Visuele Beperkingen
  • Akoestische stoornissen
  • Beperkingen van de taal
  • Cognitieve handicaps 
  • Neurologische handicaps
  • Tijdelijke invaliditeit (zoals een gebroken arm)

Deze lijst omvat leeftijdsgebonden handicaps - en zelfs handicaps als gevolg van een trage internetverbinding. Een van de belangrijkste redenen waarom toegankelijkheid zo belangrijk is, is de steeds grotere rol die het internet in ons dagelijks leven speelt: van toegang tot informatie en het laatste nieuws tot boodschappen doen en contact houden met onze dierbaren.

Meer redenen waarom toegankelijkheid belangrijk is op het internet: 

Gezien het belang van het Internet in een moderne wereld, moet het Web toegankelijk zijn voor iedereen, ongeacht status of bekwaamheid.

Is WordPress "out of the box" toegankelijk? 

WordPress was niet altijd bereikbaar: Nog maar een paar jaar geleden hadden gebruikers die op het web afhankelijk waren van ondersteunende technologieën, grote problemen om door het admin-dashboard te navigeren.

WordPress Accessibility: Hoe maak je een toegankelijke website (+ plugins hiervoor)?

Sindsdien is er veel veranderd. Ten eerste heeft een kleine groep vrijwilligers - het zogenaamde Make WordPress Accessible Team - de toegankelijkheid van WordPress aanzienlijk verbeterd.  

Als resultaat van hun werk is het admin gedeelte veel toegankelijker geworden samen met de media bibliotheek en Theme Customizer. Bovendien zijn er talrijke sneltoetsen toegevoegd aan WordPress Core om het bewerken en opmaken van berichten en pagina's te versnellen. 

De coderingsnormen voor de toegankelijkheid van WordPress zijn in maart 2016 toegevoegd aan het Core-handboek vanWordPress . Sindsdien moeten Themes en Plugins een strenge toegankelijkheidscontrole doorstaan om überhaupt als toegankelijk te worden geclassificeerd.

Wat is het Core Contributor Handbook?

De handleiding definieert de coderingsstandaarden waaraan WP ontwikkelaars moeten voldoen wanneer ze hun bijdragen toevoegen aan de WordPress core en wanneer ze Themes en Plugins indienen bij de officiële repository.

Hoewel er belangrijke wijzigingen en verbeteringen zijn aangebracht, moet WordPress nog het een en ander doen op het gebied van toegankelijkheid. Hoewel WordPress ernaar streeft te voldoen aan de Authoring Tool Accessibility Guidelines (ATAG) 2.0, zijn er nog andere kwesties die 100% toegankelijkheid in de weg staan: 

  • Theme- en Plugin- derde-partij-ontwikkelaars houden zich niet altijd aan de toegankelijkheidsrichtlijnen. De meeste toegankelijkheidsproblemen op WordPress zijn dan ook te wijten aan niet-toegankelijke Themes en Plugins .
  • De nieuwe Gutenberg editor 90 toegankelijkheidsproblemen had op het moment van zijn vrijlating. (Op het moment van dit schrijven zijn er nog slechts 22 kwesties onopgelost).
WordPress Accessibility: Hoe maak je een toegankelijke website (+ plugins hiervoor)?

Tips voor het maken van een toegankelijke WP-site

Wanneer u een toegankelijke website maakt, zijn er bepaalde principes die zijn vastgelegd in de Web Content Accessibility Guidelines. U moet ze zeker gebruiken om ervoor te zorgen dat iedereen uw website kan gebruiken. 

Checklist voor de toegankelijkheid van websites

  • Waarneembaar: Alle gebruikers moeten de onderdelen van de informatie en de gebruikersinterface kunnen waarnemen.
  • Bruikbaar: Ongeacht het apparaat dat gebruikers gebruiken om uw website te openen, moeten de onderdelen van de gebruikersinterface en de navigatie bruikbaar zijn.
  • Begrijpelijk: Alle gebruikers moeten zowel de informatie als de gebruikersinterface kunnen begrijpen.
  • Robuust: Zowel gebruikers als verschillende gebruikersagenten (met inbegrip van ondersteunende technologieën) moeten de inhoud van de website kunnen lezen en begrijpen. 

Op basis van deze vier basisprincipes zijn hier enkele van de richtlijnen die u moet volgen bij het maken van een toegankelijke website met WordPress . 

Richtlijnen om ervoor te zorgen dat uw website opvalt

  • Links en knoppen mogen niet van de rest van uw inhoud worden onderscheiden door kleur alleen.
  • Brailleondersteuning te bieden en tekstalternatieven te bieden voor visuele en auditieve inhoud, zoals afbeeldingen en video's.
  • Stel de tekstbreedte en de lijndikte in op een grootte die de leesbaarheid maximaliseert.
  • Zorg ervoor dat er voldoende contrast is tussen uw tekst en de achtergrond. Met andere woorden, gebruik geen felrode tekst op een zwarte achtergrond.
  • Audio- en video-inhoud moeten transcripties, bijschriften of gebarentaal bevatten.
  • Geanimeerde GIF's, knipperende animaties en andere inhoud die epileptische aanvallen en lichamelijke reacties kan veroorzaken, moeten worden vermeden.

Richtlijnen om ervoor te zorgen dat uw website bruikbaar is

  • Maak geen gebruik van CAPTCHA of bied meerdere manieren aan om ze op te lossen, omdat ze voor veel mensen problemen kunnen opleveren.
  • Links mogen geen inhoud in een nieuw venster openen zonder uw gebruikers daarvan op de hoogte te brengen of zonder voorafgaande interactie van uw gebruikers.
  • Zorg ervoor dat uw gebruikers via het toetsenbord en de muis toegang hebben tot knoppen en menu-items (evenals dropdown menu's). 
  • Media-elementen zoals video, audio, carrousels of schuifbalken mogen niet worden ingesteld om automatisch af te spelen of te veranderen zonder interactie van de gebruiker.

Richtlijnen om ervoor te zorgen dat uw website begrijpelijk is

  • Denk bij het ontwerpen aan verschillende viewports en pas de positie en het uiterlijk van de belangrijkste elementen dienovereenkomstig aan.
  • Gebruik koppen om verschillende subsecties van een pagina aan te geven.
  • Vermijd het gebruik van jargon, moeilijke termen en afkortingen. Zorg er in plaats daarvan voor dat uw inhoud duidelijk en beknopt geschreven is.
  • Links moeten beschrijvend zijn en zin hebben zonder context. Het is bijvoorbeeld beter om een knop of link te hebben met de tekst "Meer informatie over onze diensten" dan gewoon "Meer informatie".

Richtlijnen om ervoor te zorgen dat uw website robuust is

  • Voeg bovenaan elke pagina links toe om over te slaan.
  • Zorg ervoor dat uw formuliervelden de juiste labels hebben. Uw formulieren moeten ook waarschuwings- en bevestigingsberichten bevatten die gemakkelijk te zien zijn voor kleurenblinden.
  • Gebruik tabindex om een element dat normaal geen focus krijgt, zoals
    of , in de navigatievolgorde te plaatsen wanneer het gebruikt wordt voor interactie
    .
  • Downloadbare media zoals PDF-documenten, audio- of video-inhoud moeten een beschrijving hebben die aangeeft dat een download op het punt staat te beginnen.
  • Niet-standaard interactieve elementen, zoals accordeons of tabbladen, moeten een betekenis hebben volgens de WAI-ARIA Rollen.

Beste WordPress toegankelijkheid Plugins en hulpmiddelen

Als u de bovenstaande richtlijnen volgt, zal uw website toegankelijk zijn. Het is echter niet altijd even gemakkelijk om al deze regels en richtlijnen in de gaten te houden.

Gelukkig zijn er een aantal Plugins en tools voor meer WordPress , die u kunnen helpen sneller toegankelijke websites te maken - zonder belangrijke stappen te vergeten. 

WP Toegankelijkheid

WP-Toegankelijkheid

WP Accessibility is een van de beste WordPresss Accessibility Plugins uit de officiële WordPress Plugin repository. Het heeft een 5-sterren rating en meer dan 30.000 actieve installs. De Plugin adresseert en repareert veel voorkomende problemen met betrekking tot toegankelijkheid in WP-Themes. 

Belangrijkste kenmerken van WP Toegankelijkheid:

  • Links toevoegen met aangepaste bestemmingen
  • Een schets toevoegen aan de toetsenbordfocusstatus
  • Verwijder tabblad index van focusable elementen
  • lange beschrijvingen aan foto's toevoegen
  • Forceer Alt attributen voor afbeeldingen in de klassieke editor

WP Accessibility repareert ook toegankelijkheidsproblemen in WordPress Core, zoals het verwijderen van onnodige titelattributen uit paginalijsten, categorielijsten en archiefmenu's.

De beste WordPress Accessibility Plugin voor: Bedrijven met bestaande websites die hun toegankelijkheid willen verbeteren.

Prijs: U kunt WP Accessibility gratis downloaden van de officiële repository. 

Werkbalk ToegankelijkWP

WPA-toegankelijke werkbalk

AccessibleWP Toolbar, voorheen bekend als Accessible Poetry, heeft een 4.5 sterren rating en meer dan 4.000 actieve installs. De WordPress Plugin maakt het u gemakkelijk om bepaalde functies in te schakelen en uw website toegankelijker te maken. 

Belangrijkste kenmerken van AccessibleWP Toolbar:

  • Schakel toetsenbordnavigatie in, zodat gebruikers met hun toetsenbord op uw website kunnen navigeren,
  • Gebruikers kunnen CSS3 animaties uitschakelen
  • Gebruikers kunnen de kleuren van de website veranderen in kleuren met een beter contrast
  • Gebruikers kunnen de kleuren van de website veranderen in grijstinten
  • Gebruikers kunnen de lettergrootte op uw website vergroten of verkleinen

De beste WordPress Accessibility Plugin voor: Bedrijven die een meer toegankelijke website willen, maar een merkspecifiek kleurenschema en algemene esthetiek willen behouden. 

Prijs: U kunt AccessibleWP Toolbar gratis downloaden van de officiële repository. 

Toegankelijkheid met één klik

Toegankelijkheid met één klik

Het populaire WordPress -Plugin voor toegankelijkheid, One Click Accessibility, werd oorspronkelijk ontwikkeld voor het Pojo Framework en is nu compatibel met alle WordPress -Themes . De Plugin heeft een waardering van 4,5 sterren en meer dan 30.000 actieve installaties. 

Belangrijkste kenmerken van One Click Accessibility: 

  • Gebruikers kunnen lettergrootte, contrast, onderstrepen van links, leesbare lettertypes inschakelen of regelen met een toegankelijkheidswerkbalk
  • Links overslaan activeren
  • Voeg contourfocus toe voor focusbare elementen
  • Doelattributen uit links verwijderen en landmark-rollen toevoegen

De beste WordPress Accessibility Plugin voor: Websites die oorspronkelijk gemaakt zijn binnen het Pojo framework.

Prijs: One Click Accessibility kan gratis worden gedownload van de officiële repository. 

WordPress Toegankelijkheidshelper

WordPress - Toegankelijkheid-Helper

WordPress Accessibility Helper heeft een waardering van 5 sterren en meer dan 10.000 actieve installaties. De Plugin biedt een gratis versie met een uitgebreide set functies. De premium versie biedt nog meer functies, waaronder de mogelijkheid om modale vensters en popups te beheren, accordeons toe te voegen en logo's aan te passen.

Belangrijkste kenmerken van WordPress Accessibility Helper

  • Links overslaan toevoegen
  • Lettergrootte instellen volgens uw wensen
  • Pagina's en berichten controleren op toegankelijkheidsfouten
  • Stel aangepaste kleuren in voor een beter/donkerder contrast
  • Onderstreep of markeer alle links

De beste WordPress Accessibility Plugin voor: Bedrijven die een robuuste Plugin nodig hebben om toegankelijkheid een belangrijk kenmerk van hun website en bedrijf te maken. 

Prijs: WordPress Accessibility Helper is gratis te downloaden. U kunt de Pro-versie kopen voor $80, waarmee u de Plugin op een website kunt installeren en drie maanden ondersteuning krijgt. 

WP ADA-conformiteitscontrole Basis

WP-ADA-Compliance-Check-Basic

WP ADA Compliance Check Basic controleert uw website op webtoegankelijkheidsproblemen en voorziet u van een gedetailleerd rapport hierover. De beoordeling is gebaseerd op de Web Accessibility Standards Section 508 en WCAG 2.1 LEVEL A/AA. 

Belangrijkste kenmerken van WP ADA Compliance Check Basic

  • Evalueer uw website op webtoegankelijkheidsproblemen
  • Toegankelijkheidsrapporten uitvoeren
  • Gemakkelijk te volgen instructies voor het oplossen van toegankelijkheidsproblemen
  • Automatische correctie van toegankelijkheidsproblemen (alleen Premium-versie)
  • Problemen met het identificeren van bestanden in Theme(alleen in de Premium versie)

De beste WordPress Accessibility Plugin voor: Bedrijven die zich vooral willen richten op de wettelijke richtlijnen voor webtoegankelijkheid, of bedrijven die geïnteresseerd zijn in de tijdbesparende auto-correctie functie van de premium versie.

Prijs: WP ADA Compliance Check Basic is gratis te downloaden en beperkt tot 25 berichten of pagina's. De premium versie begint bij $165 voor één website en geeft u een jaar lang ondersteuning en updates. 

toegangsmonitor

Toegangsmonitor

De Plugin Access Monitor heeft een 5-sterren rating en 400 installaties. De Plugin voegt geen toegankelijkheidsvoorzieningen aan uw website toe, maar stelt u in staat te controleren hoe toegankelijk uw site momenteel is. Het voert ook een automatische toegankelijkheidscontrole van uw website uit, die wordt gecontroleerd door de webtoegankelijkheidsdienst Tenon.io

Belangrijkste kenmerken van Access Monitor

  • Plan wekelijkse of maandelijkse bereikbaarheidsrapporten.
  • Test een specifieke reeks pagina's
  • Leer over toegankelijkheidsproblemen die machinaal definitief kunnen worden vastgesteld.

De beste WordPress Accessibility Plugin voor: Bedrijven die een eenvoudige, gratis manier willen om regelmatig toegankelijkheidsproblemen op te sporen. 

Prijs: Access Monitor kan gratis worden gedownload van de officiële repository. 

Een opmerking over WordPress Plugins en toegankelijkheid

Het is belangrijk op te merken dat net als WordPress Themes , Plugins door iedereen kan worden ingediend en tijdens het beoordelingsproces een optionele Toegankelijkheidscontrole zal ondergaan. Als gevolg daarvan voldoen veel WordPress Plugins niet aan de digitale toegankelijkheidsrichtlijnen - en het gebruik ervan kan uw website ontoegankelijk maken. 

Bekende voorbeelden van dergelijke Plugins zijn slider- of carrousel-Plugins, die zijn ingesteld om automatisch af te spelen of te pauzeren bij toetsenbordinteractie. Een ander voorbeeld is een formulierPlugin dat niet over correct gelabelde velden beschikt. Met dit in gedachten moet u uw site opnieuw testen op toegankelijkheid telkens wanneer u een nieuwe Plugin installeert. 

WordPress Themes en toegankelijkheid

Helaas, als u naar de officiële repository van WordPress gaat en uw zoekopdracht filtert op toegankelijk Themes , zult u zien dat er slechts 108 Themes zijn, die als toegankelijk zijn gemarkeerd. 

WordPress -Themes

Zoals eerder vermeld, kunnen Theme-verkopers dankzij de inspanningen van het Make WordPress Accessible Team hun Theme tijdens het beoordelingsproces indienen voor een optionele toegankelijkheidsbeoordeling. 

Om het label "Accessibility Ready" te krijgen, moet een Theme voldoen aan een reeks digitale toegankelijkheidsrichtlijnen die zijn opgenomen in de Theme Review Manual en de officiële WordPress Codex

Ontwikkeling van toegankelijke WordPress pagina's

Laten we eerlijk zijn, de meeste WP gebruikers zullen kiezen voor een premiumTheme van derden marktplaatsen of een volledig op maat gemaakt thema. 

Als je een ontwikkelaar bent die een toegankelijke WordPress site moet maken, zijn er een paar thema's die je als uitgangspunt kunt gebruiken.

Underscores

Underscores

Underscores is ontwikkeld door Automattic en is een startpunt voor de meeste WordPress .com beschikbaar Themes. De Theme bevat verschillende toegankelijke functies. 

Genesis door StudioPress

Genesis

Genesis by StudioPress is een populair premium framework dat gebruikt kan worden om uw eigen toegankelijke Genesis Child-Theme te ontwikkelen. Als alternatief kunt u een van de bestaande kindThemes met toegankelijke functies gebruiken.  

GeneratePress

GeneratePress

GeneratePress is een andere populaire Theme, die toegankelijk is en kan worden gebruikt als uitgangspunt voor uw ontwerp.

WCAG Theme

WCAG-Theme

WCAG Theme is speciaal ontworpen met toegankelijkheid in gedachten en voldoet aan Section 508 & WCAG 2.0 AA. Bovendien heeft het volledige toetsenbordondersteuning. 

Astra

Astra

Astra is een populaire Theme met gratis en premium versies die beschikt over een toegankelijke tag, compatibiliteit met populaire paginabouwers Plugins en snelle laadtijden.

Astra geeft u een toegankelijke basis voor uw WP site en versnelt de ontwikkelingstijd en het proces. 

Verdere bronnen over toegankelijkheid in WordPress

Wat WordPress en toegankelijkheid betreft, is er op internet een schat aan informatie te vinden. Als u meer wilt weten over toegankelijkheid, zijn hier enkele goede plaatsen om uw onderzoek te beginnen:

  • Toegankelijk maken WordPress Themes: Een presentatie door Joseph Karr O'Connor van WordCamp 2013 in Montreal. De presentatie behandelt toegankelijkheid in het algemeen en de toepassing ervan in WordPress , waaronder het maken van toegankelijke Plugins, Themes en widgets, en het toegankelijker maken van uw inhoud.
  • WordPress Ontwikkelgereedschappen en Toegankelijkheid Plugins: Een lijst van gereedschappen en hulpbronnen van het Make WordPress Accessible team om u te helpen bij het testen en verbeteren van toegankelijkheidsvoorzieningen op uw websites.
  • Maak WordPress Toegankelijke Homepage: De officiële blog van het Make WordPress Accessible team, waar je het laatste nieuws kunt lezen en kunt helpen WordPress toegankelijker te maken.
  • WAVE Web Accessibility Evaluation Tool (Evaluatie-instrument voor webtoegankelijkheid): Gebruik dit hulpmiddel om uw site te testen op toegankelijkheid. Na een scan zal het hulpmiddel u problemen tonen die u moet oplossen om aan de toegankelijkheidsrichtlijnen te voldoen. 
  • Sterk: Wanneer u begint met het bouwen van uw website in Sketch of Adobe XD, zal deze Plugin u helpen ervoor te zorgen dat uw website projecten toegankelijk zijn vanaf het begin. 
  • Kleurenwiel voor toegankelijkheid: gebruik dit hulpmiddel om kleuren te kiezen die voldoende contrast hebben en aan de toegankelijkheidsrichtlijnen voldoen. U kunt ook zien hoe mensen die aan kleurenblindheid lijden de kleuren zien die u kiest. 
  • Axe Chrome-extensie: Als u Chrome gebruikt, kunt u met deze extensie elke website met één klik controleren op toegankelijkheidsproblemen.
  • De A11y Machine: U kunt de A11y Machine downloaden van GitHub. Dit instrument dient als een geautomatiseerd instrument voor toegankelijkheidstests. Dat wil zeggen, je gebruikt het om elke website te testen op toegankelijkheid. De tool maakt vervolgens een gedetailleerd rapport dat u kunt gebruiken om de toegankelijkheid van uw website te verbeteren.

Conclusie: Hoe de toegankelijkheid van uw WP site te verzekeren

WordPress als platform biedt u al enkele toegankelijkheidsfuncties out of the box - maar is nog steeds niet volledig toegankelijk. Als je toegankelijke websites wilt ontwikkelen met WordPress , moet je met een aantal zaken rekening houden: 

  • Volg de officiële richtlijnen voor de toegankelijkheid van webinhoud, evenals de WordPress toegankelijkheidsrichtlijnen die zijn uiteengezet in het Theme Review Handbook. 
  • Begin met een toegankelijke WordPress Theme om de ontwikkelingstijd te verkorten en een solide basis te leggen voor een toegankelijke website. 
  • Gebruik WordPress Accessibility Plugins en tools om uw voltooide website te testen en ervoor te zorgen dat hij voor iedereen toegankelijk is.

Als u de bovenstaande tips toepast, bent u goed op weg om toegankelijke websites te maken en het internet bruikbaarder en toegankelijker voor iedereen te maken. En als u snelle en veilige WordPress hosting nodig hebt voor alle toegankelijke websites die u gaat maken, aarzel dan niet om u aan te melden voor een gratis proefperiode op RAIDBOXES

Uw vragen: WordPress Toegankelijkheid en drempelvrije websites

Welke vragen heb je voor Maddy? Voel je vrij om de commentaarfunctie te gebruiken. Wilt u meer tips over webontwerp en -ontwikkeling? Volg ons dan op Twitter, Facebook of via onze nieuwsbrief.

Afbeelding bijgedragen: Unsplash

Maddy Osman is een SEO Content Strategist. Ze werkt met geselecteerde klanten op het gebeid van WordPress en webhosting. Door haar achtergrond in webdesign en WordPress heeft ze diepgaande kennis van SEO - en weet ze precies hoe ze merken moet verbinden met SEO-relevante content.

Gerelateerde artikelen

Reacties op dit artikel

Laat een opmerking achter

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