This translation has not been editorially reviewed yet. The German version is authoritative. Deutsche Fassung →
Barrierefreiheit
Koji je kontrast boje obavezan za tekst na web-mjestima?
Normalan tekst trebaja omjer kontrasta od najmanje 4,5:1 prema pozadini, veliki tekst — od oko 24 piksela ili bolda od oko 18,7 piksela — najmanje 3:1. Ti pragovi dolaze iz međunarodni standard WCAG. Oni osiguravaju da i ljudi sa pogoršanom maglom mogu čitati vaš tekst — i svaki posjetitelj sunčeve svjetlosti na mobitelu.
Omjer kontrasta, objašnjen svakodnevnim jezikom
Omjer kontrasta opisuje kako se boja teksta i boja pozadine razlikuju u svetlosti. Crno na bijelom dostiže maksimum od 21:1 i lako se čita. Modna svjetla siva na bijelom često pada ispod 3:1 — za ljude sa starosnom sljepošću takav tekst se raspršuje u sivu površinu. Pogođeni nisu samo slijepici: i kupac koji traži vaše vrijeme otvaranja na sunčevoj svjetlosti na mobilnom padanju kratkog kontrasta. Prag od 4,5:1 za normalan tekst i 3:1 za veliki tekst je dogovor u standardu između slobode dizajna i pouzdane čitljivosti.
Kako naš mjerni sustav mjeri kontrast — i na slikama
Osnovna mjerenja preuzima axe-core: izračunava omjer kontrasta za tekstove na vašoj stranici iz teksta i pozadine boje. Pri tekstu na fotografijama ili gradijentima niti jedan alat ne može samo pročitati pozadinu — upravo ondje ide naš mjerni sustav dalje: kratko čini tekst nevidljiv, fotografira mjesto u pregledniku, izračunava svjetlinu stvarne pozadine piksela po piksela te iz toga određuje pravi kontrast prema boji teksta. Iz "nedefinitano" postaje pouzdana odluka. Svako pada mjesto dokumentira izvješće s izmjerenom vrijednosti, traženim pragom i dokaznom slikom — vidite točno koji dio teksta je pogođen.
Poboljšanje kontrasta bez gubitka dizajna
Dobri kontrasti ne forsiraju crno-bijeli dizajn. Obično je dovoljno boju teksta malo zatamniti — od svetle sive postaje srednja antracit koja izlučuje istu rezerviranost i ipak je čitljiva. Pri tekstu na fotografijama pomažu provjereni trikovi: poluprozirna tamnija površina iza teksta, gradijent na donjem rubu slike ili pomicanje teksta na mirnu sliku površinu. Vašu robnu marku ne trebate mjenjati — često je dovoljno koristiti je na velikim površinama a za tekst koristiti tamniju ili svjetliju varijaciju iste boje obitelji.
Beispiele
Grauer Fließtext auf Weiß
body { color: #999999; background: #ffffff; } /* 2,8:1 */body { color: #595959; background: #ffffff; } /* 7,0:1 */Die Grenze für normalen Text ist 4,5:1, für großen Text ab 24 Pixel 3:1. Der Wert steht im Prüfbericht je Fundstelle.
Weiße Schrift auf Markenfarbe
.knopf { color: #fff; background: #5aa9ff; } /* 2,5:1 */.knopf { color: #fff; background: #1a5fb4; } /* 6,3:1 */- Prvo provjerite sive tekstove vaše web stranice — podnožje, natpise i upute obrasca najpčešće padaju ispod praga.
- Molimo vašu agenciju da provjeri sve boje teksta prema pragovima 4,5:1 i 3:1 te dokumentira vrijednosti.
- Postavite tekst na fotografije s poluprozirnom tamnom površinom umjesto prepuštanja čitljivosti slici.
- Pogledajte svoju stranicu pri osvijetljenju dnevnog svjetla na mobilnom uređaju — ono što pada tamo pada i za slabovidne posjetitelje.
- Fiksna kombinirane boje u vašem priručniku dizajna kako bi nove stranice preuzele.