Boje koje odaberete za sučelje aplikacije utječu na čitljivost i razumljivost elemenata sučelja za korisnike. Odgovarajući kontrast boja olakšava čitanje i razumijevanje teksta i slika.
Pored koristi za osobe oštećenog vida, dovoljan kontrast boje pomaže i svim korisnicima kada gledaju sučelje na uređajima u ekstremnim uvjetima osvjetljenja, primjerice na izravnoj sunčevoj svjetlosti ili na zaslonu niske svjetline.
Implementacija
Prilikom implementacije korisničkog sučelja aplikacije odredite boju pozadine i boju prednjeg plana s dovoljnim kontrastom.
Omjer kontrasta predstavlja izračun razlike u osvijetljenosti ili intenzitetu emitiranog svjetla između dvije susjedne boje kada se prikazuju na zaslonu. Raspon tog omjera iznosi od 1 do 21 (često se piše kao 1:1 do 21:1), pri čemu veći brojevi znače jači kontrast. Dostupno je mnogo alata za izračunavanje omjera kontrasta dviju susjednih boja, a jedan od njih je i ovaj kalkulator omjera kontrasta boje.
Prilikom upotrebe elementa TextView za prikaz teksta upotrijebite android:textColor i android:background da biste definirali boje prednjeg plana i pozadine s visokim kontrastom. Prilikom upotrebe elementa Text u alatu Compose upotrijebite parametar boje Modifier.background da biste definirali boje prednjeg plana i pozadine s visokim kontrastom.
- barem 4,5:1 za mali tekst (manji od 18 točaka normalno ili 14 točaka podebljano)
- barem 3:1 za veliki tekst (veći od 18 točaka normalno ili 14 točaka podebljano).
Napomene o kontrastu boja:
-
Prilikom upotrebe elementa
ImageViewiliImageza renderiranje grafičkog sadržaja ili ikona osigurajte da kontrast između prednjeg plana i pozadine doseže ili premašuje preporučene omjere. - Omjeri kontrasta mjere se na temelju vidljive boje prednjeg plana i pozadine elementa kada je uslojen s drugim a elementima. Ako se boje definiraju u formatu ARGB (heksadecimalne vrijednosti za #AARRGGBB), boje koje nisu neprozirne (one s vrijednošću alfa kanala manjom od 255) mogu imati drugačiju vidljivu boju zbog pretapanja sa sadržajem prikazanim ispod njih.
- Izglađivanje i omekšavanje fonta mogu utjecati na vidljivu boju nekog sadržaja, posebice sadržaja s malom širinom poteza. Radi bolje čitljivosti odaberite kombinaciju boja s većim omjerom kontrasta ili povećajte širinu poteza sadržaja.
Dizajn
Prilikom dizajniranja korisničkog sučelja za susjedne boje odaberite paletu s dovoljnim kontrastom.
- Poglavito za tekst i ikone slijedite smjernice W3C-a za minimalne omjere kontrasta.
- Savjetujemo da uključite temu s visokim kontrastom kao opciju ili dopustite korisnicima odabir boja za primarni sadržaj.
Više informacija potražite u smjernicama za boju i kontrast Materijalnog dizajna.
Testiranje
Da biste ručno provjerili kontrast boja u aplikaciji, učinite sljedeće:
- Otvorite aplikaciju.
- Napravite snimku zaslona.
- Pomoću softvera za pregledavanje ili uređivanje slika alatom kapaljke uzmite uzorak vidljivih boja na snimci zaslona.
- Upotrijebite kalkulator omjera kontrasta za određivanje omjera kontrasta susjednih boja.
- Ako je omjer kontrasta manji od onog koji definiraju smjernice W3C-a, bilo bi dobro da povećate kontrast boje sučelja.
Androidovi automatizirani alati za testiranje mogu otkriti mnoge poteškoće s kontrastom boje. Savjetujemo vam da pomoću Provjere pristupačnosti za Android ručno testirate aplikaciju na uređaju. Za automatizirana testiranja uključite provjeru pristupačnosti u testovima Espresso i Robolectric.