Accessibilità: preparare il testo e la grafica
Tempo di lettura: 3 min.
I visitatori con problemi di vista potrebbero avere difficoltà a distinguere tra il primo piano e lo sfondo delle pagine di un sito. Pertanto, ti consigliamo di controllare e regolare il contrasto del colore sul tuo sito, se necessario.
In questo articolo, scopri di più su:
I nostri consigli
Al fine di aumentare l'accessibilità per i visitatori con esigenze visive diverse, ti consigliamo quanto segue:
- Modificare il colore del testo e il contrasto del colore di sfondo a un rapporto di 4,5: 1 per il testo normale e 3: 1 per il testo di grandi dimensioni
- Un rapporto di contrasto di almeno 3: 1 per la grafica e i componenti dell'interfaccia utente (come i bordi di input del modulo, i testi segnaposto, ecc.)
- Il livello AAA richiede un rapporto di contrasto maggiore di almeno 7: 1 per il testo normale e di 4.5: 1 per il testo di grandi dimensioni
Lo sapevi che:
Il testo grande è definito come superiore a 14 punti (circa 18 px) e grassetto, o 18 punti (circa 24 px).
Trovare i codici colore
Puoi trovare i codici colore in qualsiasi site builder che stai utilizzando (Editor Studio, Editor Wix, ecc.).
Editor Studio
Editor Wix
ADI
- Seleziona l'elemento pertinente (testo, sfondo della striscia, riquadro contenitore, ecc.)
- Clicca sull'icona Apri Ispezione
in alto a destra dell'Editor - Clicca sulla scheda Design
- Clicca sulla casella del colore per aprire il selettore colori
- Passa il mouse sul colore per vedere il codice
Testare i contrasti di colore:
Esistono numerosi siti e plug-in per il browser come Contrast Checker che verifica il contrasto del colore confrontando i colori degli elementi in primo piano e di sfondo (utilizzando i codici dei colori). Per controllare il contrasto del colore per il testo su un'immagine di sfondo, ti consigliamo di utilizzare Colour Contrast Analyzer che ti permette di scegliere il colore dello sfondo e poi di provarlo.
Regolare il contrasto del colore
Puoi utilizzare il Wizard accessibilità per trovare e regolare qualsiasi contrasto di colore basso sulle pagine del tuo sito. Il Wizard è uno strumento che scansiona il tuo sito alla ricerca di potenziali problemi di accessibilità e ti consente di abilitare le impostazioni avanzate per continuare a migliorare l'accessibilità del tuo sito.
Dovresti sapere che:
Il Wizard è disponibile solo nell'Editor Wix. Vota per aggiungere il Wizard accessibilità all'Editor Studio.
Per regolare il contrasto:
- Seleziona Impostazioni
- Seleziona Wizard accessibilità
- Seleziona Scansiona il sito
- Seleziona le schede intitolate Contrasto colore
- Utilizza il cursore per regolare il colore del testo e dello sfondo
- Seleziona Applica modifiche
Stai visualizzando grafici o dati sul tuo sito?
Il colore ad alto contrasto è un ottimo modo per visualizzare i dati sul tuo sito. Tuttavia, ti consigliamo di utilizzare anche altri indicatori (come aspetto e pattern) per differenziare le informazioni.
Prossimo passo:
Torna alla Checklist per l'accessibilità per continuare a migliorare l'accessibilità del tuo sito.
Hai trovato utile questo articolo?
|