Landmark Roles

HTML / CSS 🟢 Junior

Definition

Régions de page identifiées par des balises sémantiques (<header>, <nav>, <main>, <footer>) ou des rôles ARIA. Les lecteurs d'écran permettent de naviguer directement entre ces repères.

Analogie

Comme les chapitres d'un livre : on peut sauter directement au chapitre voulu via la table des matières.

Exemple de code

<header><!-- banner --></header>
<nav><!-- navigation --></nav>
<main><!-- main --></main>
<aside><!-- complementary --></aside>
<footer><!-- contentinfo --></footer>

Cas d'usage

Structurer chaque page pour que les utilisateurs de technologies d'assistance puissent s'orienter rapidement.

Anti-pattern

Avoir plusieurs <main> ou aucun landmark, rendant la navigation par région impossible.
#core#accessibility