Programmazione Web » Html » Realizzare menu accessibili con le accesskey
Realizzare menu accessibili con le accesskey
Difficoltà:
Scritto da Michele Sassi
Sito Web: http://www.comefaccio.net 
Questo tutorial è stato letto 1100 volte
In fase di progettazione di un sito web si dovrebbe tener conto anche dell'accessibilità. Oggi impareremo a creare un menu capace di aprire pagine web come con le cosidette scorciatoie da tastiera di Windows. In questo modo elimineremo anche il problema ai portatori di handicap impossibilitati nell'uso del mouse che, altrimenti, resterebbero fuori dalla visione del nostro sito!
Come ben sapete, Windows ci permette di aprire il menu File premendo sulla tastiera Alt+f. In un sito web è possibile realizzare la stessa ed identica cosa grazie all'attributo accesskey del tag <a>.
Vediamo come realizzare link con le accesskey (o chiavi di accesso):
<a href="contatti.htm" accesskey="c">Contattami</a>
Con un link così strutturato sarà possibile aprire la pagina 'contatti.htm' premendo sulla tastiera Alt+c e successivamente Invio. Premendo infatti solo Alt+c si otterrà il focus sul link, ma non l'apertura della pagina correlata.
Creiamo quindi un menu accessibile:
| <a accesskey="h" href="index.htm"><u>H</u>omepage</a> | <a accesskey="c" href="contattami.htm"><u>C</u>ontattami</a> | <a accesskey="f" href="forum.htm"><u>F</u>orum</a> |
Un consiglio utile: per far capire all'utente che il menu usa le accesskey è buona norma sottolineare nella voce del menu la lettera che corrisponde alla chiave d'accesso.
Nel nostro esempio le tre voci del menu saranno così visibili:
| Homepage | Contattami | Forum |
Aggiungi questo tutorial ai preferiti
