Alternativ tekst for bilde i lenke
Silktide finner lenker som inneholder et bilde, men ingen lesbar tekst av noe slag. En slik lenke har ikke noe navn, så personer som ikke kan se bildet, har ingen måte å vite hvor den fører.
<!-- Problem: lenken har ikke noe tilgjengelig navn -->
<a href="/apple">
<img src="apple.png">
</a>
<!-- Løst: den alternative teksten navngir lenken -->
<a href="/apple">
<img src="apple.png" alt="Et rødt eple">
</a>
Hvorfor dette er viktig
Når det eneste innholdet i en lenke er et bilde, blir bildets navnet på lenken. Uten den kunngjør en noe som «lenke», eller faller tilbake til å lese mål-URL-en eller bildefilnavnet – ingen av delene forteller lytteren hvor lenken fører. Navigasjon som er bygget opp av bildelenker, for eksempel logoer og ikonmenyer, blir ren gjetting.
Dette påvirker også brukere av tastatur og stemmestyring: En lenke uten navn er vanskelig å målrette med talekommandoer og meningsløs i en liste over lenker.
Slik løser du det
- Legg til alternativ tekst i bildet som beskriver formålet med lenken – hvor den fører eller hva den gjør – i stedet for hvordan bildet ser ut. For en lenket logo er «Hjem» eller navnet på organisasjonen bedre enn «logo».
- Alternativt kan du legge til synlig tekst i lenken ved siden av bildet. Bildet kan da ha en tom
alt="". - Rett opp maler i der det samme lenkeikonet uten etikett gjentas på tvers av sider.
Slik tester Silktide dette
- Finn hvert bilde som ligger i en lenke, og hopp over lenker som er skjult for skjermlesere.
- Les all teksten lenken eksponerer for , inkludert den alternative teksten til alt som ligger i lenken.
- Rapporter bildet når den samlede teksten ikke inneholder bokstaver eller tall, slik at lenken står uten et brukbart navn.
I motsetning til andre kontroller av alternativ tekst godkjennes ikke en tom alt="" her: Hvis bildet er det eneste innholdet i lenken, gjør en markering som dekorativ at lenken blir navnløs.
Feilsøking
Bildet er dekorativt
I en lenke uten annen tekst kan et bilde ikke behandles som rent – noe må gi lenken et navn. Enten gir du bildet alternativ tekst som beskriver målet, eller så legger du til synlig tekst i lenken.
Lenken er merket på en annen måte
Denne kontrollen leser tekst og alternativ tekst i lenken. Hvis lenken er navngitt på andre måter, og du har kontrollert at den kunngjøres riktig i en skjermleser, kan du funnet.