2.4.4 Linkdoel (in context)

Succescriterium 2.4.4 Linkdoel (in context)

Het linkdoel kan bepaald worden uit enkel de linktekst of uit de linktekst samen met zijn door software bepaalde linkcontext, behalve daar waar het doel van de link een dubbelzinnige betekenis kan hebben voor gebruikers in het algemeen.

Linkdoel (in context) begrijpen (Engelstalig)

Gebruikers moeten begrijpen waar een link naartoe gaat voordat ze erop klikken. Dit kan alleen als de linktekst duidelijk is, of als de context rondom de link dit verduidelijkt.

Schermlezers kunnen een overzicht van alle links op een webpagina presenteren. In dit overzicht staan alle linkteksten. Als linkteksten zoals ‘klik hier’ of ‘lees meer’ worden gebruikt, wordt het lastig om te kiezen welke link relevant is.

Links kunnen toegankelijker worden gemaakt door ze een linktekst te geven die op zichzelf al begrijpelijk is. Schrijf daarom een linktekst waaruit het doel van de link duidelijk af te leiden is, zoals ‘lees meer over contrast’ of ‘bekijk voorbeelden van tekstalternatieven’.

Hoe pas je dit toe?

Tekst

  • Zorg dat het linkdoel van links in de linktekst wordt beschreven; of
  • Zorg dat het linkdoel van links in de linktekst samen met de content uit hetzelfde HTML-element wordt beschreven.
Context van een link

De omliggende context is bijvoorbeeld:

  • tekst in dezelfde zin of alinea
  • tekst in hetzelfde lijstonderdeel
  • tekst in het bovenliggende lijstonderdeel
  • tekst in dezelfde tabelcel
  • tekst in een tabelcel met een gekoppelde tabelkop
  • het aria-describedby-attribuut
  • het title-attribuut
  • tekst verborgen met CSS

Afbeeldingen

  • Geef functionele afbeeldingen een tekstalternatief dat beschrijft wat het doel van de link is.

Lees het artikel over toegankelijke links

Voor wie is dit belangrijk?

  • Mensen die een schermlezer gebruiken.
  • Mensen die blind of slechtziend zijn.
  • Mensen die een cognitieve, taal- of leerbeperking hebben.

Wie is verantwoordelijk?

  • Redacteur
  • Ontwikkelaar

Hoe toets je dit?

Testprocedure

Test 1: Links

  1. Inventariseer alle links
    • Bepaal welke links er aanwezig zijn:
      • Links met alleen tekst
      • Links met afbeelding én tekst
      • Afbeeldingen die ook worden gebruikt als link
      • Iconen die ook worden gebruikt als link
    • Bepaal voor elke link wat de toegankelijke naam is
      • Open Developer Tools:
        • Klik met rechtermuisknop op de link
        • Selecteer ‘Inspecteren’ of ‘Inspecteer Element’
        • Bepaal de toegankelijke naam in deze volgorde:
          • aria-labelledby
          • aria-label
          • De inhoud van de link
            • De zichtbare tekst
            • Het tekstalternatief van afbeeldingen in de link
            • Verborgen tekst in de link
          • title
      • (Gebruik eventueel een schermlezer om de toegankelijke naam te controleren)
  2. Controleer voor elke link:
    • Of de toegankelijke naam het doel van de link beschrijft
    • Of de toegankelijke naam uniek is voor het linkdoel
  3. Zoek links met dezelfde toegankelijke naam en controleer:
    • Of ze naar dezelfde bestemming gaan
  4. Bekijk de context voor elke onduidelijke link en controleer:
    • Of de tekst rondom de link het doel verduidelijkt:
      • De tekst in dezelfde zin als de link
      • De tekst in dezelfde alinea als de link
      • De tekst in hetzelfde lijstitem als de link
      • De tekst in het bovenliggende lijstitem (bij geneste lijsten)
    • Bij links in tabellen:
      • De tekst in dezelfde tabelcel als de link
      • De tekst in de bijbehorende tabelkoppen
    • Of de linktekst is aangevuld met:
      • Tekst verborgen met CSS
      • Het aria-describedby-attribuut
      • Het title-attribuut
  5. Controleer voor iedere combinatie van toegankelijke naam plus context van de link:
    • Of deze samen het doel van de link beschrijven
    • Of deze samen uniek zijn voor het linkdoel
Beoordeling
  • De linktekst plus de context van de link moet het doel van de link beschrijven

Bronnen

Andere richtlijnen

Laatst gewijzigd op