Verifica contrasto colori (WCAG)
Scegli il colore del testo e dello sfondo: ottieni il rapporto di contrasto, l'esito AA e AAA e un'anteprima reale della leggibilità .
Rapporto di contrasto (da 1:1 a 21:1)
Questo è un testo normale di esempio: un paragrafo come quelli che i tuoi visitatori leggono ogni giorno.
Questo è un titolo grande
Cosa significano le soglie AA e AAA
Le linee guida WCAG (Web Content Accessibility Guidelines) misurano la leggibilità con un rapporto di contrasto che va da 1:1 (nessun contrasto) a 21:1 (nero su bianco). Il livello AA, richiesto dalla maggior parte delle normative sull'accessibilità , chiede almeno 4,5:1 per il testo normale e 3:1 per il testo grande. Il livello AAA, più severo, alza le soglie a 7:1 e 4,5:1. Per "testo grande" si intende un testo da almeno 24 px, oppure 18,5 px se in grassetto.
Perché il contrasto conta davvero
Circa una persona su venti ha una qualche forma di deficit visivo o di percezione dei colori, e chiunque legge peggio su uno schermo al sole o con la luminosità bassa. Un contrasto insufficiente è tra gli errori di accessibilità più diffusi sul web ed è anche tra i più semplici da correggere: spesso basta scurire leggermente il testo o schiarire lo sfondo di qualche tono. Verifica sempre anche gli stati secondari, come i link, i placeholder e il testo sui pulsanti colorati.