Il requisito numero 6 si rifà molto anche al numero 4 sull’uso del colore:
Enunciato: Garantire che siano sempre distinguibili il contenuto informativo (foreground) e lo sfondo (background), ricorrendo a un sufficiente contrasto (nel caso del testo) o a differenti livelli sonori (in caso di parlato con sottofondo musicale); evitare di presentare testi in forma di immagini; ove non sia possibile, ricorrere agli stessi criteri di distinguibilità indicati in precedenza.
La questione mi sembra molto semplice ed evidente: un testo di un colore su sfondo di colore non adeguatamente contrastante risulta non fruibile, pertanto non accessibile. E non è sufficiente valutare “a occhio” che il testo sia leggibile, poichè le varianti di problematiche visive come sapete sono diverse e svariate. L’unico modo certo che abbiamo è di valutare il colore tramite uno strumento del genere:
- Juicy Studio: Luminosity colour contrast ratio analyiser
- Colour contrast analyser (Windows)
- https://wave.webaim.org/
è un tool che fa un controllo su di un sito, ti comunica tutti i punti conformi o meno alle linee guida, e in un tab anche i colori, che puoi così revisionare.
Altri strumenti di seguito ti aiutano invece a confrontare direttamente i codici esadecimali e valutarne la conformità.
- https://products.aspose.app/html/it/contrast-checker
- https://webaim.org/resources/contrastchecker/
- https://www.colorzilla.com/
Inutile sottolineare che un’immagine usata come testo non è fruibile a meno che non sia usata con l’alternative text relativo. Ora che abbiamo tanti strumenti per usare diversi tipi di font in una pagina html non sono più necessarie le immagini (banner e grafica a parte).
1 Comment
[…] fare attenzione, ad ogni progetto, anche a questioni come ad esempio il contrasto colori, che è una delle linee guida da […]