La balise <span>

La balise <span> est utilisée pour regrouper une petite portion de contenu à l'intérieur d'un texte.

• Lorsque le navigateur rencontre une balise <span> il crée un conteneur générique permettant d'appliquer des styles ou des comportements particuliers à une partie du contenu.

• Contrairement aux balises structurantes, la balise <span> n'a aucune signification sémantique.

• Elle est souvent utilisée avec les attributs class et id afin de cibler un mot, une expression ou un groupe d'éléments de texte.

• La balise <span> est une balise de type inline par défaut.

• Parce qu'il s'agit d'un élément conteneur, une balise de fermeture </span> est nécessaire pour indiquer où le regroupement se termine.

Bonnes pratiques

Il est recommandé :

• d'utiliser <span> pour modifier ou identifier une portion précise d'un texte;
• d'utiliser le CSS pour modifier l'apparence du contenu ciblé;
• d'utiliser des classes significatives lorsque plusieurs éléments partagent le même style;
• d'utiliser des balises sémantiques lorsque celles-ci sont plus appropriées;
• de conserver un code simple et facile à lire.

SEO

La balise <span> n'a pas d'impact direct sur le référencement.

Comme elle sert uniquement de conteneur générique en ligne, les moteurs de recherche lui accordent peu d'importance pour comprendre la structure d'une page Web.

Exemples

Utilisation avec une classe CSS

<p>
    Prix : <span class="prix">19,99 $</span>
</p>

<p>Ce produit est <span class="important">nouveau</span>.</p>