Skip Link

Le lien d’évitement permet à un utilisateur au clavier de sauter directement au contenu principal sans devoir tabuler à travers tout le header et la navigation à chaque page.

Do / Don’t

✓ Faire

Un seul lien d’évitement par page, vers le contenu principal
Tester au clavier (Tab dès le chargement de la page) que le lien apparaît

✗ Éviter

Le masquer avec display: none ou visibility: hidden
Le placer après le header dans l’ordre du DOM

Invisible par défaut (translaté hors écran), révélé en haut à gauche au :focus avec fond bleu institutionnel et texte blanc — contraste maximal pour une visibilité immédiate.

Importation

@import "@tds-tchad/core/components/skip-link/skip-link.css";

import { skipLink } from '@tds-tchad/core/components/skip-link';

Exemple

<body>
  <a href="#main-content" class="tds-skip-link">Aller au contenu principal</a>
  <header class="tds-header">…</header>
  <nav class="tds-nav">…</nav>
  <main id="main-content">…</main>
</body>