Alt-tekst til billedknap
Silktide finder billedknapper i dine formularer, der ikke har noget . En billedknap uden tekstalternativ giver personer, der ikke kan se den, ingen mulighed for at vide, hvad der sker, når de trykker på den.
<!-- Problem: intet alt-attribut -->
<input type="image" src="button.png">
<!-- Problem: tom alt -->
<input type="image" src="button.png" alt="">
<!-- Løst: alt-teksten angiver handlingen -->
<input type="image" src="button.png" alt="Send besked">
Hvorfor det er vigtigt
En billedknap (<input type="image">) bruger et billede i stedet for en tekstetiket, så dens alt-attribut er det eneste navn, en kan meddele. Uden den bliver knappen blot meddelt som "knap" eller med sit filnavn. En formular, hvis indsendelsesknap ikke kan identificeres, er en formular, som nogle besøgende ikke trygt kan udfylde – en direkte barriere for henvendelser, tilmeldinger og køb.
I modsætning til almindelige billeder kan en knap aldrig være dekorativ: Den gør altid noget og har derfor altid brug for et navn.
Sådan løser du det
- Tilføj en
alt-attribut, der angiver den handling, knappen udfører, f.eks. "Søg" eller "Send besked", som i eksemplet ovenfor. - Lad ikke attributten være tom – en tom
alt=""skjuler knappens navn uden at skjule knappen. - Du kan også erstatte billedknappen med et
<button>-element, der indeholder rigtig tekst, hvilket er nemmere at style og er tilgængeligt som standard.
Sådan tester Silktide dette
- Find alle billedknapper (
<input type="image">) på hver side. - Spring knapper over, der er skjult for skærmlæsere.
- Rapportér hver knap, hvis
alt-attribut mangler eller er tom.
Knapper, hvis alt-tekst findes, men virker uhjælpsom, dækkes af det separate tjek Alt-tekst til indsendelsesknap.