Prepare HTML section for Markdown conversion (#2628)

* Remove summary classes

* Remove useless spans

* Remove notranslate

* Fix element index page (cf en-US)

* Align page vs en-US cf8bcd9 for CI

* Remove hidden classes

* remove ids

* Fix notes - part 1 / n

* Fix notes - part 2/2

* Fix warnings

* fix dls and some other issues

* Fix imgs and styles

1 files changed, 19 insertions, 21 deletions

diff --git a/files/fr/web/html/element/area/index.html b/files/fr/web/html/element/area/index.html
index d3e10ca3f6..2061200c14 100644
--- a/files/fr/web/html/element/area/index.html
+++ b/files/fr/web/html/element/area/index.html
@@ -15,7 +15,7 @@ browser-compat: html.elements.area
 ---
 <div>{{HTMLRef}}</div>
 
-<p class="summary">L'élément HTML <strong><code>&lt;area&gt;</code></strong> définit une zone particulière d'une image et peut lui associer un <a href="/fr/docs/Glossary/Hyperlink">lien hypertexte</a>. Cet élément n'est utilisé qu'au sein d'un élément <a href="/fr/docs/Web/HTML/Element/map"><code>&lt;map&gt;</code></a>.</p>
+<p>L'élément HTML <strong><code>&lt;area&gt;</code></strong> définit une zone particulière d'une image et peut lui associer un <a href="/fr/docs/Glossary/Hyperlink">lien hypertexte</a>. Cet élément n'est utilisé qu'au sein d'un élément <a href="/fr/docs/Web/HTML/Element/map"><code>&lt;map&gt;</code></a>.</p>
 
 <div>{{EmbedInteractiveExample("pages/tabbed/area.html", "tabbed-taller")}}</div>
 
@@ -57,9 +57,9 @@ browser-compat: html.elements.area
 <p>Cet élément inclut les <a href="/fr/docs/Web/HTML/Global_attributes">attributs universels</a>.</p>
 
 <dl>
-  <dt><strong id="attr-alt"><code>alt</code></strong></dt>
+  <dt><strong><code>alt</code></strong></dt>
   <dd>Une chaîne de texte alternative à afficher sur les navigateurs qui n'affichent pas les images. Le texte doit être formulé de manière à offrir à l'utilisateur le même type de choix que l'image lorsqu'elle est affichée sans le texte alternatif. Cet attribut est requis uniquement si l'attribut <a href="#attr-href"><code>href</code></a> est utilisé.</dd>
-  <dt><strong id="attr-coords"><code>coords</code></strong></dt>
+  <dt><strong><code>coords</code></strong></dt>
   <dd>L'attribut <code>coords</code> détaille les coordonnées de l'attribut <code><a href="#attr-shape">shape</a></code> en taille, forme et placement d'un élément <code>&lt;area&gt;</code>.
     <ul>
       <li><code>rect</code> : la valeur est <code><var>x1,y1,x2,y2</var></code>. La valeur spécifie les coordonnées du coin supérieur gauche et inférieur droit du rectangle.
@@ -72,15 +72,15 @@ browser-compat: html.elements.area
       <li><code>default</code> : définit la région entière.</li>
     </ul>
     Les valeurs sont exprimées en nombre de pixels CSS.</dd>
-  <dt><strong id="attr-download"><code>download</code></strong></dt>
+  <dt><strong><code>download</code></strong></dt>
   <dd>Cet attribut, s'il est présent, indique que l'auteur souhaite que l'hyperlien soit utilisé pour télécharger une ressource. Voir <a href="/fr/docs/Web/HTML/Element/a"><code>&lt;a&gt;</code></a> pour une description complète de l'attribut <a href="/fr/docs/Web/HTML/Element/a#attr-download"><code>download</code></a>.</dd>
-  <dt><strong id="attr-href"><code>href</code></strong></dt>
+  <dt><strong><code>href</code></strong></dt>
   <dd>Le lien hypertexte porté par la zone d'intérêt. Ce doit être une URL valide. Cet attribut peut être absent et dans ce cas, la zone d'intérêt ne représente pas de lien hypertexte.</dd>
-  <dt><strong id="attr-hreflang"><code>hreflang</code></strong></dt>
+  <dt><strong><code>hreflang</code></strong></dt>
   <dd>Cet attribut indique la langue du contenu vers lequel le lien renvoie. Les valeurs autorisées pour cet attribut sont définies par <a href="https://www.ietf.org/rfc/bcp/bcp47.txt">BCP47</a>. Cet attribut doit uniquement être utilisé lorsque <code>href</code> est présent.</dd>
-  <dt><strong id="attr-ping"><code>ping</code></strong></dt>
+  <dt><strong><code>ping</code></strong></dt>
   <dd>Cet attribut contient une liste d'URL séparées par des espaces vers lesquelles sont envoyées des requêtes HTTP <a href="/fr/docs/Web/HTTP/Methods/POST"><code>POST</code></a> dont le corps vaut <code>PING</code> lors du clic sur le lien. Les requêtes sont envoyées en arrière-plan. Cet attribut est généralement utilisé à des fins de pistage.</dd>
-  <dt><strong id="attr-referrerpolicy"><code>referrerpolicy</code></strong> {{experimental_inline}}</dt>
+  <dt><strong><code>referrerpolicy</code></strong> {{experimental_inline}}</dt>
   <dd>Une chaîne de caractères qui indique le référent (<em>referrer</em>) à utiliser lors de la récupération de la ressource :
     <ul>
       <li>« <code>no-referrer</code> » indique que l'en-tête <code>Referer</code> ne sera pas envoyé.</li>
@@ -90,11 +90,11 @@ browser-compat: html.elements.area
       <li>« <code>unsafe-url</code> » indique que le référent envoyé inclura l'origine et le chemin (mais pas le fragment, le mot de passe ou le nom d'utilisateur). Ce cas n'est pas considéré comme sûr, car il peut laisser fuiter des origines et des chemins de ressources protégées par TLS vers des origines non-sécurisées.</li>
     </ul>
   </dd>
