Alt-tekst er et af de mest oversete, men mest virkningsfulde elementer i digital tilgængelighed.
Uanset om du designer et website, skriver en blog eller planlægger et socialt opslag, gør det en reel forskel for folk, der er afhængige af skærmlæsere eller anden hjælpemiddelteknologi, hvis du tilføjer en gennemtænkt, beskrivende alt-tekst.
Men det er ikke altid lige nemt at skrive en effektiv alt-tekst. Hvad siger man om et diagram? Har produktbilleder brug for detaljer? Hvornår er det bedre at lade alt-teksten være tom?
I denne guide gennemgår vi alt, hvad du har brug for at vide om bedste praksis for alt-tekst – med rigtige eksempler på alt-tekst. I løbet af få øjeblikke vil du være bedre rustet til at skrive billedbeskrivelser, der forbedrer tilgængeligheden, øger SEO og opfylder vigtige compliance-standarder.
Alt-tekst, som er en forkortelse for “alternativ tekst”, er en skriftlig beskrivelse af et billede. Den vises normalt i HTML-koden som en synlig tekstlinje ved siden af billedet eller som en længere beskrivelse på en separat side, som man får adgang til via et link.
Alt-tekst er utrolig vigtig for mennesker, der lever med synshandicap – den giver en væsentlig kontekst, som ellers ville gå tabt for dem. Det gør billeder til ord, hvilket gør indholdet mere inkluderende og lettere at navigere i.
Alt-tekst blev oprindeligt skabt for at forbedre den digitale tilgængelighed, og det er stadig dens vigtigste rolle i dag. For blinde og svagtseende brugere bruger skærmlæsere alt-tekst til at beskrive billeder højt, hvilket hjælper dem med at navigere og forstå visuelt indhold.
Men alt-tekst er ikke kun til gavn for hjælpemidler. Når det er skrevet godt, bidrager det også til bedre SEO.
Det skyldes, at søgemaskiner ikke kan “se” billeder. De er afhængige af alt-tekst sammen med filnavne for at kunne fortolke, hvad et billede viser. Det betyder, at relevant alt-tekst, som bruger søgeord på en naturlig måde, kan forbedre dine siders placering i billedsøgeresultaterne.
Den bedste alt-tekst er specifik, kortfattet og relevant for billedets formål. Her er et par praktiske tips til at guide din skrivning:
Ved at følge disse best practices kan du skabe alt-tekst, der virkelig er nyttig for brugerne. Se eksemplerne på alt-tekst nedenfor for at se disse principper i praksis.
Det, der måske vil overraske dig, er, at ikke al alt-tekst skal skrives på samme måde.
Hvorfor? Fordi forskellige typer billeder kræver forskellige tilgange.
Men uanset om du arbejder med grafer, indhold på sociale medier eller produktbilleder, er målet altid det samme: at beskrive det, der betyder noget, på en måde, der hænger sammen med billedets kontekst og understøtter brugeroplevelsen.
Lad os se på, hvordan man griber alt copy an for hver type billede:
Som navnet antyder, formidler informative billeder vigtig information, som ikke er skrevet andre steder på siden.
[Billede:] En laptop-skærm, der viser en brugers dashboard med privatlivsindstillinger.
Alternativ tekst: Dashboard med privatlivsindstillinger, der viser skifteregler for placeringssporing, markedsføringspræferencer og datadeling.
Denne beskrivelse fokuserer på det, der er synligt og relevant for billedets kontekst, uden at overfortolke.
Dekorative billeder tilføjer ikke meningsfuldt indhold. De er der udelukkende for æstetikkens skyld og bør springes over af skærmlæsere og andre hjælpemidler.
[Billede:] Et baggrundsmønster af blå bølger.
Alternativ tekst: alt=”” (tom)
Brug en null alt-attribut, som i eksemplet ovenfor, så hjælpemidler kan ignorere billedet og gå videre.
Diagrammer og grafer formidler komplekse data, som kan være svære at sammenfatte i alt-tekst.
Hvad er svaret? Din alt-tekst skal blot opsummere det vigtigste, du kan tage med dig fra diagrammet eller grafen.
[Billede:] Et søjlediagram, der viser cookiebannernes engagement efter design.
Alternativ tekst: Søjlediagram, der viser, at bannere med færre valgmuligheder har højere samtykkeprocenter end bannere med detaljerede valgmuligheder.
Hvis der er flere detaljer, kan du overveje at give en længere beskrivelse i teksten i nærheden eller linke til et tekstalternativ.
Produktbilleder skal beskrives med vigtige visuelle detaljer, der hjælper brugerne med at forstå, hvad der sælges.
[Billede:] Et par trådløse hovedtelefoner på en hvid baggrund.
Alternativ tekst: Sorte trådløse over-ear-hovedtelefoner med polstrede ørepuder og justerbar hovedbøjle.
Det er især vigtigt for tilgængeligheden og anvendeligheden af e-handel.
Sociale medier er ingen undtagelse, når det gælder om at skrive alt-tekst. Når du deler visuelt indhold på sociale kanaler, skal du inkludere en kortfattet, men beskrivende alt-tekst, der beskriver billedet på en måde, der er relateret til indlæggets kontekst.
[Billede:] Et team samlet omkring et whiteboard under et møde.
Alternativ tekst: Marketingteamet brainstormer kampagneidéer omkring et whiteboard dækket af klistermærker.
De fleste platforme som X, LinkedIn og Instagram understøtter nu alt-tekst, så der er ingen undskyldning for at springe den over – og sikre, at alle i fællesskabet kan få adgang til dit indhold.
Selv med de bedste intentioner er det let at komme til at skrive forkert alt-tekst. Her er nogle af de mest almindelige faldgruber – og hvordan du undgår dem:
Alt-tekst som “Billede af en graf” eller “Foto af et produkt” giver ingen nyttig kontekst. Vær specifik. Hvad viser grafen? Hvilken slags produkt er det?
Alt-tekst er ikke det rigtige sted at skrive hele essays. Alt for detaljerede beskrivelser kan overvælde skærmlæserbrugere og afbryde flowet. Hold det kort og godt – nogle få ord er nok, eller højst to klare, fokuserede sætninger.
Alt-tekst, der er proppet med nøgleord og ikke har nogen egentlig beskrivelse, hjælper hverken brugere eller søgemaskiner. Husk at fokusere på klarhed først – når alt-teksten virkelig er nyttig, kan du være sikker på, at SEO-fordelene følger hurtigt nok.
Hvis billedteksten eller den nærliggende tekst allerede siger det samme, er der ingen grund til at gentage det i alt-teksten. Bare fokuser på, hvad selve billedet tilfører.
Knapper, ikoner og links med billeder skal have en beskrivende alt-tekst, der forklarer deres funktion, f.eks. “Indsend formular ” eller “Download PDF”, ikke bare “pil” eller “ikon”.
Hvis du administrerer indhold på tværs af forskellige platforme, skal du sørge for, at alt-teksten fungerer konsekvent over hele linjen, også på mobiler og sociale opslag. Tilgængelighed bør ikke stoppe ved din hjemmeside.
Ved at undgå disse almindelige fejl og bruge de rigtige værktøjer kommer du tættere på at skabe en mere tilgængelig og brugervenlig oplevelse.
Når du har skrevet alt-tekst, hvordan ved du så, at den virker?
Det er vigtigt at teste, hvor godt din alt-tekst fungerer i praksis, både for skærmlæsere og for den generelle brugeroplevelse.
Sådan tester og forbedrer du dine billedbeskrivelser:
Prøv at navigere på din hjemmeside med en skærmlæser som NVDA (Windows) eller VoiceOver (macOS). Det giver dig direkte indsigt i, hvordan din alt-tekst bliver læst højt, og om den giver mening i sammenhængen.
Hvis du deaktiverer billeder i din browser, er det en hurtig måde at få vist den alt-tekst, der vises i stedet for hvert billede. Det kan være en god måde at opdage beskrivelser, der føles forvirrende eller overflødige og skal redigeres.
Brug automatiserede værktøjer til at hjælpe med at afdække eventuelle fejl, der kan påvirke skærmlæsere, sammen med andre tilgængelighedsproblemer.
Hvis du har adgang til testere, der bruger hjælpemidler, er deres feedback det bedste, du kan få. Spørg, om din alt-tekst føles nyttig, kortfattet og konsekvent – og juster den ud fra deres forslag.
Når du har optimeret din alt-tekst, skal du overvåge billedrelateret søgetrafik i Google Search Console. Hvis dine billeder begynder at dukke op i relevante resultater, ved du, at dine beskrivelser også fungerer for søgemaskinerne.
Optimering af alt-tekst er en løbende proces, men ved at følge disse trin kan du holde dig på sporet og skabe en mere inkluderende digital oplevelse.
Hvis du ønsker at opfylde tilgængelighedsstandarder, er alt-tekst ikke valgfrit. Retningslinjerne for tilgængeligt webindhold (WCAG) opstiller klare forventninger til, hvordan billeder skal håndteres for at støtte brugere med synshandicap, herunder:
Ved at opfylde disse standarder kan du skabe et mere inkluderende websted. Og det kan også hjælpe med at reducere den juridiske risiko, især for organisationer, der opererer i områder, hvor tilgængelighedslove som den europæiske tilgængelighedslov håndhæves.
Alt-tekst er måske en lille detalje – men den har stor betydning.
Det gør dit indhold mere inkluderende. Det hjælper dig med at opfylde tilgængelighedsstandarder. Det booster SEO.
Men vigtigst af alt forbedrer det oplevelsen for rigtige mennesker, der er afhængige af hjælpemidler hver dag.
Ved at følge bedste praksis og undgå de almindelige fejl, der er skitseret ovenfor, kan du begynde at gøre tilgængelighed til en naturlig del af din indholdsproces.
Få mere at vide om Tag et kig på vores WayWidget og hjælp flere mennesker med at få adgang til dit websted.