Beskriv med text allt innehåll som inte är text
Om riktlinjen
- Innehåller lagkrav
- EN 9.1.1.1
- WCAG 1.1.1 (A)
Innehåller lagkravOmråde
Personer som använder till exempel skärmläsare och punktdisplay behöver beskrivningar av allt innehåll som inte är text eftersom dessa hjälpmedel inte kan tolka foton, bilder och grafik. Tanken med textalternativ, även kallat alt-text, är att den ska kunna ersätta och beskriva en bild eller ett foto för de som inte ser.
Därför behöver du beskriva bilder och innehåll som inte är text
Med hjälp av digital teknik kan de flesta användare ta till sig text. Den som ser kan läsa texten, den som hör kan få den uppläst och den som läser med hjälp av känseln kan få texten presenterad som punktskrift.
Text kan förstoras och presenteras med olika teckensnitt och färgskalor. Uppläsning med skärmläsare (talsyntes) kan ske med olika hastighet och röster. Ibland kan text till och med översättas automatiskt innan den presenteras för användaren.
Personer som använder till exempel skärmläsare och punktdisplay behöver beskrivningar av allt innehåll som inte är text eftersom dessa hjälpmedel inte kan tolka foton, bilder och grafik.
Vad kräver lagen?
Se till att det finns textbeskrivningar till allt informationsbärande icke-textbaserat innehåll. Textbeskrivningarna kallas även för textalternativ, eller alt-texter.
Icke-textbaserat innehåll är till exempel:
- foton
- bilder
- diagram
- animationer
- ikoner.
Formulera textalternativ utifrån bildens budskap och sammanhang
Tanken med textalternativ är att de ska kunna ersätta och beskriva bilden för den som inte ser bilden.
Exempel: Varning!
En röd triangel används som varningsikon för viktig varningsinformation. Då behöver budskapet som ikonen förmedlar beskrivas, det vill säga ”Varning!” Ikonens utseende är i detta fall inte relevant, till exempel ”röd triangel.”
Beskriva ett motiv
Textalternativet kan behöva bestå av en kort beskrivning av motivet. Beskriv innehållet tillräckligt detaljerat för den som enbart uppfattar textbeskrivningen.
Exempel: en grön bil
Illustrationen nedan på den gröna bilen kan ha antingen ett tomt textalternativ, alt="", eller beskrivningen "En grön bil". Det beror på sammanhang och syfte. Är illustrationen enbart dekorativ eller tillför bilden något?
Beskriva en känsla
Ibland är det viktigt att textalternativet beskriver känslan i en bild, och inte en saklig beskrivning av motivet, för att användaren ska få en förståelse för innehållet. Utgå från användarens behov och innehållets syfte.
Beskriva diagram eller annan komplex bild
En komplex bild som exempelvis ett diagram kan innehålla en stor mängd information.
Exempel: diagram över smittspridning
Om ett diagram visar smittspridningen över tid räcker det inte med att textalternativet till bilden är ”Diagram över smittspridningen.” Textalternativet ger då inte någon information om själva smittspridningen. Ett bättre textalternativ är att beskriva det diagrammet förmedlar, till exempel: ”Antal sjuka per dag var 2 000 i slutet av maj, nära noll under sommaren och ökade till 8 000 i november.”
Om diagrammet innehåller för mycket information för att beskrivas i textalternativet, kan informationen istället presenteras i tabellform och textalternativet till diagrammet kan då vara ”Diagram över smittspridningen, se tabell.”
Dölja dekorativt innehåll
Innehåll som utgörs av annat än text och som enbart används för dekoration eller visuell formgivning (formatering), behöver inte ha textalternativ utan ska istället döljas för hjälpmedel. Dessa element innehåller ingen information och det går lika bra att använda webbsidan, dokumentet eller appen även utan dem.
Dekorativa bilder
Bilder och illustrationer som inte tillför någon information och som egentligen är till för att ”vila ögonen” på kallas för dekorativa bilder. Dessa ska döljas för hjälpmedel. Personer som exempelvis använder uppläsande hjälpmedel slipper på så vis lyssna till beskrivningar av bilder som inte tillför innehållet något.
Använd tomt alt-attribut
Alt-attributet kan användas för att dölja en bild, genom att du ger bilden ett tomt alt-attribut: alt=””. Det går inte att helt utelämna eller strunta i alt-attributet, eftersom bilden då kan få till exempel sitt filnamn uppläst som textalternativ.
Informationsbärande eller dekorativ bild?
Ibland kan det vara svårt att avgöra vad som är informationsbärande eller dekorativa element. För att ta reda på om en bild är dekorativ kan du fråga dig själv vad du skulle säga om du beskrev webbsidans innehåll för någon – om du helt hoppar över bilden är den troligen dekorativ. Det är personen som använder sig av eller publicerar en bild, som behöver avgöra i vilket syfte bilden används.
Innehåll med särskilda krav på textalternativ
Visst innehåll som inte är text behöver inte ha textalternativ som förmedlar samma sak som innehållet. Det gäller de typer av innehåll som beskrivs nedan.
Navigeringsmetod/funktion, inmatning
Om innehåll som inte är text är en kontroll, exempelvis en navigeringsmetod eller -funktion, alternativt är en kontroll som accepterar inmatning från användare, ska den ha ett namn som beskriver kontrollens syfte.
Tidsberoende media
Om innehåll som inte är text är tidsberoende media så behöver inte textalternativet ha samma syfte som innehållet, men textalternativet ska ge en beskrivning av innehållet.
Tidsberoende media är exempelvis förinspelad media:
- ljudklipp
- video
- animationer
Test eller övning
Om innehåll som inte är text är ett test eller en övning som inte skulle fungera i form av text, så behöver inte textalternativet ha samma syfte som innehållet, men textalternativet ska ge en beskrivning av innehållet.
Sensorisk upplevelse
Om innehåll som inte är text främst är avsett för att ge en ”specifik sensorisk upplevelse” så behöver inte textalternativet ha samma syfte som innehållet, men textalternativet ska ge en beskrivning av innehållet. Det kan exempelvis handla om ett stämningsskapande ljud.
CAPTCHA
En CAPTCHA ska ha ett textalternativ som identifierar och anger innehållets syfte. Alternativa former av CAPTCHA ska finnas som kan användas av personer med olika funktionsnedsättningar.
Rekommendationer utöver lagkrav
Förutom lagkraven finns det rekommendationer som kan förbättra den digitala tillgängligheten:
Undvik långa alt-texter
Försök att hålla nere längden på dina alt-texter. För en komplicerad bild som behöver en lång beskrivning ska du kanske överväga att skriva ut informationen i brödtexten i anslutning till bilden.
Det är troligtvis fler än personer som använder hjälpmedel som kan behöva stöd att ta till sig innehållet i en komplicerad bild eller grafik.
Beskriv kärnfullt och undvik åsikter
Om textalternativet ska beskriva ett motiv är det ofta bättre att sakligt och kortfattat beskriva innehållet än att ta upp varje detalj.
Undvik att inleda textalternativ med ”Bild på …” eller ”Foto av …” eller liknande om detta inte är relevant. Att det är en bild förmedlas ändå av hjälpmedel (om uppmärkningen är korrekt).
Undvik också att ge subjektiva omdömen. Skriv exempelvis hellre ”en svart bil” än ”en snygg bil”.
Undvik upprepningar
Om det finns en bildtext eller annan brödtext som beskriver bildens innehåll bör bilden inte ha ytterligare textalternativ som upprepar textens innehåll. Undvik upprepningar genom att provlyssna med skärmläsare.
Så testar du textalternativ
Ett bra sätt att bedöma hur bra alternativa textbeskrivningar fungerar är att lyssna på innehållet med hjälp av en skärmläsare.
Det finns även gratis tilläggsprogram som installeras i webbläsaren, som ger möjlighet att ersätta bilder med bildernas textalternativ.
Utdrag från WCAG
WCAG 1.1.1 (A) Textalternativ
Allt innehåll som inte är text, som presenteras för användaren, har ett textalternativ med samma syfte, utom i vissa angivna situationer.
- Svensk översättningen: Innehåll som inte är text (w3.org)
Länk till annan webbplats. - Originaltext på engelska: Success Criterion 1.1.1 Non-text content (w3.org) Länk till annan webbplats.
Därför länkar vi till WCAG på svenska och engelska
Ditt svar hjälper oss att förbättra sidan
Senast uppdaterad: