Lien d’évitement - Skiplink

Les liens d’évitement permettent aux utilisateurs naviguant au clavier, ou équipés de lecteurs d’écran, d’accéder plus rapidement à des zones précises de la page.

Vue d’ensemble

Le rendu de base du SkiplinkComponent. Pour voir le rendu appuyez sur la touche Tab de votre clavier.

Code

- links = [dsfr_link_to("En-tête", "#header"), dsfr_link_to("Contenu", "#main-content"), dsfr_link_to("Pied de page", "#footer")]
= dsfr_skiplink(label: "Accès rapide", links: links)

Résultat

<div class="fr-skiplinks">
  <nav class="fr-container" role="navigation" aria-label="Accès rapide">
    <ul class="fr-skiplinks__list">
      <li>
        <a class="fr-link" href="#header">
          En-tête
        </a>
      </li>
      <li>
        <a class="fr-link" href="#main-content">
          Contenu
        </a>
      </li>
      <li>
        <a class="fr-link" href="#footer">
          Pied de page
        </a>
      </li>
    </ul>
  </nav>
</div>

Plus d’informations