Tillgänglighet på webben styrs av WCAG (Web Content Accessibility Guidelines), och för offentlig sektor är kraven lagstadgade. Men du behöver inte läsa juridiken för att göra dina bilder tillgängliga. Det handlar om tre konkreta saker: att bilder kan uppfattas av den som inte ser dem, att de syns tillräckligt tydligt, och att information inte göms i en bild. Här är de i praktiken.
Ge varje bild en textmotsvarighet
Den som använder skärmläsare ska få samma information som den som ser bilden. Det betyder en beskrivande alt-text på bilder som bär innehåll, och ett tomt alt-attribut på rena dekorationer så att skärmläsaren hoppar över dem.
- Informativa bilder: kort, beskrivande alt-text.
- Dekorativa bilder: tomt alt-attribut (
alt=""). - Komplexa bilder (diagram): en längre förklaring i löpande text eller bildtext.
Mer om hur du formulerar dem finns i fem enkla regler för alt-text.
Håll kontrasten uppe
När text ligger på en bild måste den synas. WCAG ställer krav på kontrast mellan text och bakgrund, och en bild är en ojämn bakgrund. Tänk på att kontrast handlar om skillnad i ljushet, inte bara kulör – olika färger har olika lyskraft, där gult är ljusast och violett mörkast. Två färger med samma ljushet ger dålig kontrast även om de ser olika ut.
Praktiskt: lägg text över ett lugnt, enfärgat parti, mörka ner eller ljusa upp ytan bakom texten, och välj ren vit eller nästan svart text. Tunn, ljus text på ett brokigt foto är nästan alltid ett problem.
Lägg inte viktig text i en bild
En text som är inbränd i en bild kan inte läsas av en skärmläsare, kan inte förstoras utan att bli suddig och kan inte översättas. WCAG avråder från text i bild just därför. Behöver ett budskap finnas på webben ska det vara riktig text – lägg den bredvid eller ovanpå bilden som HTML, inte som pixlar i fotot.
Undantaget är logotyper och rent dekorativa textinslag, där utseendet är poängen. Allt som ska läsas och förstås hör hemma som text.
Använd semantisk struktur
En bild med en synlig förklaring vinner på att märkas upp korrekt. Element som figure och figcaption knyter ihop bild och bildtext på ett sätt som hjälpmedel förstår. Korrekt struktur gör sidan begriplig både för skärmläsare och sökmotorer – tillgänglighet och sökbarhet drar åt samma håll.
Tillgängliga bilder kräver alltså inga juridiska studier. Beskriv det som syns, håll kontrasten uppe och lägg viktig text som text. Då uppfyller ni WCAG i praktiken – och gör samtidigt webben bättre för alla. Läs vidare om hur GDPR och bildrättigheter hänger ihop med en ansvarsfull bildhantering.