La balise HTML <strong>
La balise HTML <strong> marque un texte comme important, sérieux ou urgent. Signification, accessibilité, exemples et <b> vs <em>.
La balise HTML <strong> marque un texte comme ayant une importance forte, un caractère sérieux ou un caractère urgent. C'est là son rôle principal : elle véhicule un sens, pas simplement une apparence. Les navigateurs affichent le contenu de <strong> en gras par défaut, mais ce gras n'est qu'un effet secondaire — la vraie valeur réside dans le fait que vous indiquez aux navigateurs, aux moteurs de recherche et aux technologies d'assistance que ce texte est plus important que le contenu environnant.
Cette page explique ce que signifie <strong>, en quoi il diffère du style gras et des balises similaires <b> et <em>, comment les lecteurs d'écran et le référencement le traitent, et comment l'utiliser correctement avec des exemples fonctionnels.
Pourquoi utiliser <strong> plutôt qu'un style gras ?
Il est utile de distinguer deux notions différentes :
- Poids visuel — un texte qui paraît simplement en gras. On l'obtient grâce à la propriété CSS
font-weight: boldou à la balise<b>. Cela modifie uniquement l'apparence et ne transmet aucun sens. - Importance — un texte qui est plus important que ce qui l'entoure. C'est ce que représente
<strong>. Le rendu en gras est la présentation par défaut de cette importance, mais vous pourriez le re-styler avec CSS et le sens resterait intact.
Utilisez <strong> quand l'emphase fait partie du sens du contenu — un avertissement, une date limite, une instruction critique. Utilisez le style gras (CSS ou <b>) quand vous souhaitez uniquement faire ressortir des mots visuellement, comme un nom de produit ou un mot-clé mis en évidence pour faciliter la lecture.
Alors que HTML4 définissait <strong> comme impliquant une emphase plus forte, HTML5 l'a redéfini comme représentant l'importance forte du contenu. Vous pouvez également imbriquer <strong> dans <strong> pour augmenter l'importance relative d'une expression.
Si vous souhaitez du texte en gras uniquement à des fins décoratives — sans importance supplémentaire — utilisez la balise <b> ou la propriété CSS font-weight plutôt que <strong>.
<strong> vs <b> vs <em>
Ces trois balises modifient toutes l'apparence du texte, mais elles ont des significations différentes. Choisir la bonne est ce qui rend votre balisage sémantique.
| Balise | Apparence par défaut | Signification | À utiliser pour |
|---|---|---|---|
<strong> | Gras | Importance forte, sérieux, urgence | Avertissements, dates limites, instructions critiques |
<b> | Gras | Aucune importance ajoutée — décalage stylistique | Mots-clés, noms de produits, phrase d'introduction |
<em> | Italique | Emphase de stress qui change le sens oral | Mots que vous prononceriez avec une insistance vocale |
Un moyen facile de s'en souvenir : <strong> signifie « c'est important », <em> signifie « dis ceci différemment » et <b> signifie « mets-le simplement en gras ». Pour du texte mis en surbrillance (plutôt qu'important), voir la balise <mark>.
Accessibilité et référencement
Les véritables avantages de <strong> sont la sémantique et le référencement :
- Les moteurs de recherche peuvent utiliser le balisage comme signal indiquant que le texte encadré est plus significatif que le reste du contenu, ce qui aide à décrire le sujet de la page.
- Les technologies d'assistance reçoivent l'importance comme faisant partie de la structure du document. La plupart des lecteurs d'écran populaires ne modifient pas automatiquement leur voix pour
<strong>par défaut, mais l'importance est néanmoins exposée et les utilisateurs peuvent configurer leur logiciel pour l'annoncer.
En résumé, n'utilisez pas <strong> pour obtenir une emphase vocale — utilisez-le parce que le texte est genuinement plus important. C'est le sens que les outils exploitent ; le rendu en gras n'est que la présentation par défaut.
Syntaxe
La balise <strong> fonctionne par paires. Le contenu est écrit entre la balise ouvrante (<strong>) et la balise fermante (</strong>). Oublier la balise fermante </strong> est une erreur courante — sans elle, le reste de votre texte peut être marqué comme important lui aussi.
Exemple de la balise HTML <strong>
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<p>We’ve used the <strong>strong</strong> tag to highlight this important part of the text.</p>
</body>
</html>Résultat
Exemple : urgence et avertissements
Une utilisation naturelle de <strong> consiste à signaler quelque chose que le lecteur ne doit pas manquer :
<!DOCTYPE html>
<html>
<body>
<p><strong>Warning:</strong> this action permanently deletes your account.</p>
<p>Submit the form before <strong>5:00 PM on Friday</strong> — late entries are not accepted.</p>
</body>
</html>Attributs
La balise <strong> prend en charge les attributs globaux et les attributs d'événement. Par exemple, vous pouvez lui appliquer une classe pour la styler différemment :
<strong class="warning">Important notice</strong>