Ontbrekend anker
Silktide test links die naar een specifiek gedeelte van dezelfde pagina verwijzen, zoals
#content, en rapporteert de links waarvan het doel niet bestaat. Als je op zo'n
link klikt, gebeurt er stilletjes niets en blijft de gebruiker waar die was.
<!-- Defect: niets op de pagina heeft id="content" -->
<a href="#content">Ga naar inhoud</a>
<!-- Opgelost: het doel bestaat -->
<a href="#content">Ga naar inhoud</a>
...
<main id="content">...</main>
Waarom dit belangrijk is
Links naar ontbrekende ankers mislukken stilletjes: er is geen foutpagina en de pagina verplaatst gewoon niet. Voor ziende gebruikers is dit verwarrend; voor en toetsenbordgebruikers is het nog erger, omdat deze links binnen een pagina vaak juist de mechanismen zijn — zoals "naar inhoud gaan" of een inhoudsopgave — die een lange pagina navigeerbaar maken. Een defect anker haalt die snelkoppeling ongemerkt weg.
Zo los je het op
- Voeg het ontbrekende doel toe: geef het bedoelde element een
iddie overeenkomt met het fragment van de link, bijvoorbeeld<section id="pricing">voor een link naar#pricing. - Of corrigeer de link als het doel een andere
idheeft — fragmenten zijn hoofdlettergevoelig, dus#Pricingkomt niet overeen metid="pricing". - Als de link alleen bestaat om te activeren,
laat het fragment nog steeds verwijzen naar de
idvan het echte element. De link behoudt dan zijn betekenis zonder JavaScript; mogelijk moet je in je script het standaard scrollgedrag voorkomen.
<!-- Het fragment komt overeen met het element dat het script zichtbaar maakt -->
<a href="#details" onclick="toggle('details')">Details weergeven</a>
<div id="details">...</div>
Zo test Silktide dit
- Zoek elke link op de pagina waarvan de bestemming een fragment bevat (het gedeelte
na
#). - Houd alleen links over die naar de huidige pagina verwijzen — links die alleen uit
#fragmentbestaan of volledige URL's naar dezelfde pagina zijn. Links naar ankers op andere pagina's worden niet door deze controle getest. - Zoek naar een element waarvan de
idovereenkomt met het fragment, of naar een verouderd<a name="...">-anker met een overeenkomende naam. - Markeer de link als geen van beide bestaat.