1.1.1 – Inhoud zonder tekst (WCAG) | Niveau A

Bied tekstalternatieven voor inhoud zonder tekst

Niet iedereen is in staat om informatie vanuit afbeeldingen mee te krijgen. Sommige gebruikers, zoals blinden- en slechtzienden, zijn beperkt tot een tekstueel alternatief om de inhoud van afbeeldingen te begrijpen. 

Tekst alt’s (alternatieven) moeten goede alternatieven voor de visuele inhoud zijn: ze moeten dezelfde informatie bieden. In het artikel tips voor het schrijven van alternatieve beschrijvingen van afbeeldingen vind je direct toe te passen tips over informatieve alternatieve teksten.

Wat te doen

• Voeg een tekstalternatief toe aan alle niet-decorateive afbeeldingen.
• Voorzie decoratieve afbeeldingen van een leeg alt-attribuut.
• Voeg een tekstalternatief toe aan audio en video (een korte beschrijving van het onderwerp).
• Voeg een naam toe aan al besturingselementen (zoals ‘Zoeken’ of ‘Verzenden’).

Tips

Alt tekst is een geschreven vervanging voor een afbeelding, geen toevoeging. Dit betekent dat de tekst de afbeelding moet beschrijven en dezelfde informatie moet geven als iemand de afbeelding zou zien. Dit is niet altijd gemakkelijk en mensen zijn het niet altijd eens over wat dezelfde informatie is. Vraag jezelf af: wat laat de foto zien?

Als de afbeelding jouw bedrijfslogo is, dan is jouw bedrijfsnaam een ​​goede keuze. Als de afbeelding uit tekst bestaat, repliceer je de tekst exact. Beschrijf voor alle andere afbeeldingen nuttig en beknopt: we hoeven niet te weten dat het een afbeelding is van 17.387 bomen als het woord ‘bos’ hetzelfde doel dient.

Wat je ook doet, gebruik alt-tekst niet als mogelijkheid om op te vullen met zoekwoorden. Het toevoegen van alt-tekst is slecht voor de toegankelijkheid, het voldoet niet aan de WCAG 2.2-richtlijnen en kan zelfs de zoekmachine in de war laten maken.

Alt-tekst is relatief eenvoudig te controleren en gemakkelijk te herstellen, waardoor dit een snelle overwinning is. Een van de beste manieren is om de WAVE Chrome-extensie toe te voegen en een pagina te bekijken. Omdat de meeste sites een standaardsjabloon hebben, kan je jouw grootste problemen met één beweging opvangen. Banners, afbeeldingen aan de zijkant van de pagina en voetteksten hoeven slechts eenmaal te worden gecorrigeerd om elke pagina op jouw site te verbeteren. Daarna zal je jouw website pagina voor pagina moeten controleren.

Uitzonderingen

Er zijn een paar soorten afbeeldingen die geen alt-tekst nodig hebben: spacers, pictogrammen, decoratieve input, tests en CAPTCHA-afbeeldingen.

Pictogrammen worden meestal gebruikt om tekst aan te vullen in plaats van te vervangen, dus je hoef je inspanningen hier niet te dupliceren. Klanten die hun computer alles op hun scherm laten uitspreken zouden hetzelfde toch twee keer horen, wat het tegenovergestelde is van wat we proberen te doen.

Spacers zijn afbeeldingen die worden gebruikt voor opvulling, vaak voor het gemak en geen goede codering. Ze worden vaak gebruikt om de opmaak te behouden en geven geen informatie weer, zodat ze geen alt-tekst nodig hebben.

Decoratieve afbeeldingen worden alleen gebruikt omdat ze er mooi uitzien. Ze bieden geen informatie en hebben dus ook geen alt tekst nodig.

Tests en CAPTCHA’s die zouden worden ondermijnd door tekstalternatieven hebben ze niet nodig. Maar als je CAPTCHA gebruikt, gebruik je er een met een audio-alternatief of voeg je jouw  contactgegevens ergens in de buurt toe om jouw gebruikers te helpen als ze vastlopen.

Gebruik bij deze uitzonderingen geen alt-tekst, maar plaats deze zin tussen aanhalingstekens:

<img src = “location-of-image.jpg” alt = “” />

Schermlezers slaan dan de afbeelding over in plaats van de bestandsnaam te lezen of een alt-tekst te vervangen.