Vai al contenuto principale
Test di accessibilità · Colore

Accessibilità digitale Controllo del colore

Il testo a basso contrasto è il problema di accessibilità rilevato più comunemente sul web. Scopra esattamente cosa richiede WCAG 2.2 per colore e contrasto - e verifichi ogni pagina, dominio e PDF con gli strumenti di test di EqualWeb.

Uno strumento di controllo dei colori per l'accessibilità digitale verifica che i colori del testo e dell'interfaccia soddisfino i requisiti di contrasto WCAG - almeno 4,5:1 per il testo normale secondo WCAG 2.2 SC 1.4.3. Il testo a basso contrasto è il problema di accessibilità rilevato più spesso sul web ed è presente nell'83,9% delle prime 1.000.000 di home page nel rapporto WebAIM Million 2026. EqualWeb integra il controllo del contrasto dei colori in tutti i suoi strumenti di test - Accessibility Checker gratuito, Accessibility Crawler, Accessibility Monitor e PDF Checker - affinché gli errori di contrasto siano rilevati automaticamente in ogni scansione WCAG 2.2.

Requisiti WCAG per i colori

Che cosa richiedono le WCAG per colore e contrasto?

WCAG 2.2 stabilisce soglie esatte e misurabili per il contrasto cromatico. Il criterio 1.4.3 Contrasto (minimo), livello AA, richiede un rapporto di contrasto di almeno 4,5:1 tra il testo normale e lo sfondo e di almeno 3:1 per il testo grande. Per testo grande si intende un testo normale di almeno 18 punti (circa 24 px) o in grassetto di 14 punti (circa 18,5 px). Gli stessi rapporti si applicano alle immagini di testo, con eccezioni per i logotipi e il testo puramente decorativo.

Al più rigoroso livello AAA, il criterio di successo 1.4.6 Contrasto (avanzato) innalza la soglia a 7:1 per il testo normale e a 4,5:1 per il testo grande. Il contrasto non riguarda solo il testo: il criterio di successo 1.4.11 Contrasto non testuale, livello AA, richiede un rapporto di almeno 3:1 tra i componenti dell'interfaccia utente - pulsanti, bordi dei campi dei moduli, indicatori di stato attivo - e i colori adiacenti, nonché lo stesso rapporto di 3:1 per le parti degli elementi grafici necessarie a comprendere il contenuto.

L'accessibilità dei colori va anche oltre il calcolo del contrasto. Il criterio di successo 1.4.1 Uso del colore, livello A, stabilisce che il colore non può essere l'unico mezzo visivo per comunicare informazioni. Un link distinto dal testo circostante solo tramite il colore, o un errore del modulo indicato solo in rosso, non soddisfa questo criterio anche quando ciascun rapporto di contrasto è conforme.

  • SC 1.4.3 Contrasto (minimo), livello AA: almeno 4.5:1 per il testo normale, 3:1 per il testo grande
  • Testo grande: almeno 18pt (circa 24px), oppure 14pt (circa 18,5px) se in grassetto
  • SC 1.4.6 Contrasto (avanzato), livello AAA: almeno 7:1 per il testo normale e 4,5:1 per il testo grande
  • SC 1.4.11 Contrasto non testuale, livello AA: almeno 3:1 per i componenti dell'interfaccia utente e la grafica significativa
  • SC 1.4.1 Uso del colore, Livello A: il colore non è mai l'unico indicatore del significato
Verifichi i Suoi colori

Come può controllare i colori del Suo sito web con EqualWeb?

Non serve uno strumento separato per la selezione dei colori per eseguire l'audit di un sito web attivo. La verifica del contrasto cromatico è integrata in ogni strumento di test EqualWeb come parte di una scansione WCAG 2.2 completa, quindi il contrasto viene verificato insieme a tutti gli altri requisiti WCAG - nelle pagine e nei documenti che pubblica effettivamente.

Inizi con il controllo gratuito dell'accessibilità: inserisca un URL e ottenga in pochi secondi un punteggio di accessibilità da 0 a 100, con ogni elemento a basso contrasto segnalato, associato all'esatto criterio di successo WCAG, come 1.4.3, e ordinato per gravità. Da lì, la suite di test si adatta a ciò che deve coprire - un intero dominio, un sito che cambia ogni giorno o una raccolta di documenti - e tutti i risultati confluiscono in un'unica dashboard EqualWeb.

  • Accessibility Checker - scansione istantanea gratuita di qualsiasi singolo URL; segnala il testo al di sotto del rapporto di contrasto richiesto, indicando il criterio WCAG 2.2 e la gravità di ciascun problema
  • Accessibility Crawler - un'estensione Chrome basata sul cloud che esegue la scansione dell'intero dominio in tempo reale, incluse pagine protette da password, moduli e contenuti multimediali
  • Monitor per l'accessibilità - scansione continua programmata con un punteggio di conformità in tempo reale da 0 a 100, per rilevare i nuovi problemi di contrasto introdotti da modifiche al design o ai contenuti; scansione gratuita iniziale di 100 pagine
  • Strumento di controllo dei PDF - esegue l'audit dei documenti PDF in 7 categorie di accessibilità; gli elementi relativi al contrasto che l'IA non può verificare completamente sono contrassegnati come Da verificare, affinché una persona possa confermarli
Correggi e adatta

Come si correggono i problemi di contrasto cromatico dopo averli individuati?

I problemi segnalati in un rapporto EqualWeb includono indicazioni chiare su cosa correggere e il criterio di successo WCAG 2.2 esatto, così designer e sviluppatori sanno con precisione quali coppie di colori modificare e in quale misura.

Per la correzione delle barriere, l'IA del widget di accessibilità corregge automaticamente in tempo reale, tramite il browser e senza modificare il codice sorgente, oltre 80 problemi comuni delle WCAG 2.2. L'automazione ha però dei limiti: le decisioni sulla palette del marchio richiedono spesso il giudizio umano e alcuni criteri non possono essere verificati automaticamente. Quando l'obiettivo è la conformità ai requisiti WCAG, ADA ed EAA, il servizio Managed Compliance di EqualWeb aggiunge esperti certificati IAAP/CPWA che eseguono audit, correggono le barriere, monitorano e documentano l'accessibilità dall'inizio alla fine con un rapporto di conformità.

Il widget supporta direttamente anche i visitatori. Il suo menu di accessibilità include 9 profili e 13+ strumenti assistivi, con due profili creati specificamente per colore e contrasto: il profilo per ipovedenti aumenta il contrasto, ingrandisce il testo e aggiunge una lente di ingrandimento, mentre il profilo per daltonici regola le palette affinché il significato non dipenda mai solo dal colore. Queste regolazioni lato utente integrano - non sostituiscono - il rispetto dei rapporti di contrasto WCAG nel Suo design.

Problemi più comuni

Quali sono gli errori più comuni nell'accessibilità dei colori?

Il testo a basso contrasto è il problema di accessibilità più comune sul web. Il rapporto WebAIM Million 2026, che analizza le prime 1.000.000 di home page, ha rilevato testo al di sotto delle soglie di contrasto WCAG 2 AA nell'83,9% delle home page - rispetto al 79,1% del 2025 e risultando il problema rilevato più spesso in assoluto - con una media di 34 casi distinti di basso contrasto per pagina.

La maggior parte di questi problemi deriva da pochi schemi ricorrenti: testo principale grigio chiaro e testo segnaposto su sfondi bianchi, testo sovrapposto a foto o sfumature, link distinti dal testo circostante solo tramite il colore e stati di errore che si affidano esclusivamente al rosso. Poiché questi problemi vengono in genere introdotti con una modifica al design o ai contenuti alla volta, la scansione continua con Accessibility Monitor li rileva molto prima di un audit isolato.

  • Testo grigio chiaro e testo segnaposto dei moduli sotto il minimo di 4,5:1
  • Testo su immagini o sfumature senza un livello di contrasto sufficiente
  • Link identificati solo dal colore, senza sottolineatura o altro indicatore (criterio di successo 1.4.1)
  • Errori nei moduli segnalati solo rendendo rosso un campo
  • Pulsanti, icone e indicatori di stato attivo sotto il rapporto minimo non testuale di 3:1 (SC 1.4.11)
