Lege links

Silktide vindt links die helemaal geen tekst bevatten — niets zichtbaars en geen tekstequivalent. Iemand die een schermlezer gebruikt, hoort alleen ‘link’, zonder te weten waar die naartoe leidt.

<!-- Leeg: een pictogramlink zonder tekstequivalent -->
<a href="/search"><svg>...</svg></a>

<!-- Opgelost: de alt-tekst van de afbeelding benoemt de bestemming -->
<a href="/"><img src="logo.png" alt="Startpagina van Example Corp"></a>

<!-- Opgelost: een aria-label benoemt de bestemming -->
<a href="/search" aria-label="Zoeken"><svg>...</svg></a>

Waarom dit belangrijk is

Links zijn de manier waarop mensen door je website navigeren, en niet iedereen kan ze zien. Een kondigt elke link aan met de bijbehorende tekst; als die ontbreekt, hoort de gebruiker alleen ‘link’ en moet die raden waar de link naartoe leidt of de link overslaan. Veel blinde gebruikers openen ook een lijst met alle links op de pagina — een lijst met onbenoemde items is nutteloos.

Lege links ontstaan meestal per ongeluk: een pictogram vervangt tekst, een afbeelding verliest zijn , of een losgeraakte <a>-tag blijft achter nadat een redacteur wijzigingen heeft aangebracht. Zoekmachines kunnen evenmin zien waar een lege link naartoe verwijst.

Zo los je het op

Als de link zichtbare tekst moet hebben, voeg die dan toe.
Als de link een afbeelding is, geef de afbeelding alt-tekst die de bestemming benoemt, zoals alt="Startpagina van Example Corp" voor een logo dat naar je startpagina linkt — niet een beschrijving van de afbeelding.
Als de link een pictogram is, voeg dan een toe dat de bestemming benoemt, of voeg tekst toe die visueel verborgen is maar wel beschikbaar is voor schermlezers.
Als de link geen inhoud en geen doel heeft, verwijder die dan.

Hoe Silktide dit controleert

Vind elke link op elke pagina, inclusief gebieden van afbeeldingskaarten.
Sla elementen over die geen werkende linkbestemming hebben.
Lees de tekst van de link, inclusief alt-tekst en tekstequivalenten zoals aria-label en title op de link en alles wat erin staat.
Rapporteer de link als er helemaal geen tekst wordt gevonden.

Problemen oplossen

De link ziet er goed uit op de pagina

Een link kan er goed uitzien en toch leeg zijn, omdat het uiterlijk afkomstig is van een pictogram of een -achtergrondafbeelding — geen van beide geeft de link een naam. Controleer de onderliggende op een tekstequivalent.

De betekenis van het pictogram is duidelijk

Alleen voor mensen die het kunnen zien. Een vergrootglas betekent visueel ‘zoeken’, maar een schermlezer kan afbeeldingen zonder tekstequivalent niet beschrijven — het label moet in de markup staan.