Kontrast

Kontrast mellan textens och bakgrundens färg är viktig. En bra kontrast gör att texten blir läsbar. Kontrasten definieras som förhållandet mellan ljusstyrkan hos bokstäverna och bakgrunden.

Lästid: 2-3 minuter.

WCAG (Web content accessibility guidelines) reglerar kontrasten. Den ska normal vara 4,5:1.

För att vara säker på att få en tillräcklig kontrast kan du överdriva den. Webbriktlinjer.se rekommenderar en kontrast som är 7:1 för att du ska vara säker på att alla kan läsa texten.

Undvik att ha foton som bakgrund

Kontrasten ska vara bra mot hela den bakgrund som texten ligger på. Därför är det sällan bra att ha foton som bakgrund. Hela fotots ljusstyrkan ska uppfylla kontrastkraven. I bild 1 ser du ett exempel på en text mot en fotobakgrund.

Bild 1. Fotot var en del av en Teliaannons i februari 2023. Fotot har inte tillräcklig kontrast mot den vita texten.

Ta hänsyn till ljust eller mörkt läge i appar

Läsaren kan välja mellan ljust och mörkt läge i de flesta appar. I mörkt läge blir bakgrunden mörk och texten vit. I ljust läge är det tvärtom.

Om du väljer att lägga en färgad platta som bakgrund så måste du testa att den fungerar i båda lägen. Texten förblir vit i mörkt läge om du inte själv ändrar textfärgen. Och i ljust läge är färgen på texten normalt svart.

Bild 2 och 3 visar en text där en del av texten har turkos överstrykning. I ljust läge är kontrasten god och det går att läsa texten.

Bild 2. Turkos bakgrund fungerar bra i ljust läge då texten är svart.
Bild 3. Turkos bakgrund har inte tillräcklig kontrast mot den vita texten i mörkt läge.