Toegankelijkheidsmonitor 2019

Moniteur de l'accessibilité 2019

  • 1186 studenten
  • 210 websites
  • 15 criteria
  • 22% toegankelijk

Kort

AnySurfer onderzocht voor de negende keer, met de help van hogeschoolstudenten, de toegankelijkheid van Belgische websites. 22% van de sites voldoen aan minimale toegankelijkheidsvereisten.

Door wie werd er getest?

1186 studenten van 17 hogescholen testten elk 2 websites uit de steekproef. De studenten volgen een opleiding waarin webdesign of webontwikkeling aan bod komt.

Hartelijk bedankt aan de docenten en studenten van de deelnemende scholen:

Welke websites werden getest?

De steekproef bevat 210 websites, zowel Franstalig als Nederlandstalig, verdeeld in 18 categorieën. Er zitten twee nieuwe categoriën tussen dit jaar: politieke partijen en ziekenhuizen. De steekproef bevat 23 sites meer dan vorig jaar en ongeveer een derde is nieuw.

Welke methode werd er gebruikt?

Zoals in de voorgaande jaren, gebruikten de studenten een simpele testmethode, de Quickscan. Ze evalueerden elke website op 15 criteria. De meeste sites zijn door zes afzonderlijke studenten getest. Daarna werden de resultaten door AnySurfer verwerkt. De criteria staan hieronder opgelijst.

Meer over de methodologie.

Hoe scoorden de websites?

46 van de 210 sites in de steekproef scoren 75% of meer en zijn minimaal toegankelijk volgens de 15 criteria van dit onderzoek. Dat is 22% van de geteste websites. 78% is dus niet toegankelijk.

Gemiddeld resultaat per criterium

Voor 18% van de websites in de steekproef geeft de paginatitel niet duidelijk aan op welke pagina men zich bevindt.

Impact

De paginatitel wordt als eerste voorgelezen door een screenreader als de pagina opent. Het verschijnt ook in de browsertabs en in de zoekresultaten. Als die niet betekenisvol is, wordt het moeilijker om zich te oriënteren en op een efficiënte manier te navigeren. Dit geldt niet enkel voor personen met een handicap.

Oplossing

De redacteur geeft de pagina een unieke titel. Het CMS voegt automatisch de naam van de website achteraan toe in de titel.

Dit punt is OK op de meeste websites. Op 22% is de taal van de pagina’s niet correct aangeduid.

Impact

Als de pagina wordt voorgelezen met een screenreader, kan de spraaksynthese zich aanpassen aan de taal van de pagina. Als de taal niet juist aangeduid is, dan is de inhoud niet te begrijpen omdat die met de foute uitspraak wordt voorgelezen.

Oplossing

De oplossing is zeer simpel: de taal van de pagina moet aangeduid worden in de templates via het lang-attribuut.

Op de meeste websites (72%) is de focus (bijvoorbeeld een stippellijntje rond een link) niet zichtbaar als men de tabtoets gebruikt om de links te bereiken.

Impact

Zonder zichtbare focus is het onmogelijk om de website enkel met toetsenbord te gebruiken. Men kan namelijk niet zien waar men zich bevindt. Dit is vooral een probleem voor personen met een motorische handicap.

Oplossing

Een paar lijnen verwijderen of aanpassen in de CSS-code van de website (outline bij focus) is meestal voldoende om het probleem op te lossen.

De meerderheid van de geteste websites (60%) zijn niet toegankelijk met het toetsenbord.

Impact

Dit is blokkerend voor alle personen die geen muis kunnen gebruiken. Blinden en personen met een motorische handicap hebben hier het meeste last van.

Oplossing

Het zijn meestal de dynamische componenten (tabs, uitklapmenu’s, accordeons, etc.) die problemen veroorzaken. Het kan moeilijk zijn om deze problemen op te lossen in bestaande componenten. Er bestaan echter herbruikbare toegankelijke componenten. De beste oplossing is dus om meteen toegankelijke componenten te kiezen of aan de toegankelijkheid te denken bij het ontwikkelen van de componenten.

49% van de websites in de steekproef hebben bewegende elementen die niet kunnen gestopt worden. In de meeste gevallen zijn het slideshows.

Impact

Beweging op een pagina maakt het moeilijker voor iedereen om zich te concentreren en de inhoud te lezen. Voor personen met dyslexie of een concentratiestoornis kan beweging een webpagina helemaal onbruikbaar maken.

Oplossing

Voeg een pauzeknop toe aan het bewegende element.

Dit criterium gaat over links binnen een paragraaf. Links zijn traditioneel onderstreept en daardoor makkelijker te herkennen. Op 33% van de steekproef zijn links enkel te onderscheiden op basis van kleur.

Impact

Kleurenblinden of slechtziende personen zullen moeite hebben om de links te vinden, wat navigeren op de website moeilijker maakt.

Oplossing

Door enkele lijnen CSS aan te passen, kunnen alle links in doorlopende tekst goed herkenbaar worden gemaakt. Dit kan bijvoorbeeld met onderstreping of vetgedrukt.

Dit is meestal OK. Op 93% van de websites kan je de bestemming van de link afleiden uit de linktekst.

Impact

Betekenisvolle links zorgen ervoor dat de bezoeker van de website kan voorspellen op welke pagina hij terecht gaat komen. Betekenisvolle links zijn heel belangrijk voor personen die geen overzicht hebben over de pagina en het doel van de link niet uit de context kunnen afleiden.

