Länkar med olika destinationer

Silktide hittar länkar på en sida som har samma text men leder till olika destinationer. När två länkar som ser likadana ut leder till olika platser kan användare inte skilja dem åt utan att följa var och en av dem.

<!-- Two "News" links that go to different pages -->
<p>Learn the latest about our products: <a href="/products/news">News</a></p>
<p>Learn the latest about our services: <a href="/company/news">News</a></p>

Varför detta är viktigt

Personer som använder en tar ofta fram en lista över alla länkar på sidan, utan sammanhang. Två länkar som båda läses upp som "News" men leder till olika sidor går inte att skilja åt i den listan, så användaren måste öppna var och en för att ta reda på vart den leder. Samma otydlighet påverkar användare av taligenkänning, som väljer länkar genom att säga deras namn högt.

Så åtgärdar du problemet

Ge varje länk en egen synlig text som beskriver dess destination, till exempel "Produktnyheter" och "Företagsnyheter".
Om designen inte kan ändras kan du lägga till en -etikett för att skilja länkarna åt utan att ändra det som syns för seende användare:

<!-- The aria-label becomes the name screen readers announce -->
<a href="/products/news" aria-label="Product news">News</a>
<a href="/company/news" aria-label="Company news">News</a>

Alternativt kan du inkludera extra text i länken som är visuellt dold men läses upp av skärmläsare (till exempel ett <span> som formaterats med en CSS-klass för att endast visas för skärmläsare).
Om länkarna funktionellt sett är likvärdiga för användaren – till exempel om de omdirigerar till samma sida – kan du resultatet.

Så testar Silktide detta

Hitta alla länkar på sidan och hoppa över element som du har undantagit från kontroller.
Fastställ varje länks – texten som läser upp, vilket inkluderar ARIA-etiketter och bilders , inte bara den synliga texten.
Normalisera varje länks destination för jämförelse: fragment (delen efter #), frågesträngar (delen efter ?), URL-schemat och avslutande snedstreck ignoreras.
När länkar med samma tillgängliga namn pekar på mer än en unik destination markeras alla.

Felsökning

Länkar till olika avsnitt på samma sida markeras inte

Eftersom fragment ignoreras när destinationer jämförs räknas länkar som /guide#intro och /guide#pricing som samma destination. Detta är avsiktligt: båda leder till samma sida.

Länkar som endast skiljer sig åt genom spårningsparametrar markeras inte

Frågesträngar ignoreras när destinationer jämförs, så /offers?src=header och /offers?src=footer räknas som samma sida i stället för olika destinationer.