Gli elementi HTML5, ad esempio main, nav e aside, fungono da punti di riferimento.
o regioni speciali della pagina a cui
gli screen reader e altre tecnologie per la disabilità possono saltare.
Utilizzando elementi di riferimento,
puoi migliorare notevolmente l'esperienza di navigazione sul tuo sito
per gli utenti delle tecnologie per la disabilità.
Scopri di più in Deque University
Punti di riferimento HTML 5 e ARIA.
Come controllare manualmente i punti di riferimento
Utilizza l'elenco di elementi di riferimento di W3C per verificare che ogni sezione principale della pagina sia contenuta da un elemento di riferimento. Ad esempio:
<header>
<p>Put product name and logo here</p>
</header>
<nav>
<ul>
<li>Put navigation here</li>
</ul>
</nav>
<main>
<p>Put main content here</p>
</main>
<footer>
<p>Put copyright info, supplemental links, etc. here</p>
</footer>
Puoi anche usare strumenti come Microsoft Estensione Statistiche sull'accessibilità per visualizzare la struttura della pagina e individuare le sezioni non contenute nei punti di riferimento:
Come utilizzare i punti di riferimento in modo efficace
- Utilizza gli elementi di riferimento per definire le sezioni principali della pagina
anziché fare affidamento su elementi generici come
<div>o<span>. - Utilizza i punti di riferimento per trasmettere la struttura della pagina.
Ad esempio, l'elemento
<main>deve includere tutti i contenuti direttamente correlati all'idea principale della pagina, pertanto dovrebbe esserci un solo URL per pagina. Consulta il riepilogo degli elementi di sezione dei contenuti di MDN per scoprire come utilizzare ciascun punto di riferimento. - Usa i punti di riferimento con accortezza. Avere troppi punti di riferimento può effettivamente rendono più difficile la navigazione per gli utenti delle tecnologie per la disabilità in quanto gli impedisci di passare facilmente al contenuto desiderato.
Leggi il post su Intestazioni e punti di riferimento per ulteriori informazioni.