W3docs
fr
Se connecter

La balise HTML <big>

La balise <big> agrandit le texte par rapport au texte environnant. Obsolète en HTML5 — découvrez l'alternative CSS à utiliser.

L'élément <big> affichait le texte une taille de police plus grande que le texte environnant. Il augmentait la taille de la police d'un cran par rapport à son élément parent, le navigateur décidant exactement ce que représentait « un cran ». Le texte ne pouvait jamais dépasser la taille de police maximale du navigateur.

Cette page explique ce que faisait <big>, pourquoi il a été supprimé d'HTML5, et le CSS moderne à utiliser à sa place.

Danger

N'utilisez pas <big> dans de nouveaux projets. Il s'agit d'une balise HTML dépréciée, entièrement supprimée d'HTML5 — les navigateurs peuvent encore la rendre pour assurer la compatibilité ascendante, mais c'est un balisage invalide qui peut cesser de fonctionner à tout moment. Utilisez plutôt du CSS pour contrôler la taille de la police.

Pourquoi <big> a été supprimé

<big> est un élément de présentation : il décrit l'apparence du texte, non sa signification. HTML5 repose sur une séparation claire des responsabilités — HTML pour la structure et le sens, CSS pour la présentation. Mélanger les deux rend les pages plus difficiles à maintenir (il faut modifier le balisage pour changer le style) et plus difficiles à interpréter pour les technologies d'assistance et les moteurs de recherche.

Des balises comme <big> viennent du Web des années 1990, avant que CSS soit largement pris en charge, quand dimensionner le texte en ligne était la seule option pratique. Une fois CSS arrivé à maturité, les balises de présentation sont devenues redondantes. HTML5 a supprimé toute une famille de balises, notamment <big>, <font>, <center> et <strike>. La leçon à retenir : la taille et le style appartiennent à une feuille de style, pas au nom de la balise.

Notez que <small> a été conservé en HTML5 — mais uniquement parce qu'il a reçu une vraie signification sémantique (commentaires annexes, petits caractères). Il n'existait pas d'équivalent sémantique pour justifier la conservation de <big>, il a donc été supprimé.

Syntaxe (héritée)

La balise <big> s'utilisait par paires. Le contenu se plaçait entre la balise ouvrante (<big>) et la balise fermante (</big>), à l'intérieur de la balise <body>.

Exemple de la balise dépréciée <big>

Avertissement

Cet exemple est fourni à titre de référence uniquement. <big> est invalide en HTML5 — consultez le remplacement CSS ci-dessous.

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <p>This text is normal.</p>
    <p><big>This text is bigger.</big></p>
  </body>
</html>
Essayez vous-même »

Résultat

big example

Le remplacement CSS

Le remplacement le plus fidèle est le mot-clé larger de la propriété font-size. Il fait exactement ce que faisait <big> — augmenter le texte d'un cran par rapport à son parent — mais sous forme de règle de style :

.big {
  font-size: larger;
}

Appliquez-le à un élément <span> (un élément en ligne sans signification propre), et vous obtenez le comportement de <big> sans la balise dépréciée :

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .big {
        font-size: larger;
      }
    </style>
  </head>
  <body>
    <p>This text is normal,
      <span class="big">and this text is bigger.</span>
    </p>
  </body>
</html>
Essayez vous-même »

Résultat

big1 example

Choisir une taille explicite

larger est pratique mais vague — vous ne contrôlez pas l'ampleur de l'agrandissement. Pour une typographie prévisible et évolutive, définissez la taille explicitement. Préférez les unités relatives aux pixels fixes afin que le texte respecte la taille de police préférée de l'utilisateur et le zoom :

p {
  font-size: 1rem;     /* base size — relative to the root <html> font size */
}
.big-em {
  font-size: 1.2em;    /* 1.2× the parent element's size */
}
.big-rem {
  font-size: 1.2rem;   /* 1.2× the root size, ignoring the parent */
}
.big-percent {
  font-size: 120%;     /* same idea as 1.2em, written as a percentage */
}

Pourquoi ces unités plutôt qu'une valeur brute en 19px ?

  • em s'adapte à la taille de police de l'élément parent — idéal pour augmenter le texte d'« un cran », comme le faisait <big>.
  • rem s'adapte à la taille de police de la racine (<html>) — cohérent partout, indépendant de l'imbrication.
  • % se comporte comme em (relatif au parent) et se lit naturellement pour de nombreux auteurs.
  • Une valeur fixe en px ignore les paramètres du navigateur de l'utilisateur ; les personnes qui augmentent leur taille de police par défaut pour une meilleure lisibilité ne verront pas votre texte « plus grand » s'adapter. Les unités relatives maintiennent l'accessibilité de votre design.

Attributs

<big> ne prenait en charge que les attributs globaux — il n'avait aucun attribut qui lui soit propre. En pratique, cela importe peu : comme la balise est dépréciée, le seul conseil correct est de ne pas l'utiliser du tout.

Que faire aujourd'hui

  • Ne recourez jamais à <big> (ni à <font>, <center>, <strike>) dans du nouveau HTML.
  • Pour agrandir du texte, utilisez la propriété CSS font-size — larger pour un agrandissement rapide d'un cran, ou une unité relative (em/rem/%) pour un contrôle précis et accessible.
  • Si le texte plus grand porte une signification (un titre, une emphase), utilisez un élément sémantique tel qu'un titre ou <strong> et stylisez-le avec CSS — ne grossissez pas simplement du texte ordinaire.

Exercice pratique

Pratique
Quelle est l'utilisation et l'importance de la balise HTML <big>, telles que décrites sur la page web indiquée ?
Quelle est l'utilisation et l'importance de la balise HTML <big>, telles que décrites sur la page web indiquée ?
Was this page helpful?