UPDATE: Update translation of the HTML elements — 🛠 Priority work area (#500)

* UPDATE: Updating pages starting with A

* FIX: Update missing KS to html anchor

* Review HTML Element a

* Review HTML Element abbr

* Review HTML Element acronym

* Review HTML Element address

* Review HTML Element applet

* Review HTML Element area

* Review HTML Element article

* Review HTML Element aside

* Review HTML Element audio

* UPDATE: Updating pages wtarting with B

* Review HTML Element b

* Review HTML Element base

* Review HTML Element basefont

* Review HTML Element bdi

* Review HTML Element bdo

* Review HTML Element big

* Review HTML Element blink

* Review HTML Element blockquote

* Review HTML Element body

* Review HTML Element br

* Review HTML Element button

* Review HTML Element button - rm HTMLRef

* Review HTML Element button - lint link

* UPDATE: Updating pages starting with C

* UPDATE: Updating pages starting with D

* UPDATE: Refresh the reference page

* UPDATE: Updating pages starting with E

* Review HTML Element canvas

* Review HTML Element caption

* Review HTML Element center

* Review HTML Element cite

* UPDATE: Updating pages starting with F

* BCD: Update all updated pages with new BCD format

* FIX: add missing bracket

* Review - HTML element - code

* Review - HTML Element - col

* Review - HTML Element - colgroup

* Review - HTML Element - content

* Review - HTML Element - data

* Review - HTML Element - datalist

* Review - HTML Element - dd

* Review - HTML Element - del

* Review - HTML Element

* Review - HTML Element - dfn

* Review - HTML Element - dialog

* Review - HTML element - dir

* Review - HTML Element div

* Review - HTML Element - dl

* Review - HTML Element - dt

* Review - HTML Element - em

* Review - HTML Element - embed

* Review - HTML Element - fieldset

* Review - HTML Element - figcaption

* Review - HTML Element - figure

* Review - HTML Element - font

* Review - HTML Element - footer

* Review - HTML Element - form

* Review - HTML Element - frame

* Review - HTML Element - frameset

* Review updates since PR start - A

* Review updates since PR start - B

* Review updates since PR start - C

* Review updates since PR start - D

* Review updates since PR start - F

Co-authored-by: julieng <julien.gattelier@gmail.com>

1 files changed, 66 insertions, 87 deletions

diff --git a/files/fr/web/html/element/br/index.html b/files/fr/web/html/element/br/index.html
index b49d301453..9ee2f16922 100644
--- a/files/fr/web/html/element/br/index.html
+++ b/files/fr/web/html/element/br/index.html
@@ -4,132 +4,111 @@ slug: Web/HTML/Element/br
 tags:
   - Element
   - HTML
+  - HTML text-level semantics
   - Reference
   - Web
 translation_of: Web/HTML/Element/br
+browser-compat: html.elements.br
 ---
 <div>{{HTMLRef}}</div>
 
-<p>L'élément HTML <code><strong>&lt;br&gt;</strong></code> crée un saut de ligne (un retour chariot) dans le texte. Il s'avère utile lorsque les sauts de ligne ont une importance (par exemple lorsqu'on écrit une adresse ou un poème).</p>
+<p class="summary">L'élément HTML <code><strong>&lt;br&gt;</strong></code> crée un saut de ligne (un retour chariot) dans le texte. Il s'avère utile lorsque les sauts de ligne ont une importance (par exemple lorsqu'on écrit une adresse ou un poème).</p>
 
 <div>{{EmbedInteractiveExample("pages/tabbed/br.html", "tabbed-standard")}}</div>
 
-<p class="hidden">Le code source de cet exemple interactif est disponible dans un dépôt GitHub. Si vous souhaitez contribuez à ces exemples, n'hésitez pas à cloner <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> et à envoyer une <em>pull request</em> !</p>
+<p>Comme vous pouvez le voir dans l'exemple ci-dessus, un élément <code>&lt;br&gt;</code> est inclus à chaque point où nous voulons que le texte soit interrompu. Le texte après le <code>&lt;br&gt;</code> recommence au début de la ligne suivante du bloc de texte.</p>
 
-<div class="note">
-<p><strong>Note :</strong> Attention, <code>&lt;br&gt;</code> ne doit pas être utilisé de façon abusive afin d'augmenter l'espace entre les lignes d'un texte. Pour cela, on utilisera la propriété <a href="/fr/docs/Web/CSS">CSS</a> {{cssxref('margin')}} sur l'élément {{HTMLElement("p")}}.</p>
+<div class="notecard note">
+  <p><b>Note :</b></p>
+  <p>Attention, <code>&lt;br&gt;</code> ne doit pas être utilisé de façon abusive afin d'augmenter l'espace entre les lignes d'un texte. Pour cela, on utilisera la propriété <a href="/fr/docs/Web/CSS">CSS</a> <a href="/fr/docs/Web/CSS/margin"><code>margin</code></a> sur l'élément HTML <a href="/fr/docs/Web/HTML/Element/p"><code>&lt;p&gt;</code></a>.</p>
 </div>
 
-<h2 id="Attributs">Attributs</h2>
+<h2 id="attributes">Attributs</h2>
 
-<p>Comme pour tous les éléments, on peut utiliser <a href="/fr/docs/Web/HTML/Attributs_universels">les attributs universels</a>.</p>
+<p>Comme pour tous les éléments, on peut utiliser <a href="/fr/docs/Web/HTML/Global_attributes">les attributs universels</a>.</p>
 
-<h3 id="Attributs_obsolètes">Attributs obsolètes</h3>
+<h3 id="deprecated_attributes">Attributs obsolètes</h3>
 
 <dl>
- <dt>{{htmlattrdef("clear")}} {{deprecatedGeneric('inline','HTML4.01')}} {{obsoleteGeneric('inline','HTML5')}}</dt>
- <dd>Cet attribut indique où commencer la prochaine ligne après le saut de ligne.
- <div class="note">
- <p><strong>Note : </strong>Cet attribut est obsolète avec {{HTMLVersionInline(5)}} et ne doit pas être utilisé ! Il faut privilégier la propriété {{CSSxref('clear')}} à la place.</p>
- </div>
- </dd>
+  <dt><strong id="attr-clear"><code>clear</code></strong> {{deprecated_inline}}</dt>
+  <dd>Cet attribut indique où commencer la prochaine ligne après le saut de ligne.</dd>
 </dl>
 
-<h2 id="Mise_en_forme_avec_CSS">Mise en forme avec CSS</h2>
+<h2 id="styling_with_css">Mise en forme avec CSS</h2>
 
 <p><code>&lt;br&gt;</code> n'a aucun rôle purement stylistique et il sert uniquement à créer une rupture de ligne au sein d'un bloc de texte. Cet élément pourra très peu être mis en forme avec CSS.</p>
 
-<p>Bien qu'il soit possible d'appliquer une marge ({{cssxref("margin")}} sur les éléments <code>&lt;br&gt;</code> afin d'augmenter l'espacement entre les lignes de texte d'un même bloc, ce n'est pas une bonne pratique. Pour obtenir le même effet, on pourra utiliser la propriété {{cssxref("line-height")}}.</p>
+<p>Bien qu'il soit possible d'appliquer une marge (<a href="/fr/docs/Web/CSS/margin"><code>margin</code></a> sur les éléments <code>&lt;br&gt;</code> afin d'augmenter l'espacement entre les lignes de texte d'un même bloc, ce n'est pas une bonne pratique. Pour obtenir le même effet, on pourra utiliser la propriété <a href="/fr/docs/Web/CSS/line-height"><code>line-height</code></a>.</p>
 
-<h2 id="Exemples">Exemples</h2>
+<h2 id="examples">Exemples</h2>
 
-<h3 id="HTML">HTML</h3>
+<h3 id="simple_br">Simple rupture de ligne</h3>
 
-<pre class="brush:html">Maître corbeau, sur un arbre perché,&lt;br&gt;
-Tenait en son bec un fromage.&lt;br&gt;
-Maître renard par l'odeur alléché,&lt;br&gt;
-Lui tint à peu près ce langage...&lt;br&gt;
-</pre>
+<p>Dans l'exemple suivant, nous utilisons des éléments <code>&lt;br&gt;</code> pour créer des sauts de ligne entre les différentes lignes d'une adresse postale :</p>
 
-<h3 id="Résultat">Résultat</h3>
+<pre class="brush:html">Mozilla&lt;br&gt;
+331 E. Evelyn Avenue&lt;br&gt;
+Mountain View, CA&lt;br&gt;
+94041&lt;br&gt;
+USA&lt;br&gt;</pre>
 
-<p>{{EmbedLiveSample("Exemples","100%","200")}}</p>
+<p>Le résultat ressemble à ceci :</p>
 
-<h2 id="Accessibilité">Accessibilité</h2>
+<p>{{EmbedLiveSample('simple_br', '', '130')}}</p>
+
+<h2 id="accessibility_concerns">Accessibilité</h2>
 
 <p>Utiliser une suite d'éléments <code>&lt;br&gt;</code> pour uniquement rajouter un espace entre des paragraphes sera source de confusion ou de frustration pour les personnes qui utilisent des outils d'assistance. Les lecteurs d'écran, par exemple, pourront annoncer la présence de l'élément alors qu'il n'y a aucun contenu associé.</p>
 
-<p>Si on souhaite ajouter un espace supplémentaire, on utilisera plutôt la propriété CSS {{cssxref("margin")}}.</p>
+<p>Si on souhaite ajouter un espace supplémentaire, on utilisera plutôt la propriété CSS <a href="/fr/docs/Web/CSS/margin"><code>margin</code></a>.</p>
 
-<h2 id="Résumé_technique">Résumé technique</h2>
+<h2 id="technical_summary">Résumé technique</h2>
 
 <table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/fr/docs/Web/HTML/Catégorie_de_contenu">Catégories de contenu</a></th>
-   <td><a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_de_flux">Contenu de flux</a>, <a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_phrasé">contenu phrasé</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenu autorisé</th>
-   <td>Aucun, c'est un élément vide.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omission de balise</th>
-   <td>Cet élément doit avoir une balise de début et ne doit pas avoir de balise de fin. Pour les documents XHTML, on écrira cet élément <code>&lt;br /&gt;</code>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Parents autorisés</th>
-   <td>Tout élément qui accepte du <a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_phrasé">contenu phrasé</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Rôles ARIA autorisés</th>
-   <td>Tous les rôles sont autorisés.</td>
-  </tr>
-  <tr>
-   <th scope="row">Interface DOM</th>
-   <td>{{domxref("HTMLBRElement")}}</td>
-  </tr>
- </tbody>
+  <tbody>
+    <tr>
+      <th scope="row"><a href="/fr/docs/Web/Guide/HTML/Content_categories">Catégories de contenu</a></th>
+      <td><a href="/fr/docs/Web/Guide/HTML/Content_categories#flow_content">Contenu de flux</a>, <a href="/fr/docs/Web/Guide/HTML/Content_categories#phrasing_content">contenu phrasé</a>.</td>
+    </tr>
+    <tr>
+      <th scope="row">Contenu autorisé</th>
+      <td>Aucun, c'est un <a href="/fr/docs/Glossary/Empty_element">élément vide</a>.</td>
+    </tr>
+    <tr>
+      <th scope="row">Omission de balise</th>
+      <td>Cet élément doit avoir une balise de début et ne doit pas avoir de balise de fin. Pour les documents XHTML, on écrira cet élément <code>&lt;br/&gt;</code>.</td>
+    </tr>
+    <tr>
+      <th scope="row">Parents autorisés</th>
+      <td>Tout élément qui accepte du <a href="/fr/docs/Web/Guide/HTML/Content_categories#phrasing_content">contenu phrasé</a>.</td>
+    </tr>
+    <tr>
+      <th scope="row">Rôle ARIA implicite</th>
+      <td><a href="https://www.w3.org/TR/html-aria/#dfn-no-corresponding-role">Pas de rôle correspondant</a></td>
+    </tr>
+    <tr>
+      <th scope="row">Rôles ARIA autorisés</th>
+      <td><a href="https://w3c.github.io/aria/#none"><code>none</code></a>, <a href="https://w3c.github.io/aria/#presentation"><code>presentation</code></a></td>
+    </tr>
+    <tr>
+      <th scope="row">Interface DOM</th>
+      <td><a href="/fr/docs/Web/API/HTMLBRElement"><code>HTMLBRElement</code></a></td>
+    </tr>
+  </tbody>
 </table>
 
-<h2 id="Spécifications">Spécifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">État</th>
-   <th scope="col">Commentaires</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-br-element', '&lt;br&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-br-element', '&lt;br&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/text.html#h-9.3.2.1', '&lt;br&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
+<h2 id="specifications">Spécifications</h2>
 
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+<p>{{Specifications}}</p>
 
-<div class="hidden">Ce tableau de compatibilité a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div>
+<h2 id="browser_compatibility">Compatibilité des navigateurs</h2>
 
-<p>{{Compat("html.elements.br")}}</p>
+<p>{{Compat}}</p>
 
-<h2 id="Voir_aussi">Voir aussi</h2>
+<h2 id="see_also">Voir aussi</h2>
 
 <ul>
- <li>{{HTMLElement("address")}}</li>
- <li>{{HTMLElement("p")}}</li>
+  <li>L'élément <a href="/fr/docs/Web/HTML/Element/address"><code>&lt;address&gt;</code></a></li>
+  <li>L'élément <a href="/fr/docs/Web/HTML/Element/p"><code>&lt;p&gt;</code></a></li>
+  <li>L'élément <a href="/fr/docs/Web/HTML/Element/wbr"><code>&lt;wbr&gt;</code></a></li>
 </ul>