Domande frequenti

Accessibilità dei colori - domande frequenti

Come posso verificare se i colori del mio sito web sono accessibili?
Esegua un controllo immediato gratuito con Accessibility Checker di EqualWeb: inserisca l'URL e lo strumento analizza la pagina rispetto a WCAG 2.2, segnalando ogni elemento al di sotto del rapporto di contrasto richiesto, associato al criterio di successo esatto, come 1.4.3, insieme a un punteggio da 0 a 100. Per una copertura più ampia, Accessibility Crawler analizza interi domini e Accessibility Monitor ripete continuamente l'analisi quando il sito cambia.
Quale rapporto di contrasto richiedono le WCAG?
Il livello AA delle WCAG 2.2 richiede un rapporto di almeno 4,5:1 tra il testo normale e il suo sfondo e di almeno 3:1 per il testo grande, definito come 18 pt o 14 pt in grassetto (SC 1.4.3). Gli elementi non testuali, come pulsanti, bordi dei moduli e icone significative, richiedono almeno 3:1 ai sensi del criterio SC 1.4.11. Al più rigoroso livello AAA, il criterio SC 1.4.6 innalza i requisiti del testo a 7:1 per il testo normale e a 4,5:1 per il testo grande.
EqualWeb dispone di uno strumento per verificare il contrasto dei colori?
Sì - il controllo del contrasto è integrato in ciascuno strumento di test EqualWeb, anziché essere offerto come selettore separato. L'Accessibility Checker gratuito segnala in pochi secondi il testo con contrasto insufficiente su qualsiasi URL, Accessibility Crawler controlla il contrasto nell'intero dominio, comprese le pagine protette, Accessibility Monitor lo ricontrolla continuamente e PDF Checker verifica i documenti. Ciascun problema rilevato è associato al criterio WCAG 2.2 esatto, con indicazioni per correggerlo.
Qual è l'errore più comune nell'accessibilità dei colori?
Testo con contrasto insufficiente. Il rapporto WebAIM Million 2026 ha rilevato testo sotto le soglie di contrasto WCAG 2 AA nell'83,9% delle 1.000.000 di home page principali, rendendolo il problema di accessibilità rilevato più spesso, con una media di 34 casi distinti per pagina. Le cause tipiche sono testo grigio chiaro, testo segnaposto e testo sovrapposto alle immagini. Una scansione automatizzata, come l'Accessibility Checker gratuito di EqualWeb, li rileva in pochi secondi.
Il widget EqualWeb può correggere i problemi di contrasto dei colori?
In parte. La correzione delle barriere tramite IA del widget di accessibilità corregge automaticamente nel browser 80+ problemi comuni relativi alle WCAG 2.2 e il suo menu offre ai visitatori opzioni per i colori: il profilo per ipovedenti aumenta il contrasto e ingrandisce il testo, mentre il profilo per daltonici regola le palette affinché il significato non dipenda mai solo dal colore. Le decisioni sui colori a livello di marchio e i problemi che l'automazione non può verificare richiedono comunque l'intervento umano, fornito da esperti certificati IAAP/CPWA tramite il servizio Managed Compliance di EqualWeb.
Le WCAG consentono di usare solo il colore per indicare link o errori?
No. Il criterio di successo 1.4.1 Uso del colore, livello A, richiede che il colore non sia mai l'unico mezzo visivo per comunicare informazioni. Un link distinto dal testo normale solo tramite il colore, o un errore di modulo indicato solo rendendo rosso un campo, non soddisfa il criterio anche quando i rapporti di contrasto sono adeguati. Aggiunga un secondo indicatore, come una sottolineatura, un'icona o un'etichetta di testo. Gli strumenti di test di EqualWeb segnalano i problemi relativi al colore in ogni scansione WCAG 2.2.
Verifichi i Suoi colori

Visualizzi i problemi di contrasto nell'intero sito

Esegua un controllo istantaneo gratuito di qualsiasi pagina - incluso il contrasto dei colori - oppure scansioni l'intero dominio con Crawler e Monitor.

Ultimo aggiornamento

Parla con uno specialistaPrenota una riunione