Standardit · WCAG 2.2

SC 1.4.6 Taso AAA WCAG 2.0

Kontrasti (parannettu)

AAA-tason kontrasti: 7:1 leipätekstille ja 4,5:1 suurelle tekstille. Tiukempi kuin 1.4.3, tarkoitettu käyttäjille, joilla on merkittävä heikkonäköisyys ja jotka tarvitsevat korkeampaa kontrastia lukeakseen vaivatta.

Mitä vaaditaan

AAA-tasolla leipätekstin kontrastin on oltava vähintään 7:1 ja suuren tekstin (18 pt tai 14 pt lihavoitu) vähintään 4,5:1. Samat poikkeukset kuin 1.4.3:ssa — logot, dekoratiivinen teksti, passiiviset kontrollit — mutta vaatimus on noin kaksi kertaa tiukempi. Suunniteltu käyttäjille, joilla on kohtalainen tai vaikea heikkonäköisyys, jolloin 4,5:1 on silti vaikeaa lukea huonossa valossa.

Miten täyttää vaatimus

  • Käytä kontrastintarkistajaa, joka näyttää sekä AA- että AAA-tuloksen; tähtää AAA-sarakkeeseen.
  • Valkoisella taustalla etualateksti, jonka väri on tummempaa kuin #595959, ylittää yleensä 7:1.
  • Tummassa tilassa vaaleampi kuin #b3b3b3 lähes mustalla taustalla ylittää yleensä vaatimuksen.
  • Käytä puhdasta mustaa puhtaalla valkoisella, kun brändäys sen sallii — turvallisin 21:1-suhde.
  • Yhdistä AAA-kontrasti käyttäjäkytkimeen, jos korkean kontrastin tila törmäisi brändin oletusteemaseen.

Yleisiä virheitä

  • Harmaa leipäteksti (#666), joka läpäisee 4,5:1-vaatimuksen mutta ei 7:1-vaatimusta — läheltä piti on silti epäonnistuminen.
  • Brändiväriset toimintapainikkeet, jotka saavuttavat 4,5:1 mutta eivät 7:1 — useimmat eivät.
  • Korkean kontrastin teema, joka epäonnistuu ei-tekstin kontrastissa (1.4.11), vaikka tekstin kontrasti läpäisisi.

Miksi tämä on tärkeää

AAA-taso vaaditaan harvoin sopimusperusteisesti, mutta korkean kontrastin teeman tuki on yhä odotetumpaa julkisen sektorin ja avustavan teknologian ympäristöissä. Selkein ratkaisu on tarjota valinnainen korkean kontrastin teema, joka täyttää 7:1-vaatimuksen pakottamatta oletusteemaseen muutoksia brändin kustannuksella.