Proveravač kontrasta – Contrast Checker

Ovaj Proveravač kontrasta proverava WCAG i APCA boje kontrasta za usklađenost sa ADA — test pristupačnosti boja za bilo koju veb…

✅ Šta ćete dobiti od ovog proveravača kontrasta: - WCAG 2.2 odnos kontrasta i APCA Lc, - elementi sa problemima istaknuti na stranici, - CSS pravila koja su proizvela boje, praćena kroz izvorne mape (ako su dostupne), - ugrađeni alat za izbor boja sa analizerom kontrasta i predloženim alternativama, - uživo pregled ispravki, - izvoz ispravki u CSS (sa komentarima za lociranje izvora). 🔍 Izgrađen kao proveravač boja na vebu koji prolazi kroz pseudo-stanja, senku DOM-a, iframe-ove iste domene i tekst preko slika i gradijenata — ne samo ravne pozadine. ⚠️ Potrebna dozvola za debagovanje. Pokrivenost ovog proveravača kontrasta je moguća samo putem Chrome DevTools protokola, koji zahteva dozvolu 'debugger'. Kada se poveže, Chrome prikazuje obaveštenje na svim karticama i ne skriva ga prilikom odvajanja. ⚡ Visoko optimizovan radni tok: • Pogledajte sve elemente sa problemima u pristupačnosti boja istaknute na prvi pogled. • Pregledajte promene odmah, sa proračunatim odnosima kontrasta i presudama. • Primijenite prilagođeni CSS na kartici Stilovi; pogođeni problemi su označeni na listi. • Da biste ručno proverili kontrast boja, koristite ugrađeni alat za izbor boja: levim klikom postavite prednju boju, desnim klikom pozadinsku boju, a odnos se odmah ažurira. • Koristite karticu Isključenja da sakrijete sve osim elemenata koje ispravljate. 📐 Kriterijumi iza presuda. Ovaj proveravač odnosa kontrasta testira pristupačnost boja prema WCAG i APCA zahtevima. APCA Lc se ocenjuje prema Bridge-PCA pragovima, koji su stroži od odgovarajućih WCAG odnosa — tako da prolaz Bridge-PCA uvek implicira prolaz WCAG. 🔬 Šta je APCA? APCA (Algoritam za pristupačni perceptivni kontrast) je model koji prati kako ljudi čitaju tekst na ekranu. Dva para boja sa istim WCAG odnosom mogu izgledati primetno različito, a njihov APCA Lc (luminantni kontrast) to odražava: par može proći WCAG, a da se i dalje čini teškim za čitanje. Ovaj proveravač pristupačnosti boja na vebu izračunava oba broja. 🚧 Ograničenja: 1. Kao i svaki drugi proveravač pristupačnosti veba, ovaj daje procene na osnovu najboljih napora, a ne sertifikat o usklađenosti. 2. Pokrivenost je samo za tekst; provere ne-tekstualnih elemenata (WCAG 1.4.11) su na planu. 3. Cross-origin iframe-ovi se ne analiziraju. 4. Kompleksne pozadine i animacije se uzimaju uz ograničen broj prostorno-vremenskih tačaka; odnos najgoreg uzorka se izveštava, ali može biti optimističan; uzorak može biti zavaravan artefaktima renderovanja. 5. Visoko dinamične stranice mogu proizvoditi lažne probleme. 6. Ovaj proveravač kontrasta boja ne pokreće OCR na slikama automatski; testirajte slike sa značajnim tekstom putem uključenog alata za izbor boja. 🔒 Privatnost i dozvole. ▸ Radi lokalno; nijedan podatak sa veb stranice nikada ne napušta vašu mašinu. ▸ 'activeTab' samo: skripta za analizu se ubacuje kada kliknete na ikonu na traci sa alatima. ▸ Potrebna je dozvola 'debugger' da bi se ušlo u Shadow DOM i iframe-ove, pratili CSS izvori i uzeli uzorci kompleksnih pozadina. 🧮 Detalji tačnosti. Polu-providan tekst i prozirnost predaka se pravilno obrađuju: prednja boja se sastavlja preko svoje stvarne pozadine pre nego što se meri luminancija, tako da izveštavani odnos odgovara onome što korisnici zapravo vide. Funkcije boja širokog opsega — oklch, lab, lch, color(display-p3) — su takođe podržane, ograničene na sRGB kada su van opsega. 🎨 Tekst preko slika i gradijenata. Za razliku od većine sličnih alata, ovaj ne odustaje od ne-ravnih pozadina niti veruje onome što 'getComputedStyle' / 'CSS.getBackgroundColors' izveštavaju. Prolazi kroz redosled bojenja u pretraživaču da bi sastavio pravu pozadinu — prozirnost, načini mešanja, linearni gradijenti, filter pozadine — i kada to nije dovoljno, ovaj alat za kontrast boja uzima uzorke renderovanih piksela na lokaciji teksta. ❓ Pitanja i odgovori 📌 Zašto isti par boja ponekad dobija različite presude pod WCAG i APCA? ↳ WCAG meri luminanciju; APCA meri perceptivni kontrast. Par koji prođe 4.5:1 može i dalje biti ispod praga Bridge-PCA Lc — strožeg modela. 📌 Da li APCA zamenjuje WCAG? ↳ Ne — APCA nije zamena, već korisno drugo mišljenje. Ovaj proveravač izveštava oboje. 📌 Mogu li skenirati lokalnu datoteku ili svoj dev server sa ovim proveravačem pristupačnosti? ↳ Da. Omogućite "Dozvoli pristup URL-ovima datoteka" u podešavanjima ekstenzije. Otvorite file:// ili localhost URL i kliknite na ikonu na traci sa alatima. Samo chrome://, Chrome Web Store i drugi ograničeni shemi se preskoče. 📌 Da li ovaj alat sertifikuje usklađenost sa ADA? ↳ Ne. Proverava samo kontrast boja — jedan aspekt pristupačnosti. Usklađenost sa ADA je pravna procena koja pokriva mnoge standarde i kriterijume (semantika, pristup tastaturi, alt tekst, titlovi i još mnogo toga) i treba je proceniti kvalifikovani profesionalac.