Oplossing

Onbetekenisvolle links zoals 'klik hier' vermijden of herbenoemen. Dit kan omslachting zijn op een bestaande website.

Op 76% van de websites staan afbeeldingen zonder alt-tekst of met een incorrecte alt-tekst.

Impact

Als een afbeelding informatie bevat en geen tekstalternatief heeft, dan is de informatie niet beschikbaar voor screenreadergebruikers.

Oplossing

Altijd een alt-tekst toevoegen bij het invoegen van een betekenisvolle afbeelding, alsook het alt-attribuut leeg laten voor decoratieve afbeeldingen. Alle afbeeldingen achteraf omschrijven kan omslachtig zijn.

38% van de websites met video heeft ondertiteling, 14% heeft geen video en 48% heeft geen ondertiteling voorzien.

Impact

Zonder ondertitels is een video niet toegankelijk voor doven en slechthorenden.

Oplossing

Voorzie ondertiteling bij het ontwerp van de video. Ondertiteling kan uitbesteed worden aan professionelen, maar er bestaan ook (gratis) online tools om het zelf te doen.

42% van de websites gebruikt kleurcombinaties die onder het minimum ratio scoren (4,5 voor tekst, 3 voor koppen).

Impact

Een laag contrast kan tekst onleesbaar maken voor slechtzienden. Slechte contrasten maken het lezen moeilijker voor iedereen, vooral op een klein scherm (mobiel) of bij lichtinval.

Oplossing

Tijdens de ontwerpfase kleurcombinaties kiezen die voldoende contrasteren. Contrast verbeteren op een bestaande website kan meestal gemakkelijk, door de kleur van de tekst of de achtergrond aan te passen in de CSS code.

71% van de websites gebruikt het juiste kopniveau in de HTML-code (H1, H2, H3, etc.).

Impact

Als kopniveau's niet of incorrect zijn gebruikt in de code, kunnen programma’s zoals screenreaders of andere hulpmiddelen de structuur niet gebruiken. Een blinde persoon ziet de inhoud van de pagina dan als een lange blok tekst zonder structuur.

Oplossing

Redacteurs brengen structuur aan door koppen te markeren in een logische en hiërarchische volgorde. H1 voor de titel, H2 voor een subkop enzoverder.

Bijna alle websites gebruiken lijsten om een correcte manier (ul en ol elementen).

Impact

Het gebruik van lijsten geeft structuur aan de inhoud. Wanneer lijsten enkel visueel aangeduid zijn, maar niet juist gecodeerd zijn, kondigen screenreaders ze niet aan als lijsten.

Oplossing

Gebruik echte lijsten (ul en ol) in plaats van lijsten visueel na te bootsen tijdens de ontwikkeling van de pagina’s en tijdens het invoeren van de inhoud.

Op 72% van de websites is dit in orde. Op 27% van de websites zijn de formulieren niet juist gecodeerd. Op 1% van de websites werden er geen formulieren gevonden.

Impact

Als de formuliervelden niet verbonden zijn met hun label, kan een screenreader of een spraakherkenningsprogramma geen link leggen tussen de twee elementen. Het wordt moeilijker om het formulier in te vullen.

Oplossing

Gebruik de HTML-elementen en -attributen op de juiste manier tijdens de ontwikkeling van formulieren. Het for attribuut van het label element moet identiek zijn aan het ID van het input element.

Op 20% van de websites zijn foutmeldingen in formulieren afwezig of niet volledig. Op 78% zijn de foutmeldingen OK. Op 2% werden geen formulieren gevonden.

Impact

Als de foutmeldingen in formulieren niet duidelijk worden aangeduid en uitgelegd door middel van tekst, zullen sommige gebruikers ze niet vinden of niet begrijpen wat ze moeten verbeteren.

Oplossing

Zorg ervoor dat foutmeldingen duidelijk in tekst worden uitgedrukt en op een logische plaats staan.

Bij de grote meerderheid van de websites (79%) voldoet de broncode niet volledig aan de HTML standaard.

Impact

Als de broncode niet valideert, is er meer risico dat er dingen mislopen als de website met hulpmiddelen wordt geraadpleegd.

Oplossing

Volg de standaard tijdens de ontwikkeling om problemen te voorkomen. Gebruik de validator van het W3C om problemen te identificeren en corrigeren.

staafdiagram met gemiddeld percentage per criterium

Interpretatie van de resultaten

Op 78% van Belgische websites komt een persoon met een handicap obstakels tegen die het moeilijk of onmogelijk maken om bijvoorbeeld:

  • een online cursus te volgen,
  • het programma van een culturele activiteit te raadplegen,
  • het nieuws te volgen,
  • een overheidsdienst te contacteren.

Sinds de start van het onderzoek in 2007 is het percentage websites dat voldoet aan de mimimale vereisten jaar na jaar lichtjes gestegen tot 24% in 2018. In 2019 is er voor het eerst een lichte daling van 2%. In 2008, 2011, 2014 en 2016 werd er geen monitor georganiseerd.

Resultaat per jaar
Jaar Resultaat
2007 4%
2008 -
2009 7%
2010 10%
2011 8%
2012 13%
2013 14%
2014 -
2015 15%
2016 -
2017 18%
2018 24%
2019 22%

Contact