Come ottimizzare il tuo sito web per persone ipovedenti

Circa il 3% della popolazione italiana ha una disabilità visiva. Per queste persone è difficile navigare su Internet. Un sito web accessibile aiuta anche il tuo punteggio SEO. In questo articolo ti diamo 7 consigli per migliorare l'accessibilità del tuo sito web in poco tempo.

INDICE

1. Testo
2. Immagini
3. Moduli
4. Navigazione
5. Tabelle
6. Design
7. Versione accessibile alternativa
Suggerimento: controlla il tuo sito web
Conclusione

Lingua

Puoi ottimizzare il codice HTML della tua pagina per indicare in quale lingua è scritto il testo. Questo aiuta il software di lettura a usare il linguaggio corretto.

Se si tratta di una lingua parlata in diversi Paesi, è bene indicare anche la variante. Questo è importante per l'inglese, lo spagnolo e il portoghese, per esempio, perché le regole di pronuncia variano. Nel caso dell'inglese britannico, si può indicare en-GB.

Il codice HTML per l'italiano: il resto del codice HTML.

A volte si passa a un'altra lingua nel testo, specialmente nell'e-Commerce. Puoi indicare anche questo nell'HTML tramite il codice span.
Quindi nella frase "Questo si usa soprattutto nell'e-Commerce". scrivi come segue:

Questo si usa soprattutto nell’e-Commerce.

Vuoi compiere il gran passo ed espandere il tuo business all'estero? Scopri ora i nostri consigli 👇

2. Immagini

Il testo può essere letto ad alta voce, ma il discorso si complica per quanto riguarda le immagini. Come puoi assicurarti che la tua immagine possa ancora essere vista dal software di lettura?

È possibile rendere le immagini accessibili aggiungendo un testo alternativo, cioè l’alt text. Anche i motori di ricerca lo usano, quindi questa soluzione migliorerà anche il tuo ranking SEO.

📣 Lettura consigliata: Meta tag: meta title e meta description, cosa sono e come si scrivono

Come si scrive l'alt text? Descrivi ciò che vedi

È utile anche usare una breve descrizione di ciò l'immagine mostra, che può essere letta dal software text-to-speech, che rende ancora più chiaro cosa si sta visualizzando.

Esempio:

✔️ donna ripresa di spalle si aggiusta i capelli allo specchio

❌ donna

❌ Michela

❌ donna bionda viene ripresa di spalle mentre si aggiusta i capelli allo specchio con la mano destra e indossa una maglietta a scacchi nera e bianca.

Per quanto riguarda le immagini dei tuoi prodotti è utile specificare nella descrizione del prodotto quali sono le sue dimensioni, i colori e così via. Come spiegheresti com'è il tuo articolo mentre parli al telefono? Scrivi ciò che vedi.

📷Guida gratuita👇

3. Moduli

I moduli sono molto importanti per il tuo business. Per esempio, se usi molto l'e-mail marketing, il o la cliente deve potersi iscrivere.

Proprio come per il testo, la struttura è molto importante per il tuo modulo. Le etichette (istruzioni) e i campi di input dovrebbero essere collegati tra loro, in modo che il software di lettura li capisca. Se ti aspetti che qualcuno compili qualcosa, rendilo chiaro nel campo di input.

Spiega perché c'è un errore

Se il visitatore o la visitatrice del tuo sito web compila qualcosa in modo errato, è utile non solo mettere una linea rossa intorno al campo, ma anche spiegare perché non è corretto. Questo non vale solo per i ciechi o gli ipovedenti.

Non tutti usano un mouse per navigare online. Quindi assicurati che i tuoi moduli siano navigabili tramite il tasto tab, ad esempio.

📧 Scopri 13 consigli per fare e-mail marketing con successo

4. Navigazione

Link chiari e concisi

Si clicca su un link solo quando si sa dove porta. Perciò, scrivi chiaramente nel testo dei tuoi link dove stai portando il visitatore o la visitatrice, anche se non ha letto l’articolo per intero.

