Bisogna sempre rendere il più accessibile possibile il proprio sito web. In questa lezione potrai capire cosa vuol dire “rendere accessibile” un sito web e come farlo.
Un sito “accessibile”
Una pagina accessibile è una pagina che può essere usata da qualsiasi persona, indipendentemente da difficoltà o impossibilità fisiche, come per i non vedenti o ipovedenti. In modo pratico, bisogna scrivere il codice HTML in modo tale che i sistemi di lettura degli schermi possano interpretare correttamente tutti gli elementi contenuti nelle pagine web. Per farlo, ci sono alcuni trucchi da usare.
Perché è importante
Rendere un sito “accessibile” è importante perché migliora il punteggio SEO, utilizzato dai motori di ricerca per posizionare i siti web nei risultati. Ad esempio, se un motore di ricerca deve scegliere tra due siti web simili, inserirà prima quello con il punteggio SEO più alto. L’accessibilità di un sito web è molto importante e per questo motivo ne modifica il punteggio.
Come rendere “accessibile” una pagina web
Possiamo aggiungere ad ogni elemento degli attributi particolari che spieghino che cosa sono quegli elementi, anche nei casi in cui ci sembrerebbe superfluo.
Impostare la lingua della pagina
Inseriamo sempre al tag <html> anche l’attributo lang, che abbiamo visto nelle prime lezioni HTML, così che il lettore schermo possa leggere nella lingua corretta oppure tradurre la pagina.
<html lang="it">
<!-- Lingua italiana -->
</html>
I link e i pulsanti
Scrivere il contenuto di un link o di un pulsante sembra banale, ma deve essere scritto in modo tale che il lettore schermo possa far capire dove porta un link. Un errore, infatti, è quello di scrivere in un pulsante ‘Clicca qui’ o scritture simili, invece di inserire la frase completa. L’esempio qui sotto è un tipo di errore da non fare.
<a href="esempio.html">Clicca qui</a> per cambiare pagina.
Mentre questo sotto è un esempio di link corretto.
<a href="esempio.html">Clicca qui per cambiare pagina</a>.
Funziona allo stesso modo anche per i pulsanti.
Le immagini “accessibili”
Le immagini non possono essere lette da un lettore schermo, perché sono appunto immagini. Per questo si utilizza un attributo, alt, che abbiamo visto nella lezione delle immagini. Questo serve per inserire un testo alternativo all’immagine, che la descriva. Per ogni immagine che inserisci in una pagina HTML, ricordati sempre di inserirlo.
<img src="fiori.jpg" alt="Campo di fiori rossi">
Per immagini o icone che hanno solo lo scopo decorativo, puoi inserire alt vuoto.
| Area Personale |