axessia.eu

Det vanligaste misstaget med alternativ text: vad går fel och hur undviker du det?

Den största fallgropan med alternativ text är inte att den saknas, utan att den finns men ändå tillför ingenting. Den här artikeln visar var det går fel och hur du känner igen det.

Det vanligaste misstaget med alternativ text är inte att den saknas. Det händer också, men det är det synliga misstaget som märks snabbt. Det mer envisade misstaget är att alt-texten finns där, men tillför ingenting: filnamnet på fotot, ordet "bild", en utförlig beskrivning av en dekorativ kant, eller ingenting alls vid en knapp som bara består av en ikon. För en skärmläsaranvändare skapar det brus istället för information, och ibland betyder det att en funktion på sidan blir oanvändbar.

WCAG 2.1, den standard som EN 301 549 är baserad på, kräver att innehål utan text får en textalternativ som tjänar samma syfte. Det låter enkelt, men i praktiken avkryssas ofta detta krav formellt utan att texten är funktionell. Det står något i alt-attributet, checklistan är ifylld, men användaren som låter texten läsas upp får inget nytta av det.

Vad som exakt går fel

Ett par mönster återkommer ständigt. Filnamnet som alt-text, såsom "IMG_2044.jpg" eller "product-foto-3.png", för att ett redaktionssystem fyller i det automatiskt och ingen korrigerar det. En alt-text som är ifylld med sökord istället för en beskrivning, vilket kanske är avsett för sökmotorer men låter som meningslös uppräkning för en skärmläsare. En dekorativ bild, såsom ett stämningsfoto bredvid en rubrik, som ändå får en utförlig beskrivning och därför onödigt långsammar ner läshastigheten. Och möjligen det vanligaste: funktionella ikoner, såsom en shoppingvagn, ett förstoringsglas eller ett kryss för att stänga något, som fungerar som knappar men saknar helt textnamn. En skärmläsare läser då bara "knapp", utan att det är klart vad knappen gör.

Med produktbilder går det ofta åt andra hållet: alt-texten beskriver fotot istället för produkten. "Kvinna i blå tröja på strand" säger ingenting om klädesplagg som säljs, medan just det är informationen som en användare söker när fotot inte är synligt.

Varför en automatiserad skanning inte helt kan fånga detta

En skanning kan med säkerhet fastställa om en bild har ett alt-attribut och om det är tomt. Det är användbart och fångar de grovaste misstagen. Det som en skanning inte med säkerhet kan bedöma är om innehållet i texten är korrekt: om "foto" verkligen beskriver vad som syns, eller om en iconknapp har fått ett meningsfullt namn som motsvarar funktionen. Det kräver bedömning av en människa, och det är precis därför varje rapport anger vilken del av testningen som är automatiserad och vilken del som inte är det. Om du snabbt vill se på din egen webbplats var de tydliga fallen finns, då är det möjligt att se på ett par minuter med den kostnadsfria snabbscanningen.

Hur du undviker det

Den mest praktiska frågan när du skriver en alt-text är: vad skulle jag säga högt för att beskriva den här bilden för någon som inte ser den, i sammanhanget på den här sidan? För en produktfoto är det klädesplagg, färg eller egenskapen som fotot visar. För en knapp är det åtgärden som knappen utför, inte själva ikonen. För en rent dekorativ bild, såsom ett bakgrundsmönster, är en tom alt-text (alt="") faktiskt rätt val, så att en skärmläsare hoppar över bilden istället för att läsa något som inte tillför något.

Det är också en av de platser där en tidigare bra situation kan försämras utan att någon märker det: en redaktör lägger till ett nytt produktfoto, systemet fyller automatiskt i filnamnet, och texten som tidigare fanns är borta. Det är inte en engångsuppgift utan något som återkommer vid varje ändring, vilket också är anledningen till att det här ämnet hör hemma bland de bredare kraven kring innehål utan text som har utarbetats per situation i kunskapsbasen per situation.

Vad detta ger

Bra alternativ text är inte en fråga om mer text, utan om rätt text på rätt plats: kort och funktionell vid knappar och ikoner, meningsfull vid produktfoton, och frånvarande där en bild är rent dekorativ. Att göra det här skillnaden tar lite tid när mönstret väl är tydligt, och det sparar mycket efterforskningsarbete senare. Hur vi återför det här skiljet i en rapport till konkreta, prioriterade punkter beskrivs på sidan om hur bedömningen görs, och för de frågor som oftast återkommer där finns det en sammanfattning med svar.

Vill du veta om den här typen av fel också förekommer på din webbplats? Den kostnadsfria snabbkontrollen ger dig en första, icke-bindande överblick över det, utan att du behöver ett konto.

Den här artikeln är allmän information och inte juridisk rådgivning.