-  <dt><strong id="attr-rel"><code>rel</code></strong></dt>
+  <dt><strong><code>rel</code></strong></dt>
   <dd>Pour les ancres contenant l'attribut <code><strong>href</strong></code>, cet attribut définit la relation entre l'objet ciblé et l'objet lié. La valeur est une liste des <a href="/fr/docs/Web/HTML/Link_types">différentes relations</a> dont les valeurs sont séparées par des espaces. Les valeurs et leurs significations peuvent être enregistrées par une autorité jugée utile par l'auteur du document. La valeur par défaut est la relation vide. Cet attribut doit uniquement être utilisé si l'attribut <a href="#attr-href"><code>href</code></a> est présent.</dd>
-  <dt><strong id="attr-shape"><code>shape</code></strong></dt>
+  <dt><strong><code>shape</code></strong></dt>
   <dd>La forme de la zone d'intérêt. Les spécifications HTML5 et HTML4 définissent les valeurs <code>rect</code> (zone rectangulaire), <code>circle</code> (zone circulaire), <code>poly</code> (zone polygonale) et <code>default</code> (indiquant toute la zone). Beacuoup de navigateurs, comme Internet Explorer 4 et ultérieur, supportent les valeurs <code>circ</code>, <code>polygon</code> et <code>rectangle</code> pour l'attribut <code>shape</code>, mais ces valeurs ne sont pas standard.</dd>
-  <dt><strong id="attr-target"><code>target</code></strong></dt>
+  <dt><strong><code>target</code></strong></dt>
   <dd>Cet attribut dans quel <em>contexte de navigation</em> afficher la ressource liée. Les mots-clés peuvent avoir les significations suivantes :
     <ul>
       <li><code>_self</code> (valeur par défaut) : Charge la réponse dans le contexte de navigation actuel.</li>
@@ -104,9 +104,8 @@ browser-compat: html.elements.area
     </ul>
 
     <p>Cet attribut doit uniquement être utilisé si l'attribut <a href="#attr-href"><code>href</code></a> est présent.</p>
-    <div class="notecard note">
-      <p><b>Note :</b></p>
-      <p>La définition de <code>target="_blank"</code> sur les éléments <code>&lt;area&gt;</code> fournit implicitement le même comportement <code>rel</code> que la définition de <code><a href="/fr/docs/Web/HTML/Link_types/noopener">rel="noopener"</a></code> qui ne définit pas <code>window.opener</code>. Voir la <a href="#browser_compatibility">compatibilité des navigateurs</a> pour les informations sur son support.</p>
+    <div class="note">
+      <p><strong>Note :</strong>La définition de <code>target="_blank"</code> sur les éléments <code>&lt;area&gt;</code> fournit implicitement le même comportement <code>rel</code> que la définition de <code><a href="/fr/docs/Web/HTML/Link_types/noopener">rel="noopener"</a></code> qui ne définit pas <code>window.opener</code>. Voir la <a href="#browser_compatibility">compatibilité des navigateurs</a> pour les informations sur son support.</p>
       </div>
   </dd>
 </dl>
@@ -114,18 +113,17 @@ browser-compat: html.elements.area
 <h3 id="deprecated_attributes">Attributs dépréciés ou obsolètes</h3>
 
 <dl>
-  <dt><strong id="attr-name"><code>name</code></strong> {{deprecated_inline}}</dt>
+  <dt><strong><code>name</code></strong> {{deprecated_inline}}</dt>
   <dd>Définit un nom pour la zone sur laquelle on peut cliquer afin que cet élément puisse être interprété par les navigateurs plus anciens.</dd>
-  <dt><strong id="attr-nohref"><code>nohref</code></strong> {{deprecated_inline}}</dt>
+  <dt><strong><code>nohref</code></strong> {{deprecated_inline}}</dt>
   <dd>Indique une absence d'hyperlien pour la zone d'intérêt. Cet attribut doit être présent si <strong>href</strong> ne l'est pas et <em>vice versa</em>.
-    <div class="notecard note">
-      <p><b>Note :</b></p>
-      <p>Cet attribut est obsolète en HTML5, ne pas utiliser l'attribut <code>href</code> suffit.</p>
+    <div class="note">
+      <p><strong>Note :</strong>Cet attribut est obsolète en HTML5, ne pas utiliser l'attribut <code>href</code> suffit.</p>
     </div>
   </dd>
-  <dt><strong id="attr-tabindex"><code>tabindex</code></strong> {{deprecated_inline}}</dt>
+  <dt><strong><code>tabindex</code></strong> {{deprecated_inline}}</dt>
   <dd>Une valeur numérique définissant l'ordre de la zone d'intérêt parmi les différentes étiquettes. Cet attribut est un attribut universel avec HTML5.</dd>
-  <dt><strong id="attr-type"><code>type</code></strong> {{deprecated_inline}}</dt>
+  <dt><strong><code>type</code></strong> {{deprecated_inline}}</dt>
   <dd>Sans effet car ignoré par les navigateurs.</dd>
 </dl>