Est-il parfois mauvais d'utiliser <BR /> ?

Question

Est-il parfois mauvais d'utiliser <BR/> tags ?

Je pose la question parce que l'un des premiers conseils que m'a donnés mon équipe de développement était le suivant : N'utilisez pas <BR/> ; à la place, utilisez des styles. Mais pourquoi ? L'utilisation des styles a-t-elle des conséquences négatives ? <BR/> tags ?

Answer 1

La principale raison de ne pas utiliser <br> c'est que ce n'est pas sémantique . Si vous voulez deux éléments dans des blocs visuels différents, vous les voulez probablement dans des blocs logiques différents.

Dans la plupart des cas, cela signifie simplement utiliser des éléments différents, par exemple <p>Stuff</p><p>Other stuff</p> puis en utilisant le CSS pour espacer correctement les blocs.

Il y a des cas où <br> est sémantiquement valide, c'est-à-dire les cas où le saut de ligne est partie des données que vous envoyez. Ceci est vraiment limité à 2 cas d'utilisation - la poésie et les adresses postales.

Answer 2

Je pense que votre équipe de développement fait référence à <br /> à la place de l'espacement des marges. Pour créer un espace vide entre les éléments, utilisez le style padding / margin via CSS.

Mauvaise utilisation de <br /> :

<div>
   Content
</div>
<br />
<br />
<br />
<br />
<div>
     More content...
</div>

Bonne utilisation de <br /> :

<style>
     div {
          margin-top:10px;
     }
</style>

<div>
   Content<br />
   Line break
</div>

<div>
     More content...
</div>

Answer 3

En général, <br/> est une indication d'un mauvais HTML sémantique. Le cas le plus courant est l'utilisation de <br/> pour déclarer les séparations de paragraphes, alors qu'il existe de bien meilleures façons de le faire sémantiquement. Voir Bed and BReakfast .

Il y a des occasions où c'est la balise appropriée à utiliser, mais on en abuse assez souvent pour que les gens adoptent une mentalité de "ne pas utiliser" afin de forcer une meilleure réflexion sémantique.

Answer 4

Ce que votre équipe voulait dire, c'était probablement de ne pas utiliser <br> pour séparer les paragraphes. Par exemple :

<p>I am a paragraph</p>
<p>I am a second paragraph</p>

est le meilleur moyen de le faire, car vous pouvez alors facilement ajuster les espaces entre les paragraphes par le biais de CSS. En dehors de cela, je ne vois rien qui s'oppose aux sauts de ligne en tant que tels.

Answer 5

Le même concept s'applique à la raison pour laquelle nous n'utilisons pas de tableaux pour la mise en page - utilisez des tableaux pour les tableaux et des CSS pour la mise en page.

Utilisez <br/> pour rompre les lignes d'un bloc de texte et CSS si vous souhaitez modifier la mise en page.