Alcuni software leggono i link separatamente dal testo principale, quindi un link che come testo che riporta solo "Clicca qui" non è chiaro. Di nuovo, questo aiuta anche i motori di ricerca, quindi migliora la SEO.

Ingressi multipli

Non tutti gli e le utenti navigano allo stesso modo, quindi è consigliabile assicurarti che le tue pagine possano essere trovate in più modi. Ad alcune persone piace usare una barra di ricerca, mentre altre preferiscono usare il menù.

Sii coerente con l'aspetto della tua navigazione su ogni pagina, in modo che i tuoi visitatori sappiano esattamente dove trovare ciò che cercano.

📣 Lettura consigliata: Come svolgere un SEO audit sul tuo sito

5. Tabelle

Fornisci una didascalia o un riassunto

Le tabelle sono abbastanza difficili da leggere per il software, quindi è importante che siano costruite correttamente.

Una tabella è composta da colonne (verticali) e righe (orizzontali). I dati in una tabella sono correlati sia verticalmente che orizzontalmente. Per rendere chiare queste relazioni, si usa di nuovo il giusto codice HTML.

Indica quali celle sono le intestazioni e quali rappresentano i dati. Un codice chiaro permette al software di lettura di leggere chiaramente le informazioni.

Puoi anche fornire una didascalia e/o un riassunto per la tua tabella. Questo è utile per le persone che non hanno una visione d'insieme delle tabelle, perché così possono determinare rapidamente se la tabella vale la pena di essere letta.

🔑Lettura consigliata: Diversità, inclusione e accessibilità sul Web

6. Design

Alcune persone hanno una disabilità visiva, possono essere ipovedenti o daltoniche. Per questi gruppi, i colori non sono un buon modo di comunicare. Perciò, pensa a integrare bene anche il testo. Ciò è utile anche per le persone che usano software text-to-speech.

Usa il contrasto

Anche il contrasto è importante: assicurati che il primo piano e lo sfondo non abbiano un colore troppo simile. Altrimenti gli ipovedenti o i daltonici non saranno in grado di leggerlo correttamente. Questo è utile anche per coloro che ricevono molta luce sullo schermo (perché si siedono vicino a una finestra, per esempio) o che fanno una stampa in toni di grigio.

Per controllare i colori giusti da usare sulle tue pagine puoi usare il Contrast Checker di WebAim.

Guida gratuita 👇

7. Versione accessibile alternativa

Il tuo sito web sarà completamente diverso o meno attraente se applichi tutti questi consigli, ma vuoi comunque essere accessibile per i clienti ipovedenti? Allora potresti voler pubblicare una versione alternativa del tuo sito web.

Tienilo aggiornato!

Condividi tutte le informazioni che mostri sul tuo sito normale anche nella versione accessibile. Naturalmente, tieni aggiornata anche questa.

Per le organizzazioni (semi)governative è obbligatorio offrire un sito web accessibile, anche se sotto forma di versione alternativa.

Suggerimento: controlla il tuo sito web

La Web Accessibility Initiative ha compilato una lista di strumenti (gratuiti) per controllare il tuo sito web. Questo ti permette di capire cosa puoi migliorare.

Inoltre l’Agenzia per l’Italia Digitale (AGID) sta lavorando su un progetto internazionale, finanziato dall'Unione Europea, per testare l’accessibilità dei siti web. 

In conclusione

Per poter fornire il tuo servizio al gruppo target di persone cieche e ipovedenti, è utile lavorare sull'accessibilità del tuo sito web. È più facile di quanto possa sembrare, se si usano i consigli che ti abbiamo appena mostrato. Qualche piccolo aggiustamento può fare la differenza per un futuro cliente e per lavorare su un futuro più inclusivo.

Se quella persona sa che il tuo sito è facile da navigare, tornerà sicuramente. I grandi e-Commerce ricevono ancora lamentele a questo proposito, quindi portati avanti e sii parte del cambiamento positivo.

📦 Scopri come rendere il tuo e-Commerce non solo più inclusivo, ma anche più sostenibile 👇

 Articolo in lingua originale: Maak je website toegankelijk voor blinden en slechtzienden (7 tips!)