Till innehållet
← TP Gruppen
Alla bolag & tjänster
tpdesign.se ↗
Illustrativ miljö för TP Design

TP Design · GUIDER & PLANERING

Granska färgpar för text och gränssnitt

Dokumentera vilka färger som fungerar tillsammans i verkliga textstorlekar och användningsmiljöer.

Börja med rätt underlag

En färgpalett är inte samma sak som en lista godkända textkombinationer. Börja med konkreta par: textfärg, bakgrund, textstorlek och användning. W3C:s kriterium för minsta textkontrast skiljer mellan vanlig och stor text. För nivå AA är de grundläggande förhållandena 4,5:1 respektive 3:1, med kriteriets angivna undantag och definitioner.

Så kan du arbeta vidare

Prova även färger över fotografier, toningar och genomskinliga ytor. Där kan bakgrunden variera inom samma komponent. Dokumentera resultatet för den faktiska kombinationen i stället för att kalla en enskild färg tillgänglig. Kontrastgranskningen behöver kompletteras med exempelvis fokusmarkeringar och hur information uttrycks utan enbart färg.

Ett tänkt exempel

Ett ljust guld fungerar som dekorativ linje men blir svårläst i liten löptext mot vitt. Manualen visar därför en mörkare textkombination för den användningen och behåller guldet som accent. Beslutet går att följa i både designfil och senare webbkomponenter.

Kontrollera ditt underlag

  1. Mät text mot den bakgrund som faktiskt visas i komponenten.
  2. Ange storlek och användning tillsammans med varje godkänt färgpar.
  3. Kontrollera tillstånd som fokus, fel och markerat val i den verkliga layouten.

En vanlig fråga

Räcker en godkänd kontrastmätning för hela tillgängligheten?

Nej. Den svarar på en avgränsad fråga och ersätter inte granskning av funktion, struktur och innehåll.

Källor & avgränsning

Bakgrund till de sakuppgifter som nämns i guiden. Exemplen och arbetsfrågorna är egna pedagogiska underlag.

Exemplen är tänkta situationer. Aktuellt erbjudande och konkret omfattning bekräftas direkt med verksamheten.

Fortsätt inom TP Design