Élément <search>

Définition

Élément sémantique qui regroupe les contrôles de recherche ou de filtrage et porte implicitement le rôle ARIA search (landmark). Il remplace <form role="search">. Baseline « Widely available », disponible partout depuis octobre 2023.

Analogie

L'enseigne « Accueil / Renseignements » au-dessus du comptoir : on sait à quoi il sert avant d'y aller.

Exemple de code

<header>
  <h1>Site de films</h1>
  <search>
    <form action="/recherche">
      <label for="q">Trouver un film</label>
      <input type="search" id="q" name="q">
      <button type="submit">Rechercher</button>
    </form>
  </search>
</header>

Cas d'usage

Barre de recherche du site ou filtres d'une liste : un point de repère de plus pour les lecteurs d'écran.

Anti-pattern

Termes liés

Sources

• developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/search