Hall tekst valgel taustal on halb mõte (Kontrasti ABC)

"See näeb nii puhas ja minimalistlik välja," ütleb disainer, vaadates helehalli teksti valgel taustal oma 4K retina ekraanilt pimedas toas. "Ma ei näe midagi," ütleb kasutaja, kes istub bussis ja kellel päike ekraanile peegeldab. Kontrast ei ole "iluasi". See on funktsionaalsus.

WCAG 2.2 Reeglid: AA vs AAA

Web Content Accessibility Guidelines (WCAG) paneb paika konkreetsed matemaatilised ratiod.

AA (Miinimum): Tavateksti kontrastsus peab olema vähemalt 4.5:1. Suure teksti puhul 3:1.
AAA (Ideaalne): Tavatekst 7:1. See on kuldstandard, mida soovitame finants- ja meditsiinisektorile.

Värvipimedus: 8% meestest

Iga kaheteistkümnes mees on värvipime.

Kõige levinum on punase-rohelise pimedus (Deuteranopia). Kui sinu veateade on punane ja õnnestumise teade on roheline, ja sa ei kasuta ikoone, siis 8% kasutajatest ei saa aru, mis juhtus. Lahendus: Lisa alati "topelt-kooding". Värv + Ikoon (nt linnuke või hüüumärk). Värv + Tekst ("Viga!").

Tööriistad disaineritele:

Ära arva, mõõda. Kasuta tööriistu nagu "Stark" (Figma plugin) või "Contrast" (macOS äpp), et kontrollida kontrastsust reaalajas. Kui su brändivärv on liiga hele, siis teksti jaoks kasuta selle tumedamat versiooni.

KKK: Kontrast

Kas must-valge on alati parim? +

Mitte alati. Puhas must (#000000) puhtal valgel (#FFFFFF) võib tekitada silmade väsimust (kontrast on liiga karm). Soovitame kasutada tumehalli (#1A1A1A) pehmel valgel (#F5F5F5).

Kas see mõjutab SEO-d? +

Jah. Google "näeb", kui tekst on taustaga liiga sarnane ja võib lugeda seda "peidetud tekstiks" (cloaking), mis toob kaasa karistuse.