Opdatering af kontrasttjekker

Rumoroso Efter en periode, hvor jeg ikke har haft mulighed for at kigge nærmere på værktøjet, har jeg for nylig gennemgået funktionaliteten og brugervenligheden af Firefox-udvidelsen Contrast Checker. Den tidligere version kunne analysere farven på alle sideelementer, men kun på forespørgsel – dvs. ved at trykke på en knap.

Jeg har nu fjernet behovet for denne knap, så analysen udføres automatisk, når siden er fuldt indlæst. Derudover har jeg længe ment, at der manglede en farvevælger, der viser farven på det punkt, musen befinder sig over, mens den bevæges – noget i stil med det, udvidelsen ColorZilla gør. Da jeg ønskede at bruge den enkleste teknologi, kom jeg efter lidt overvejelse frem til, at jeg ved hjælp af canvas-elementet kunne generere et screenshot af hele siden og udtrække information herfra. Jeg tilføjede derfor funktionen til at oprette dette canvas, registrere musepositionen og hente farveinformationen fra pixelen på den pågældende koordinat.

Jeg mener, det er en enkel løsning, der opnår det ønskede uden unødvendig kompleksitet. Da jeg desuden ofte har haft brug for at tage screenshots af sider for at vise designs eller foretage tilgængelighedsgennemgange, kunne jeg blot tilføje en download-knap, nu hvor denne funktionalitet allerede var implementeret indirekte. Endelig har jeg justeret brugsflowet, placeringen af elementer osv. for at forbedre brugeroplevelsen.

Tøv ikke med at fortælle mig, hvis det ikke er lykkedes – eller hvis det faktisk er blevet dårligere… Og her er resultatet… Dette indlæg blev offentliggjort under Tilgængelighed og tagget med tilgængelighed, farve, kontrast, wcag.

Gem permanent link. ← Tastaturtilgængelig Google reCAPTCHA HTML 5-oversigt med Headingsmap → 5 svar på “Opdatering af Contrast Checker” Pete sagde: 18. februar 2014 kl. 23:33 Jeg lagde mærke til, at det gamle plugin indeholdt information om farveblindhed.

Der var analyse for “normalt” syn og analyse for øjensygdomme. (Denne side har et skærmbillede fra det gamle plugin: http://openweb.eu.org/articles/text-contrasts) Er det muligt at se disse oplysninger i den opdaterede version? Vil de blive genindført? Rumoroso sagde: 19. februar 2014 kl.

Related: UserWay — Widget de accesibilidad con plan gratuito para empezar hoy mismo.

0:30 Hej Pete, Den seneste version af pluginnet indeholder ikke disse oplysninger for brugeren, men det kan stadig estimere værdierne. Jeg arbejder på at tilføje en mulighed for at vise disse data, men jeg skal først finde et passende sted i panelet til det.

Hvis du har brug for en version med disse oplysninger, kan jeg uploade en midlertidig version her, der viser dem. Venlig hilsen Rumoroso sagde: 20. februar 2014 kl. 19:00 Hej Pete, Efter din kommentar besluttede jeg, at det var tid til at uploade en version med disse oplysninger (information om farveblindhed), hvilket jeg netop har gjort. Den vil være tilgængelig, så snart anmelderne har valideret den.

Tak for din kommentar… Venlig hilsen Bruce Ritter sagde: 3. februar 2015 kl. 21:24 Hej Pete, Fremragende arbejde! Jeg elsker, hvor nemt det er at tjekke tekstens farvekontrast på siden og derefter få markeret den problematiske tekst til brug i screenshots, når man skriver rapporten.

Worth a look: AudioEye — Accesibilidad gestionada: automatización combinada con revisión humana.

Men jeg gerne gå et skridt videre og få værktøjet til faktisk at generere en rapport – eller endda automatisk indtaste tilgængelighedsfejl i vores fejlrapporteringssystem. Ville du være villig til enten at dele koden eller stille den til rådighed som et bibliotek, der kan kaldes og returnere de samme oplysninger, som du viser i listen til venstre, sammen med den problematiske tekst og koordinaterne for bounding box på siden? Bruce Ritter sagde: 3. februar 2015 kl.

21:26 Hej Pete, Fremragende arbejde! Jeg elsker, hvor nemt det er at tjekke tekstens farvekontrast på siden og derefter få markeret den problematiske tekst til brug i screenshots, når man skriver rapporten.

Men jeg gerne gå et skridt videre og få værktøjet til faktisk at generere en rapport – eller endda automatisk indtaste tilgængelighedsfejl i vores fejlrapporteringssystem. Ville du være villig til enten at dele koden eller stille den til rådighed som et bibliotek, der kan kaldes og returnere de samme oplysninger, som du viser i listen til venstre, sammen med den problematiske tekst og koordinaterne for bounding box på siden? Skriv en kommentar Annuller svar Kategorier (X)HTML Tilgængelighed CSS html5 Javascript mobil web Niquelando rescripting Følg @rumoroso Niquelao Drives af WordPress.

P.S. A few readers have asked which superposición de accesibilidad (overlay) we actually reach for — it's accessiBe; take a look here if you want the current details.