Closed PiemP closed 1 year ago
Ciao @PiemP, a livello "prescrittivo" gli stati disabled
non hanno obblighi WCAG di contrasto colore, vedi per riferimento criterio 1.4.3 eccezione "Testo non essenziale" per parti inattive dell'interfaccia utente.
Buona pratica secondo me almeno 3:1 (il minimo per gli elementi grafici dell'interfaccia) averlo. Qui un ottimo articolo sul tema. Ma ripeto, al limite buona pratica, non prescrizione.
Con @zetareticoli ne abbiamo parlato alcune volte in chiave aggiornamento di tutti i colori di stato disabled
nel nuovo kit UI, IMHO aspetterei il lavoro di design lì sul kit prima di fare modifiche a Bootstrap Italia, ovviamente scambio di opinioni sul tema bene accetto.
ps. il livello di cui parliamo è quello di rispettare A e AA delle WCAG 2.1, come chiesto dalle linee guida di design e dalle linee guida di accessibilità per i siti web delle PA.
Grazie @Fupete per le informazioni cercherò di ricordarmele la prossima volta 😋. Sono pienamente d'accordo con quanto dici: il criterio è chiaro e ci da maggiore libertà ma è comunque giusto arrivare almeno ad un rapporto di 3:1 .
Nota: sarà risolta da questa PR più ampia https://github.com/italia/bootstrap-italia/pull/776
Perdonatemi...sono ancora qui a creare ansia.
Versione di Bootstrap Italia
2.0.8
Comportamento atteso
Rapporto contrasto tra colore del testo e sfondo superiore a 4.5:1 per essere compliant con WCAG 2.0 AA o 7:1 se si vuole raggiungere il livello WCAG 2.0 AAA
Comportamento attuale
Vedi al link https://italia.github.io/bootstrap-italia/docs/organizzare-i-contenuti/liste/#linea-singola nella sezione
Elemento con stato disabilitato
.Secondo quello che ho potuto notare dal file
_linklist.scss
:span
,svg
elabel
associate a checkbox viene impostato il colore$neutral-1-a4
che ottiene un contrasto di 2.13:1 https://webaim.org/resources/contrastchecker/?fcolor=ADB2B8&bcolor=FFFFFFp
viene impostato il colore$neutral-1-a7
che ottiene un contrasto di 5.19:1 da questo tool https://webaim.org/resources/contrastchecker/?fcolor=5B6F82&bcolor=FFFFFFPossibili soluzioni
dipende dal livello di compliance WCAG che si vuole ottenere: la colorazione utilizzata per l'elemento
p
é sufficiente per il livello AA ma non per il livello AAA. Viene utilizzato il colore$neutral-1-a10
per i link con classeactive
che ottiene un risultato di contrasto 13.12:1.Grazie.