• Se esiste più di un menù, il titolo di ciascuno di essi non può essere vago come "Menù Principale" o "Menù di sinistra": bisogna usare termini più precisi;
• è preferibile avere un numero di livelli di menù (depth) piccolo con un numero di possibilità (breadth) grande, piuttosto che viceversa: si consiglia di usare da 4 a 8 item (voci) in ogni livello e non più di 3-4 livelli;
• nelle liste raggruppare le selezioni in modo significativo, con un senso, per categorie;
• formare gruppi di item che comprendano tutte le possibilità (es.: età 0-20, 20-40, >40) e non fare sovrapposizioni fra gruppi (es.: Divertimenti-Eventi e Concerti-Sport);
• ordinare le selezioni in base ad una logica e in modo che siano ben distinguibili una dall´altra;
• usare diciture brevi per le selezioni, iniziando con una parola chiave e significativa in quanto il nostro occhio scorre da sinistra verso destra;
• consentire salti, scorciatoie e abbreviazioni, abilitando anche ritorni al menù precedente;
• una volta scelti gli item del menù, bisogna pensare alla sequenza di presentazione. Se hanno una sequenza naturale, come ad esempio i giorni della settimana, i capitoli di un libro, ecc. la decisione è obbligata. Altre tipiche regole di sequenza degli item sono:
  
  
  • ordine cronologico;
  • ordine numerico (ascendente o discendente);
  • proprietà fisiche: lunghezza, area, volume, temperatura, peso, velocità e così via, in ordine crescente o discendente;

  quando ciò non è applicabile, si può ordinare in base a:

  • ordine alfabetico
  • qualità comuni (separati da linee di demarcazione);
  • prima gli item più frequenti o gli item più importanti (ma è difficile determinare cosa è più importante per un utente o un altro).

I titoli devono precedere i menù

I titoli (H1, ..., H6) dovrebbero essere utilizzati per strutturare i contenuti. Per facilitare la navigazione a chi usa gli screen-reader si devono far precedere i menù con delle intestazioni. Usare testi significativi: non menù di destra o di sinistra ma menù principale, approfondimenti, ecc.. Ecco un esempio:

...
<h1>Titolo del sito (facoltativo e spesso nascosto)</h1>
...
<h1>Titolo pagina (uguale o simile al TITLE)</h1>
...
<h2>Titolo di un paragrafo nel testo</h2>
...
...
<h3>Titolo di un menù</h3>
<ul>
<li>voce di menù</li>
...

Esempio di Menù utilizzando una corretta marcatura

Gli elementi sono spaziati di 1em, impaginati con gli stili, e sono utilizzati <H..> per una migliore fruizione mediante screen-reader.

Esempio di lista che utilizza una <SELECT> e <OPTGROUP>

(Tutte) CENTRO DIURNO CENTRO RESIDENZIALE BASSA SOGLIA ... CASA DI RIPOSO CASA PROTETTA CENTRO DIURNO ...

Si noti come accanto alla lista sia presente il bottone per attivare la scelta (vedi sezione script)

• Intestazioni: Struttura> Intestazioni
  oppure da Struttura> Struttura delle intestazioni
• Liste: Struttura> Elementi di lista

Menu della sezione

Per Tecnici

• Server Web
• Pagine (X)HTML
• Fogli di stile CSS
• Immagini
• Link
• Tabelle
• Form
• Multimedia
• Pagine ASP
• Script, applet e plug-in
• RSS
• Riepilogo dei requisiti e verifiche

Link esterni

• La barra dell'accessibilità per Explorer
  versione italiana 2.0
• Pattern per il web design
  Soluzioni consolidate per la realizzazione di contenuti Web, quali ad esempio i sistemi di navigazione
• Menu Design
  Attraverso l'uso di semplici liste e dei CSS2 è possibile formattare un numero indefinito di menu orizzontali e verticali.

Allegati

• Menù accessibile (zip, 494 kB)
  Esempio di codice da usare per un menù a tendina accessibile