Alternativ tekst til bilder

Skrevet av: Morten Tollefsen

Sist oppdatert: 6.6.13

Eksempelsamling

Normalt skal det legges til alternativ tekst til bilder. Dette trengs for at de som ikke kan se bildene skal få en forklaring.

Den alternative teksten skal ikke starte med "grafikk", "bilde" eller liknende (hvis ikke dette er viktig). Skjermlesere sier "grafikk", og da blir det dobbelt opp "Grafikk bilde ... alternativ tekst ...".

<img src="..." alt="forklaring av bildet" />

Grafiske lenker skal alltid ha en alternativ tekst. Teksten skal vanligvis si noe om hva lenken peker til:

MediaLT

<a href="http://www.medialt.no"><img src="Medialt_logo.jpg" alt="MediaLT" /></a>

Brukes bildet nedenfor som lenke kan det kanskje være ønskelig å formidle budskapet. Også i slike tilfeller er det likevel normalt best å beskrive målet:

MediaLT

<a href="http://www.medialt.no"><img src="Medialt_stripe.jpg" alt="MediaLT" /></a>

Hvis det samme bildet ikke er en lenke kan teksten i bildet brukes som alternativ tekst, eller hele stripen forklares (eventuelt med en lang bildebeskrivelse):

MediaLT gjør begrensninger til muligheter

<img src="Medialt_stripe.jpg" alt="MediaLT gjør begrensninger til muligheter" />

For bilder i artikler etc. er det greit å gi en kort, nøktern forklaring:

Portrett av Morten Tollefsen, smiler

<img src="Morten_portrett.jpg" alt="Portrett av Morten Tollefsen, smiler" />

Grafisk pynt trenger nesten aldri alternativ bildetekst. Alt-attributtet kan være tomt eller bildet kan skyves til bakgrunnen:

<img src="pilhøyre_pynt.jpg" alt="" />

Bakgrunnsbilder (CSS) er ikke synlige med skjermleser:

CSS:
p.bg {
background-image: url(pilhoyre_pynt.png);
background-repeat: no-repeat;
background-position: left center;
height: 315px;
width: 70px;
}

HTML:
<p class="bg">

Mer informasjon