convert content to md

22 files changed, 974 insertions, 1066 deletions

diff --git a/files/fr/web/accessibility/aria/aria_techniques/index.md b/files/fr/web/accessibility/aria/aria_techniques/index.md
index 58c2d37553..74687a3930 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/index.md
@@ -9,111 +9,113 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques
 original_slug: Accessibilité/ARIA/Techniques_ARIA
 ---
-<h3 id="Rôles">Rôles</h3>
-<h4 id="Rôles_de_composant_d’interface">Rôles de composant d’interface</h4>
-<ul>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_alert">Alert</a></li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_alertdialog">Alertdialog</a></li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_button">Button</a></li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_checkbox">Checkbox</a></li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_dialog">Dialog</a></li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_link">Link</a></li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_log">Log</a></li>
- <li>Marquee</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_progressbar">Progressbar</a></li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_radio">Radio</a></li>
- <li>Scrollbar</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_slider">Slider</a></li>
- <li>Spinbutton</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_status">status</a></li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_textbox">textbox</a></li>
- <li>Timer</li>
- <li>Tooltip</li>
-</ul>
-<h4 id="Rôles_composés">Rôles composés</h4>
-<p>Les techniques ci-dessous décrivent chaque rôle composé ainsi que leurs rôles enfants obligatoires ou facultatifs.</p>
-<ul>
- <li>Grid (tableau, contenant les rôles <code>row</code> (ligne), <code>gridcell</code> (cellule), <code>rowheader</code> (en-tête de ligne) et <code>columnheader</code> (en-tête de colonne))</li>
- <li>Menubar / Menu (contenant les rôles <code>menuitem</code>, <code>menuitemcheckbox</code> et <code>menuitemradio</code>)</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_listbox">Listbox</a> (boîte de liste, contenant le rôle <code>option</code>)</li>
- <li>Tablist (boîte à onglets, contenant les rôles <code>tab</code> et <code>tabpanel</code>)</li>
- <li>Tree (arbre, contenant les rôles <code>group</code> et <code>treeitem</code>)</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_radio">Radiogroup (voir le rôle <code>Radio</code>)</a></li>
- <li>Treegrid</li>
-</ul>
-<h4 id="Rôles_de_structure_de_document">Rôles de structure de document</h4>
-<ul>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_article">Article</a></li>
- <li>Definition</li>
- <li>Directory</li>
- <li>Document</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_group">Group</a></li>
- <li>Heading</li>
- <li>Img</li>
- <li>List, listitem</li>
- <li>Math</li>
- <li>Note</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_presentation">Presentation</a></li>
- <li>Region</li>
- <li>Separator</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_toolbar">Toolbar</a></li>
-</ul>
-<h4 id="Rôles_de_points_de_repère">Rôles de points de repère</h4>
-<ul>
- <li>Application</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_banner">Banner</a></li>
- <li>Complementary</li>
- <li>Contentinfo</li>
- <li>Form</li>
- <li>Main</li>
- <li>Navigation</li>
- <li>Search</li>
-</ul>
-<h3 id="États_et_propriétés">États et propriétés</h3>
-<h4 id="Attributs_de_composants_d’interface">Attributs de composants d’interface</h4>
-<ul>
- <li>aria-autocomplete</li>
- <li>aria-checked</li>
- <li>aria-disabled</li>
- <li>aria-expanded</li>
- <li>aria-haspopup</li>
- <li>aria-hidden</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-invalid">aria-invalid</a></li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-label">aria-label</a></li>
- <li>aria-level</li>
- <li>aria-multiline</li>
- <li>aria-multiselectable</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-orientation">aria-orientation</a></li>
- <li>aria-pressed</li>
- <li>aria-readonly</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-required">aria-required</a></li>
- <li>aria-selected</li>
- <li>aria-sort</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemax">aria-valuemax</a></li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemin">aria-valuemin</a></li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow">aria-valuenow</a></li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuetext">aria-valuetext</a></li>
-</ul>
-<h4 id="Attributs_de_zones_«_live_»">Attributs de zones « live »</h4>
-<ul>
- <li>aria-live</li>
- <li>aria-relevant</li>
- <li>aria-atomic</li>
- <li>aria-busy</li>
-</ul>
-<h4 id="Attributs_de_glisser-déposer">Attributs de glisser-déposer</h4>
-<ul>
- <li>aria-dropeffect</li>
- <li>aria-dragged</li>
-</ul>
-<h4 id="Attributs_de_relation">Attributs de relation</h4>
-<ul>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-activedescendant">aria-activedescendant</a></li>
- <li>aria-controls</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-describedby">aria-describedby</a></li>
- <li>aria-flowto</li>
- <li><a href="/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-labelledby">aria-labelledby</a></li>
- <li>aria-owns</li>
- <li>aria-posinset</li>
- <li>aria-setsize</li>
-</ul>
+### Rôles
+
+#### Rôles de composant d’interface
+
+- [Alert](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_alert)
+- [Alertdialog](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_alertdialog)
+- [Button](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_button)
+- [Checkbox](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_checkbox)
+- [Dialog](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_dialog)
+- [Link](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_link)
+- [Log](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_log)
+- Marquee
+- [Progressbar](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_progressbar)
+- [Radio](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_radio)
+- Scrollbar
+- [Slider](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_slider)
+- Spinbutton
+- [status](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_status)
+- [textbox](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_textbox)
+- Timer
+- Tooltip
+
+#### Rôles composés
+
+Les techniques ci-dessous décrivent chaque rôle composé ainsi que leurs rôles enfants obligatoires ou facultatifs.
+
+- Grid (tableau, contenant les rôles `row` (ligne), `gridcell` (cellule), `rowheader` (en-tête de ligne) et `columnheader` (en-tête de colonne))
+- Menubar / Menu (contenant les rôles `menuitem`, `menuitemcheckbox` et `menuitemradio`)
+- [Listbox](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_listbox) (boîte de liste, contenant le rôle `option`)
+- Tablist (boîte à onglets, contenant les rôles `tab` et `tabpanel`)
+- Tree (arbre, contenant les rôles `group` et `treeitem`)
+- [Radiogroup (voir le rôle `Radio`)](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_radio)
+- Treegrid
+
+#### Rôles de structure de document
+
+- [Article](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_article)
+- Definition
+- Directory
+- Document
+- [Group](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_group)
+- Heading
+- Img
+- List, listitem
+- Math
+- Note
+- [Presentation](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_presentation)
+- Region
+- Separator
+- [Toolbar](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_toolbar)
+
+#### Rôles de points de repère
+
+- Application
+- [Banner](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_banner)
+- Complementary
+- Contentinfo
+- Form
+- Main
+- Navigation
+- Search
+
+### États et propriétés
+
+#### Attributs de composants d’interface
+
+- aria-autocomplete
+- aria-checked
+- aria-disabled
+- aria-expanded
+- aria-haspopup
+- aria-hidden
+- [aria-invalid](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-invalid)
+- [aria-label](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-label)
+- aria-level
+- aria-multiline
+- aria-multiselectable
+- [aria-orientation](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-orientation)
+- aria-pressed
+- aria-readonly
+- [aria-required](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-required)
+- aria-selected
+- aria-sort
+- [aria-valuemax](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemax)
+- [aria-valuemin](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemin)
+- [aria-valuenow](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow)
+- [aria-valuetext](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuetext)
+
+#### Attributs de zones « live »
+
+- aria-live
+- aria-relevant
+- aria-atomic
+- aria-busy
+
+#### Attributs de glisser-déposer
+
+- aria-dropeffect
+- aria-dragged
+
+#### Attributs de relation
+
+- [aria-activedescendant](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-activedescendant)
+- aria-controls
+- [aria-describedby](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-describedby)
+- aria-flowto
+- [aria-labelledby](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-labelledby)
+- aria-owns
+- aria-posinset
+- aria-setsize
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_alert_role/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_alert_role/index.md
index 075b85ac58..f1858e0e89 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_alert_role/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_alert_role/index.md
@@ -9,116 +9,110 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alert_role
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_alert
 ---
-<h3 id="Description">Description</h3>
+### Description
 
-<p>Cette technique présente l’utilisation du rôle <a href="http://www.w3.org/TR/wai-aria/roles#alert"><code>alert</code> (en)</a> et décrit les effets produits sur les navigateurs et les technologies d’assistance.</p>
+Cette technique présente l’utilisation du rôle [`alert` (en)](http://www.w3.org/TR/wai-aria/roles#alert) et décrit les effets produits sur les navigateurs et les technologies d’assistance.
 
-<p>Le rôle <code>alert</code> est utilisé pour communiquer un message important et généralement avec une notion d'urgence à l’utilisateur. Lorsque ce rôle est ajouté à un élément, le navigateur émettra un événement d'alerte accessible aux produits de technologie d’assistance qui pourront alors le notifier à l’utilisateur. Le rôle <code>alert</code> est le plus utile lorsqu’il s’agit d’attirer l’attention de l’utilisateur, par exemple si :</p>
+Le rôle `alert` est utilisé pour communiquer un message important et généralement avec une notion d'urgence à l’utilisateur. Lorsque ce rôle est ajouté à un élément, le navigateur émettra un événement d'alerte accessible aux produits de technologie d’assistance qui pourront alors le notifier à l’utilisateur. Le rôle `alert` est le plus utile lorsqu’il s’agit d’attirer l’attention de l’utilisateur, par exemple si :
 
-<ul>
- <li>Une valeur non valide a été saisie dans un champ de formulaire ;</li>
- <li>La session d’un utilisateur est sur le point d’expirer ;</li>
- <li>La connexion au serveur a été interrompue, les modifications locales ne seront pas sauvegardées.</li>
-</ul>
+- Une valeur non valide a été saisie dans un champ de formulaire ;
+- La session d’un utilisateur est sur le point d’expirer ;
+- La connexion au serveur a été interrompue, les modifications locales ne seront pas sauvegardées.
 
-<p>De fait de sa nature intrusive, le rôle <code>alert</code> doit être utilisé avec parcimonie et uniquement dans les situations où l’attention de l’utilisateur est immédiatement requise. Les changements dynamiques de moindre urgence devraient utiliser une méthode moins agressive, telle que <code>aria-live="polite"</code> ou autres rôles de zone live.</p>
+De fait de sa nature intrusive, le rôle `alert` doit être utilisé avec parcimonie et uniquement dans les situations où l’attention de l’utilisateur est immédiatement requise. Les changements dynamiques de moindre urgence devraient utiliser une méthode moins agressive, telle que `aria-live="polite"` ou autres rôles de zone live.
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<p>Lorsque le rôle <code>alert</code> est ajouté à un élément, ou qu’un tel élément devient visible, l’agent utilisateur devrait suivre les étapes suivantes :</p>
+Lorsque le rôle `alert` est ajouté à un élément, ou qu’un tel élément devient visible, l’agent utilisateur devrait suivre les étapes suivantes :
 
-<ul>
- <li>Présenter l’élément ayant un rôle d’alerte à l’API d’accessibilité du système d’exploitation ;</li>
- <li>Déclencher un événement d'alerte accessible à l’aide l’API d’accessibilité du système d’exploitation si elle le prend en charge.</li>
-</ul>
+- Présenter l’élément ayant un rôle d’alerte à l’API d’accessibilité du système d’exploitation ;
+- Déclencher un événement d'alerte accessible à l’aide l’API d’accessibilité du système d’exploitation si elle le prend en charge.
 
-<p>Les technologies d’assistance devraient être à l’écoute de tels évènements et les notifier à l’utilisateur en conséquence :</p>
+Les technologies d’assistance devraient être à l’écoute de tels évènements et les notifier à l’utilisateur en conséquence :
 
-<ul>
- <li>Les lecteurs d’écran peuvent interrompre la sortie en cours (qu’elle soit vocale ou en braille) et immédiatement annoncer ou afficher le message d’alerte ;</li>
- <li>Les loupes ou agrandisseurs d’écran peuvent indiquer qu’une alerte est survenue et quel en est le texte.</li>
-</ul>
+- Les lecteurs d’écran peuvent interrompre la sortie en cours (qu’elle soit vocale ou en braille) et immédiatement annoncer ou afficher le message d’alerte ;
+- Les loupes ou agrandisseurs d’écran peuvent indiquer qu’une alerte est survenue et quel en est le texte.
 
-<div class="note">
-  <p><strong>Note :</strong> plusieurs points de vue existent sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p>
-</div>
+> **Note :** plusieurs points de vue existent sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<h3 id="Exemples">Exemples</h3>
+### Exemples
 
-<h4 id="Exemple_1_Ajout_du_rôle_dans_le_code_HTML">Exemple 1 : Ajout du rôle dans le code HTML</h4>
+#### Exemple 1 : Ajout du rôle dans le code HTML
 
-<p>L’extrait de code ci-dessous montre comment le rôle <code>alert</code> est directement ajouté dans le code source HTML. Au moment où l’élément finit de se charger, le lecteur d’écran doit être notifié de l’alerte. Si l’élément était dans le code source original lorsque la page s’est chargée, le lecteur d’écran annonce immédiatement l’erreur après la lecture du titre de la page.</p>
+L’extrait de code ci-dessous montre comment le rôle `alert` est directement ajouté dans le code source HTML. Au moment où l’élément finit de se charger, le lecteur d’écran doit être notifié de l’alerte. Si l’élément était dans le code source original lorsque la page s’est chargée, le lecteur d’écran annonce immédiatement l’erreur après la lecture du titre de la page.
 
-<pre class="brush: html">&lt;h2 role="alert"&gt;Votre formulaire ne peut être soumis à cause de 3 erreurs de validation.&lt;/h2&gt;
-</pre>
+```html
+<h2 role="alert">Votre formulaire ne peut être soumis à cause de 3 erreurs de validation.</h2>
+```
 
-<h4 id="Exemple_2_Ajout_dynamique_d'un_élément_avec_le_rôle_alert">Exemple 2 : Ajout dynamique d'un élément avec le rôle <code>alert</code></h4>
+#### Exemple 2 : Ajout dynamique d'un élément avec le rôle `alert`
 
-<p>Cet extrait de code crée dynamiquement un élément avec un rôle <code>alert</code> et l’ajoute à la structure du document.</p>
+Cet extrait de code crée dynamiquement un élément avec un rôle `alert` et l’ajoute à la structure du document.
 
-<pre class="brush: js">var myAlert = document.createElement("p");
+```js
+var myAlert = document.createElement("p");
 myAlert.setAttribute("role", "alert");
 
 var myAlertText = document.createTextNode("Vous devez accepter nos conditions d’utilisation pour créer un compte.");
 myAlert.appendChild(myAlertText);
 document.body.appendChild(myAlertText);
-</pre>
+```
 
-<p><strong>Note :</strong> le même résultat peut être obtenu avec moins de code en utilisant une bibliothèque de scripts telle que <em>jQuery</em> :</p>
+**Note :** le même résultat peut être obtenu avec moins de code en utilisant une bibliothèque de scripts telle que *jQuery* :
 
-<pre class="brush: js">$("&lt;p role='alert'&gt;Vous devez accepter nos conditions d’utilisation pour créer un compte.&lt;/p&gt;").appendTo(document.body);
-</pre>
+```js
+$("<p role='alert'>Vous devez accepter nos conditions d’utilisation pour créer un compte.</p>").appendTo(document.body);
+```
 
-<h4 id="Exemple_3_Ajout_d'un_rôle_alert_à_un_élément_existant">Exemple 3 : Ajout d'un rôle <code>alert</code> à un élément existant</h4>
+#### Exemple 3 : Ajout d'un rôle `alert` à un élément existant
 
-<p>Parfois, il peut être utile d’ajouter un rôle <code>alert</code> à un élément déjà visible dans la page plutôt que de créer un nouvel élément. Ceci permet au développeur de répéter une information devenue plus pertinente ou urgente pour l’utilisateur. Par exemple, un contrôle de formulaire peut avoir des instructions sur les valeurs attendues. Si une valeur différente est saisie, <code>role="alert"</code> peut être ajouté au texte de l’instruction pour que le lecteur d’écran l’annonce comme une alerte. L'extrait de pseudo-code ci-dessous illustre cette approche :</p>
+Parfois, il peut être utile d’ajouter un rôle `alert` à un élément déjà visible dans la page plutôt que de créer un nouvel élément. Ceci permet au développeur de répéter une information devenue plus pertinente ou urgente pour l’utilisateur. Par exemple, un contrôle de formulaire peut avoir des instructions sur les valeurs attendues. Si une valeur différente est saisie, `role="alert"` peut être ajouté au texte de l’instruction pour que le lecteur d’écran l’annonce comme une alerte. L'extrait de pseudo-code ci-dessous illustre cette approche :
 
-<pre class="brush: html">&lt;p id="formInstruction"&gt;Vous devez cocher au moins trois options&lt;/p&gt;
-</pre>
+```html
+<p id="formInstruction">Vous devez cocher au moins trois options</p>
+```
 
-<pre class="brush: js">// Lorsque l’utilisateur essaye de soumettre le formulaire avec moins de 3 cases cochées :
-document.getElementById("formInstruction").setAttribute("role", "alert");</pre>
+```js
+// Lorsque l’utilisateur essaye de soumettre le formulaire avec moins de 3 cases cochées :
+document.getElementById("formInstruction").setAttribute("role", "alert");
+```
 
-<h4 id="Exemple_4_Rendre_visible_un_élément_avec_le_rôle_alert">Exemple 4 : Rendre visible un élément avec le rôle <code>alert</code></h4>
+#### Exemple 4 : Rendre visible un élément avec le rôle `alert`
 
-<p>Si un élément possède déjà <code>role="alert"</code> et qu’il est initialement caché par des règles CSS, le rendre visible déclenchera l’alerte comme si elle venait juste d’être ajoutée à la page. Cela signifie qu’une alerte existante peut être « réutilisée » plusieurs fois.</p>
+Si un élément possède déjà `role="alert"` et qu’il est initialement caché par des règles CSS, le rendre visible déclenchera l’alerte comme si elle venait juste d’être ajoutée à la page. Cela signifie qu’une alerte existante peut être « réutilisée » plusieurs fois.
 
-<p><strong>Note :</strong> dans la plupart des cas cette approche n’est pas recommandée, parce qu'il n'est pas idéal de masquer une erreur ou un texte d’alerte qui n’est pas applicable à ce moment précis. Les utilisateurs de technologies d’assistance plus anciennes pourraient toujours percevoir le texte d’alerte même si l’alerte ne s’applique pas à ce moment, faisant croire de façon erronée aux utilisateurs à l’existence d’un problème.</p>
+**Note :** dans la plupart des cas cette approche n’est pas recommandée, parce qu'il n'est pas idéal de masquer une erreur ou un texte d’alerte qui n’est pas applicable à ce moment précis. Les utilisateurs de technologies d’assistance plus anciennes pourraient toujours percevoir le texte d’alerte même si l’alerte ne s’applique pas à ce moment, faisant croire de façon erronée aux utilisateurs à l’existence d’un problème.
 
-<pre class="brush: css">.hidden {
+```css
+.hidden {
   display:none;
   }
-</pre>
+```
 
-<pre class="brush: html">&lt;p id="expirationWarning" role="alert" class="hidden"&gt;Votre session expirera dans 2 minutes&lt;/p&gt;
-</pre>
+```html
+<p id="expirationWarning" role="alert" class="hidden">Votre session expirera dans 2 minutes</p>
+```
 
-<pre class="brush: js">// suppression de la classe 'hidden' rend l’élément visible, ce qui entraînera l’annonce de l’alerte par le lecteur d’écran :
-document.getElementById("expirationWarning").className = ""; </pre>
+```js
+// suppression de la classe 'hidden' rend l’élément visible, ce qui entraînera l’annonce de l’alerte par le lecteur d’écran :
+document.getElementById("expirationWarning").className = "";
+```
 
-<h3 id="Notes">Notes </h3>
+### Notes 
 
-<ul>
- <li>L’utilisation du rôle <code>alert</code> sur un élément implique que cet élément a l’attribut <code>aria-live="assertive"</code> ;</li>
- <li>Le rôle <code>alert</code> ne devrait être utilisé que pour du contenu texte statique. L’élément sur lequel on utilise le rôle <code>alert</code> ne devrait pas pouvoir recevoir le focus, car les lecteurs d’écran annonceront automatiquement l’alerte où que se trouve le focus clavier ;</li>
- <li>Si une alerte fournit également des contrôles interactifs – tels que des contrôles de formulaire qui permettraient à l’utilisateur de rectifier une erreur, ou un bouton <code>OK</code> pour annuler l’alerte – le rôle <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_alertdialog"><code>alertdialog</code></a> est préférable.</li>
-</ul>
+- L’utilisation du rôle `alert` sur un élément implique que cet élément a l’attribut `aria-live="assertive"` ;
+- Le rôle `alert` ne devrait être utilisé que pour du contenu texte statique. L’élément sur lequel on utilise le rôle `alert` ne devrait pas pouvoir recevoir le focus, car les lecteurs d’écran annonceront automatiquement l’alerte où que se trouve le focus clavier ;
+- Si une alerte fournit également des contrôles interactifs – tels que des contrôles de formulaire qui permettraient à l’utilisateur de rectifier une erreur, ou un bouton `OK` pour annuler l’alerte – le rôle [`alertdialog`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_alertdialog) est préférable.
 
-<h3 id="Attributs_ARIA_utilisés">Attributs ARIA utilisés</h3>
+### Attributs ARIA utilisés
 
-<ul>
- <li><a href="http://www.w3.org/TR/wai-aria/roles#alert">alert (en)</a></li>
-</ul>
+- [alert (en)](http://www.w3.org/TR/wai-aria/roles#alert)
 
-<h3 id="Techniques_ARIA_connexes">Techniques ARIA connexes</h3>
+### Techniques ARIA connexes
 
-<ul>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_alertdialog">Utiliser le rôle <code>alertdialog</code></a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_la_propriété_aria-invalid">Utiliser la propriété <code>aria-invalid</code></a>.</li>
-</ul>
+- [Utiliser le rôle `alertdialog`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_alertdialog) ;
+- [Utiliser la propriété `aria-invalid`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_la_propriété_aria-invalid).
 
-<h3 id="Autres_ressources">Autres ressources</h3>
+### Autres ressources
 
-<ul>
- <li>Guide des bonnes pratiques ARIA - Rôle <code>Alert</code> : <a href="http://www.w3.org/TR/wai-aria-practices/#alert">http://www.w3.org/TR/wai-aria-practices/#alert (en)</a></li>
-</ul>
+- Guide des bonnes pratiques ARIA - Rôle `Alert` : [http://www.w3.org/TR/wai-aria-practices/#alert (en)](http://www.w3.org/TR/wai-aria-practices/#alert)
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_alertdialog_role/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_alertdialog_role/index.md
index 70f746dff9..3a9521f0a3 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_alertdialog_role/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_alertdialog_role/index.md
@@ -9,74 +9,64 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alertdialog_role
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_alertdialog
 ---
-<h3 id="Description">Description</h3>
+### Description
 
-<p>Cette technique présente l’utilisation du rôle <code><a href="http://www.w3.org/TR/2009/WD-wai-aria-20091215/roles#alertdialog">alertdialog</a></code> role.</p>
+Cette technique présente l’utilisation du rôle [`alertdialog`](http://www.w3.org/TR/2009/WD-wai-aria-20091215/roles#alertdialog) role.
 
-<p>Le rôle <code>alertdialog</code> est utilisé pour notifier à l’utilisateur des informations urgentes qui requièrent son attention immédiate. Comme le nom l’indique, <code>alertdialog</code> est un type de boîte de dialogue. Cela signifie que la plupart des instructions fournies à propos de l’<a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_dialog_role">utilisation du rôle <code>dialog</code></a> s’appliquent également au rôle <code>alertdialog</code> :</p>
+Le rôle `alertdialog` est utilisé pour notifier à l’utilisateur des informations urgentes qui requièrent son attention immédiate. Comme le nom l’indique, `alertdialog` est un type de boîte de dialogue. Cela signifie que la plupart des instructions fournies à propos de l’[utilisation du rôle `dialog`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_dialog_role) s’appliquent également au rôle `alertdialog` :
 
-<ul>
- <li>La boîte de dialogue d’alerte doit toujours avoir un nom accessible (attribué à l’aide de <code>aria-labelledby</code> ou de <code>aria-label</code>) et, dans la plupart des cas, le texte d’alerte sera marqué comme étant la description accessible de la boîte de dialogue d’alerte (définie avec de l’attribut <code>aria-describedby</code>).</li>
- <li>Contrairement aux alertes classiques, une boîte de dialogue d’alerte doit avoir au moins un contrôle pouvant recevoir le focus et ce dernier doit s’y placer lors de l’affichage de la boîte de dialogue. Généralement les boîtes de dialogues d’alertes ont au moins un bouton de confirmation, de fermeture ou d’annulation qui peut être utilisé pour recevoir le focus. De plus, les boîtes de dialogues d’alerte peuvent avoir d’autres contrôles interactifs tels que des champs de saisie, des onglets ou des cases à cocher. Le contrôle sur lequel placer le focus dépendra de l’objet de la boîte de dialogue.</li>
- <li>L’ordre de tabulation dans la boite de dialogue de l’alerte doit boucler.</li>
-</ul>
+- La boîte de dialogue d’alerte doit toujours avoir un nom accessible (attribué à l’aide de `aria-labelledby` ou de `aria-label`) et, dans la plupart des cas, le texte d’alerte sera marqué comme étant la description accessible de la boîte de dialogue d’alerte (définie avec de l’attribut `aria-describedby`).
+- Contrairement aux alertes classiques, une boîte de dialogue d’alerte doit avoir au moins un contrôle pouvant recevoir le focus et ce dernier doit s’y placer lors de l’affichage de la boîte de dialogue. Généralement les boîtes de dialogues d’alertes ont au moins un bouton de confirmation, de fermeture ou d’annulation qui peut être utilisé pour recevoir le focus. De plus, les boîtes de dialogues d’alerte peuvent avoir d’autres contrôles interactifs tels que des champs de saisie, des onglets ou des cases à cocher. Le contrôle sur lequel placer le focus dépendra de l’objet de la boîte de dialogue.
+- L’ordre de tabulation dans la boite de dialogue de l’alerte doit boucler.
 
-<p>La différence avec les boîtes de dialogues classiques réside dans le fait que le rôle <code>alertdialog</code> devrait uniquement être utilisé lorsque des alertes, des erreurs ou des avertissements ont lieu. En d’autres termes, lorsque les informations et les contrôles d’une boîte de dialogue nécessitent l’attention immédiate de l’utilisateur il est préférable d’utiliser le rôle <code>alertdialog</code> plutôt que <code>dialog.</code> Il revient au développeur de faire la distinction entre les deux.</p>
+La différence avec les boîtes de dialogues classiques réside dans le fait que le rôle `alertdialog` devrait uniquement être utilisé lorsque des alertes, des erreurs ou des avertissements ont lieu. En d’autres termes, lorsque les informations et les contrôles d’une boîte de dialogue nécessitent l’attention immédiate de l’utilisateur il est préférable d’utiliser le rôle `alertdialog` plutôt que `dialog.` Il revient au développeur de faire la distinction entre les deux.
 
-<p>Du fait de sa nature urgente, les boîtes de dialogues d’alertes doivent toujours être modales.</p>
+Du fait de sa nature urgente, les boîtes de dialogues d’alertes doivent toujours être modales.
 
-<div class="note">
-  <p><strong>Note :</strong> ce rôle ne devrait être utilisé que pour des messages d’alertes associés à des contrôles interactifs. Si une boîte de dialogue d’alerte ne comporte que du contenu statique et qu’elle ne possède absolument aucun contrôle interactif, <code>alertdialog</code> n’est probablement pas le rôle le plus judicieux à utiliser. Le rôle <code>alert</code> est plus adapté pour ce cas (comme décrit dans l’article sur la technique d’<a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_alert">utilisation du rôle <code>alert</code></a>).</p>
-</div>
+> **Note :** ce rôle ne devrait être utilisé que pour des messages d’alertes associés à des contrôles interactifs. Si une boîte de dialogue d’alerte ne comporte que du contenu statique et qu’elle ne possède absolument aucun contrôle interactif, `alertdialog` n’est probablement pas le rôle le plus judicieux à utiliser. Le rôle `alert` est plus adapté pour ce cas (comme décrit dans l’article sur la technique d’[utilisation du rôle `alert`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_alert)).
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<p>Lorsque le rôle <code>alertdialog</code> est utilisé, l’agent utilisateur devrait suivre les étapes suivantes :</p>
+Lorsque le rôle `alertdialog` est utilisé, l’agent utilisateur devrait suivre les étapes suivantes :
 
-<ul>
- <li>Présenter l’élément comme une boîte de dialogue à l’API d’accessibilité du système d’exploitation.</li>
- <li>Déclencher un évènement d’alerte accessible à l’aide l’API d’accessibilité du système d’exploitation si elle le prend en charge.</li>
-</ul>
+- Présenter l’élément comme une boîte de dialogue à l’API d’accessibilité du système d’exploitation.
+- Déclencher un évènement d’alerte accessible à l’aide l’API d’accessibilité du système d’exploitation si elle le prend en charge.
 
-<p>Lorsque la boîte de dialogue de l’alerte apparaît, les lecteurs d’écran devraient annoncer l’alerte.</p>
+Lorsque la boîte de dialogue de l’alerte apparaît, les lecteurs d’écran devraient annoncer l’alerte.
 
-<p>Lorsque la boîte de dialogue est correctement labélisée et que le focus se place sur un contrôle qu’elle contient, les lecteurs d’écran devraient annoncer le rôle accessible de la boîte de dialogue, son nom et éventuellement sa description, avant d’annoncer l’élément qui a reçu le focus.</p>
+Lorsque la boîte de dialogue est correctement labélisée et que le focus se place sur un contrôle qu’elle contient, les lecteurs d’écran devraient annoncer le rôle accessible de la boîte de dialogue, son nom et éventuellement sa description, avant d’annoncer l’élément qui a reçu le focus.
 
-<div class="note">
-  <p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p>
-</div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<h3 id="Exemples">Exemples</h3>
+### Exemples
 
-<h4 id="Exemple_1_Une_boîte_de_dialogue_d’alerte">Exemple 1 : Une boîte de dialogue d’alerte</h4>
+#### Exemple 1 : Une boîte de dialogue d’alerte
 
-<p>L’extrait de code ci-dessous présente la façon de baliser une boîte de dialogue d’alerte qui ne contient qu’un message et un bouton <code>OK</code>.</p>
+L’extrait de code ci-dessous présente la façon de baliser une boîte de dialogue d’alerte qui ne contient qu’un message et un bouton `OK`.
 
-<pre class="brush: html">&lt;div role="alertdialog" aria-labelledby="dialog1Titre" aria-describedby="dialog1Desc"&gt;
-  &lt;div role="document" tabindex="0"&gt;
-    &lt;h2 id="dialog1Titre"&gt;Votre session est sur le point d’expirer&lt;/h2&gt;
-    &lt;p id="dialog1Desc"&gt;Pour prolonger votre session, cliquez sur le bouton OK&lt;/p&gt;
-    &lt;button&gt;OK&lt;/button&gt;
-  &lt;/div&gt;
-&lt;/div&gt;</pre>
+```html
+<div role="alertdialog" aria-labelledby="dialog1Titre" aria-describedby="dialog1Desc">
+  <div role="document" tabindex="0">
+    <h2 id="dialog1Titre">Votre session est sur le point d’expirer</h2>
+    <p id="dialog1Desc">Pour prolonger votre session, cliquez sur le bouton OK</p>
+    <button>OK</button>
+  </div>
+</div>
+```
 
-<h4 id="Exemples_concrets">Exemples concrets :</h4>
+#### Exemples concrets :
 
-<p>À définir</p>
+À définir
 
-<h3 id="Notes">Notes</h3>
+### Notes
 
-<h3 id="Attributs_ARIA_utilisés">Attributs ARIA utilisés</h3>
+### Attributs ARIA utilisés
 
-<ul>
- <li><a href="http://www.w3.org/TR/wai-aria/roles#dialog">alertdialog</a> ;</li>
- <li><a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-labelledby">aria-labelledby</a> ;</li>
- <li><a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-describedby">aria-describedby</a>.</li>
-</ul>
+- [alertdialog](http://www.w3.org/TR/wai-aria/roles#dialog) ;
+- [aria-labelledby](http://www.w3.org/TR/wai-aria/states_and_properties#aria-labelledby) ;
+- [aria-describedby](http://www.w3.org/TR/wai-aria/states_and_properties#aria-describedby).
 
-<h3 id="Techniques_ARIA_connexes">Techniques ARIA connexes</h3>
+### Techniques ARIA connexes
 
-<ul>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_dialog">Utiliser le rôle <code>dialog</code></a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_alert">Utiliser le rôle <code>alert</code></a>.</li>
-</ul>
+- [Utiliser le rôle `dialog`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_dialog) ;
+- [Utiliser le rôle `alert`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_alert).
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-describedby_attribute/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-describedby_attribute/index.md
index 5a2a646678..20d9ded8d0 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-describedby_attribute/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-describedby_attribute/index.md
@@ -8,78 +8,70 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-describedby
 ---
-<p>L'attribut <a href="https://www.w3.org/TR/wai-aria/#aria-describedby"><code>aria-describedby</code></a> est utilisé pour indiquer les identifiants des éléments qui décrivent l'objet. Il est utilisé pour établir une relation entre des composants ou des groupes et un texte les décrivant. Il est similaire à <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute">aria-labelledby</a> où un label décrit la nature d'un objet, tandis qu'une description fournit plus d'informations pouvant être utiles à l'utilisateur.</p>
+L'attribut [`aria-describedby`](https://www.w3.org/TR/wai-aria/#aria-describedby) est utilisé pour indiquer les identifiants des éléments qui décrivent l'objet. Il est utilisé pour établir une relation entre des composants ou des groupes et un texte les décrivant. Il est similaire à [aria-labelledby](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute) où un label décrit la nature d'un objet, tandis qu'une description fournit plus d'informations pouvant être utiles à l'utilisateur.
 
-<p>L'attribut <code>aria-describedby</code> n'est pas uniquement utilisé pour des éléments de formulaire ; il peut également être utilisé pour associer un texte statique avec des composants graphiques, des groupes d'éléments, des panneaux, des zones possédant un titre, des définitions, etc. La section <a href="#examples">Exemples</a> ci-dessous fournit plus d'informations sur l'utilisation de cet attribut dans ces cas précis.</p>
+L'attribut `aria-describedby` n'est pas uniquement utilisé pour des éléments de formulaire ; il peut également être utilisé pour associer un texte statique avec des composants graphiques, des groupes d'éléments, des panneaux, des zones possédant un titre, des définitions, etc. La section [Exemples](#examples) ci-dessous fournit plus d'informations sur l'utilisation de cet attribut dans ces cas précis.
 
-<p>Cet attribut peut être utilisé avec n'importe quel élément de formulaire HTML ; il n'est pas limité aux éléments auxquels un rôle ARIA a été assigné.</p>
+Cet attribut peut être utilisé avec n'importe quel élément de formulaire HTML ; il n'est pas limité aux éléments auxquels un rôle ARIA a été assigné.
 
-<h2 id="value">Valeur</h2>
+## Valeur
 
-<p>La valeur de cet attribut est une liste d'identifiants d'éléments, séparés par des espaces</p>
+La valeur de cet attribut est une liste d'identifiants d'éléments, séparés par des espaces
 
-<h2 id="possible_effects_on_user_agents_and_assistive_technology">Effets possibles sur les agents utilisateurs et les technologies d'assistance</h2>
+## Effets possibles sur les agents utilisateurs et les technologies d'assistance
 
-<div class="note">
-  <p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d'assistance devraient traiter cette technique. L'information fournie ci-dessus est l'une de ces opinions et n'est pas normative.</p>
-</div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d'assistance devraient traiter cette technique. L'information fournie ci-dessus est l'une de ces opinions et n'est pas normative.
 
-<h2 id="examples">Exemples</h2>
+## Exemples
 
-<h3 id="example_1_application_landmark_descriptions">Exemple 1 : Descriptions des points de repère (landmarks) d'une application</h3>
+### Exemple 1 : Descriptions des points de repère (landmarks) d'une application
 
-<p>Dans l'exemple ci-dessous, un paragraphe d'introduction décrit une application de calendrier. <code>aria-describedby</code> est utilisé pour associer le paragraphe avec le conteneur de l'application.</p>
+Dans l'exemple ci-dessous, un paragraphe d'introduction décrit une application de calendrier. `aria-describedby` est utilisé pour associer le paragraphe avec le conteneur de l'application.
 
-<pre class="brush: html">
-&lt;div role="applicaton" aria-labelledby="calendar" aria-describedby="info"&gt;
-    &lt;h1 id="calendar"&gt;Calendrier&lt;h1&gt;
-    &lt;p id="info"&gt;
+```html
+<div role="applicaton" aria-labelledby="calendar" aria-describedby="info">
+    <h1 id="calendar">Calendrier<h1>
+    <p id="info">
         Ce calendrier affiche les prévisions de match du Racing Métro.
-    &lt;/p&gt;
-    &lt;div role="grid"&gt;
+    </p>
+    <div role="grid">
         …
-    &lt;/div&gt;
-&lt;/div&gt;
-</pre>
+    </div>
+</div>
+```
 
-<h3 id="example_2_a_close_button">Exemple 2 : Un bouton de fermeture</h3>
+### Exemple 2 : Un bouton de fermeture
 
-<p>Dans l'exemple ci-dessous, un lien qui fonctionne comme le bouton <code>Fermer</code> d'une boîte de dialogue est décrit ailleurs dans le document. L'attribut <code>aria-describedby</code> est utilisé pour associer la description au lien.</p>
+Dans l'exemple ci-dessous, un lien qui fonctionne comme le bouton `Fermer` d'une boîte de dialogue est décrit ailleurs dans le document. L'attribut `aria-describedby` est utilisé pour associer la description au lien.
 
-<pre class="brush: html">
-&lt;button aria-label="Fermer" aria-describedby="descriptionClose"
-    onclick="myDialog.close()"&gt;X&lt;/button&gt;
+```html
+<button aria-label="Fermer" aria-describedby="descriptionClose"
+    onclick="myDialog.close()">X</button>
 …
 
-&lt;div id="descriptionClose"&gt;
+<div id="descriptionClose">
   La fermeture de cette fenêtre entraînera la perte des
   informations saisies et vous renverra vers la page
   principale.
-&lt;/div&gt;
-</pre>
+</div>
+```
 
-<h2 id="notes">Notes</h2>
+## Notes
 
-<ul>
- <li>L'attribut <code>aria-describedby</code> n'est pas destiné à référencer les descriptions d'une ressource externe. Comme il s'agit d'un identifiant, il doit référencer un élément du DOM du document courant.</li>
-</ul>
+- L'attribut `aria-describedby` n'est pas destiné à référencer les descriptions d'une ressource externe. Comme il s'agit d'un identifiant, il doit référencer un élément du DOM du document courant.
 
-<h2 id="used_by_aria_roles">Utilisé par les rôles ARIA</h2>
+## Utilisé par les rôles ARIA
 
-<p>Tous les éléments de balisage de base.</p>
+Tous les éléments de balisage de base.
 
-<h2 id="related_aria_techniques">Techniques ARIA connexes</h2>
+## Techniques ARIA connexes
 
-<ul>
- <li><a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute">Utiliser l'attribut <code>aria-labelledby</code></a></li>
-</ul>
+- [Utiliser l'attribut `aria-labelledby`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute)
 
-<h2 id="compatibility">Compatibilité</h2>
+## Compatibilité
 
-<p>À faire : ajouter les informations de prise en charge pour les combinaisons les plus courantes d'agents utilisateurs et de produits de technologies d'assistance.</p>
+À faire : ajouter les informations de prise en charge pour les combinaisons les plus courantes d'agents utilisateurs et de produits de technologies d'assistance.
 
-<h2 id="additional_resources">Autres ressources</h2>
+## Autres ressources
 
-<ul>
- <li><a href="https://www.w3.org/TR/wai-aria/states_and_properties#aria-describedby">Spécification WAI-ARIA de <code>aria-describedby</code></a></li>
-</ul>
+- [Spécification WAI-ARIA de `aria-describedby`](https://www.w3.org/TR/wai-aria/states_and_properties#aria-describedby)
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-invalid_attribute/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-invalid_attribute/index.md
index c75af66bb9..ff0906e7fa 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-invalid_attribute/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-invalid_attribute/index.md
@@ -8,59 +8,57 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-invalid_attribute
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-invalid
 ---
-<h3 id="Description">Description</h3>
+### Description
 
-<p>Cette technique présente l’utilisation de l’attribut <a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-invalid"><code>aria-invalid</code></a>.</p>
+Cette technique présente l’utilisation de l’attribut [`aria-invalid`](http://www.w3.org/TR/wai-aria/states_and_properties#aria-invalid).
 
-<p>L’attribut <code>aria-invalid</code> est utilisé pour indiquer que la valeur saisie dans un champ de saisie n’est pas conforme au format attendu par l’application. Cela comprend les formats tels que les adresses électroniques ou les numéros de téléphone. <code>aria-invalid</code> peut également être utilisé pour indiquer qu’un champ obligatoire n’a pas été rempli. L’attribut devrait être programmatiquement défini comme étant le résultat du processus de validation.</p>
+L’attribut `aria-invalid` est utilisé pour indiquer que la valeur saisie dans un champ de saisie n’est pas conforme au format attendu par l’application. Cela comprend les formats tels que les adresses électroniques ou les numéros de téléphone. `aria-invalid` peut également être utilisé pour indiquer qu’un champ obligatoire n’a pas été rempli. L’attribut devrait être programmatiquement défini comme étant le résultat du processus de validation.
 
-<p>Cet attribut peut être utilisé avec n’importe quel élément de formulaire HTML typique ; il n’est pas limité aux éléments auxquels a été assigné un <code>rôle</code> ARIA.</p>
+Cet attribut peut être utilisé avec n’importe quel élément de formulaire HTML typique ; il n’est pas limité aux éléments auxquels a été assigné un `rôle` ARIA.
 
-<h3 id="Valeurs">Valeurs</h3>
+### Valeurs
 
-<h4 id="Vocabulaire">Vocabulaire</h4>
+#### Vocabulaire
 
-<dl>
- <dt><code>false</code> (défaut)</dt>
- <dd>Aucune erreur détectée</dd>
- <dt><code>grammar</code></dt>
- <dd>Une faute de grammaire a été détectée.</dd>
- <dt><code>spelling</code></dt>
- <dd>Une faute d’orthographe a été détectée.</dd>
- <dt><code>true</code></dt>
- <dd>La valeur n’a pas passé la validation.</dd>
-</dl>
+- `false` (défaut)
+  - : Aucune erreur détectée
+- `grammar`
+  - : Une faute de grammaire a été détectée.
+- `spelling`
+  - : Une faute d’orthographe a été détectée.
+- `true`
+  - : La valeur n’a pas passé la validation.
 
-<p>Toute valeur absente de ce vocabulaire devrait être traitée comme <code>true</code>.</p>
+Toute valeur absente de ce vocabulaire devrait être traitée comme `true`.
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<p>Les agents utilisateurs devraient informer l’utilisateur lorsqu’un champ n’est pas valide. Les développeurs d’applications devraient fournir des suggestions pour la correction du problème, lorsque c’est possible. Les auteurs devraient empêcher la soumission de formulaires contenant des erreurs.</p>
+Les agents utilisateurs devraient informer l’utilisateur lorsqu’un champ n’est pas valide. Les développeurs d’applications devraient fournir des suggestions pour la correction du problème, lorsque c’est possible. Les auteurs devraient empêcher la soumission de formulaires contenant des erreurs.
 
-<div class="note">
-  <p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournit ci-dessus est l’une de ces opinions et n’est pas normative.</p>
-</div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournit ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<h3 id="Exemples">Exemples</h3>
+### Exemples
 
-<h4 id="Exemple_1_validation_d’un_formulaire_de_base">Exemple 1 : validation d’un formulaire de base</h4>
+#### Exemple 1 : validation d’un formulaire de base
 
-<p>L’extrait de code suivant décrit une version simplifiée de deux champs de formulaire avec une fonction de validation de la saisie attachée à la perte de focus. Notez que la valeur par défaut de <code>aria-required</code> étant <code>false</code>, il n’est pas strictement nécessaire d’ajouter à entrer.</p>
+L’extrait de code suivant décrit une version simplifiée de deux champs de formulaire avec une fonction de validation de la saisie attachée à la perte de focus. Notez que la valeur par défaut de `aria-required` étant `false`, il n’est pas strictement nécessaire d’ajouter à entrer.
 
-<pre class="brush: html">&lt;input name="nom" id="nom" aria-required="true" aria-invalid="false"
-        onblur="checkValidity('nom', ' ', 'Le nom saisi n’est pas valide (vous devez saisir un nom et un prénom)');"/&gt;
-&lt;br /&gt;
-&lt;input name="courriel" id="courriel" aria-required="true" aria-invalid="false"
-        onblur="checkValidity('courriel', '@', 'L’adresse électronique saisie n’est pas valide');"/&gt;
-</pre>
+```html
+<input name="nom" id="nom" aria-required="true" aria-invalid="false"
+        onblur="checkValidity('nom', ' ', 'Le nom saisi n’est pas valide (vous devez saisir un nom et un prénom)');"/>
+<br />
+<input name="courriel" id="courriel" aria-required="true" aria-invalid="false"
+        onblur="checkValidity('courriel', '@', 'L’adresse électronique saisie n’est pas valide');"/>
+```
 
-<p>Remarquez qu’il n’est pas nécessaire de valider les champs de saisie immédiatement à la perte de focus ; l’application peut attendre jusqu’à la soumission du formulaire (bien que ce ne soit pas particulièrement recommandé).</p>
+Remarquez qu’il n’est pas nécessaire de valider les champs de saisie immédiatement à la perte de focus ; l’application peut attendre jusqu’à la soumission du formulaire (bien que ce ne soit pas particulièrement recommandé).
 
-<p>L’extrait de code ci-dessous décrit une fonction de validation très simple qui ne vérifie que la présence d’un caractère particulier (en réalité, la validation sera un peu plus sophistiquée) :</p>
+L’extrait de code ci-dessous décrit une fonction de validation très simple qui ne vérifie que la présence d’un caractère particulier (en réalité, la validation sera un peu plus sophistiquée) :
 
-<pre class="brush: js">function checkValidity(aID, aSearchTerm, aMsg){
+```js
+function checkValidity(aID, aSearchTerm, aMsg){
     var elem = document.getElementById(aID);
-    var invalid = (elem.value.indexOf(aSearchTerm) &lt; 0);
+    var invalid = (elem.value.indexOf(aSearchTerm) < 0);
     if (invalid) {
       elem.setAttribute("aria-invalid", "true");
       updateAlert(aMsg);
@@ -69,11 +67,12 @@ original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-inva
       updateAlert();
     }
 }
-</pre>
+```
 
-<p>L’extrait de code ci-dessous décrit des fonctions d’alertes, qui ajoutent (ou suppriment) le message d’erreur :</p>
+L’extrait de code ci-dessous décrit des fonctions d’alertes, qui ajoutent (ou suppriment) le message d’erreur :
 
-<pre class="brush: js">function updateAlert(msg) {
+```js
+function updateAlert(msg) {
     var oldAlert = document.getElementById("alert");
     if (oldAlert) {
         document.body.removeChild(oldAlert);
@@ -88,31 +87,25 @@ original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-inva
         document.body.appendChild(newAlert);
     }
 }
-</pre>
+```
 
-<p>Remarquez que le <code>rôle</code> ARIA de l’alerte est définit comme étant <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_alert"><code>"alert"</code></a>.</p>
+Remarquez que le `rôle` ARIA de l’alerte est définit comme étant [`"alert"`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_alert).
 
-<h3 id="Notes">Notes</h3>
+### Notes
 
-<ul>
- <li>Lorsque <code>aria-invalid</code> est utilisé en conjonction avec l’attribut <code>aria-required</code>, <code>aria-invalid</code> <strong>ne devrait pas</strong> être défini à <code>true</code> avant la soumission du formulaire – uniquement en réponse à la validation.</li>
- <li>Les développements futurs pourraient ajouter des termes au vocabulaire utilisé pour cet attribut. Toute valeur absente du vocabulaire actuel devrait être traitée comme <code>true</code>.</li>
-</ul>
+- Lorsque `aria-invalid` est utilisé en conjonction avec l’attribut `aria-required`, `aria-invalid` **ne devrait pas** être défini à `true` avant la soumission du formulaire – uniquement en réponse à la validation.
+- Les développements futurs pourraient ajouter des termes au vocabulaire utilisé pour cet attribut. Toute valeur absente du vocabulaire actuel devrait être traitée comme `true`.
 
-<h3 id="Utilisé_dans_les_rôles_ARIA">Utilisé dans les rôles ARIA</h3>
+### Utilisé dans les rôles ARIA
 
-<p>Tous les éléments de balisage de base.</p>
+Tous les éléments de balisage de base.
 
-<h3 id="Techniques_ARIA_connexes">Techniques ARIA connexes</h3>
+### Techniques ARIA connexes
 
-<ul>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-required">Utiliser l’attribut <code>aria-required</code></a></li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_alert">Utiliser le rôle <code>alert</code></a></li>
-</ul>
+- [Utiliser l’attribut `aria-required`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-required)
+- [Utiliser le rôle `alert`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_alert)
 
-<h3 id="Autres_ressources">Autres ressources</h3>
+### Autres ressources
 
-<ul>
- <li><a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-invalid">Spécification WAI-ARIA de la propriété <code>aria-invalid</code></a></li>
- <li><a href="http://www.w3.org/TR/wai-aria-practices/#ariaform">WAI Authoring Practices for forms</a> (Règles WAI de création de formulaires)</li>
-</ul>
+- [Spécification WAI-ARIA de la propriété `aria-invalid`](http://www.w3.org/TR/wai-aria/states_and_properties#aria-invalid)
+- [WAI Authoring Practices for forms](http://www.w3.org/TR/wai-aria-practices/#ariaform) (Règles WAI de création de formulaires)
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-label_attribute/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-label_attribute/index.md
index 54c971151f..2dd44fb491 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-label_attribute/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-label_attribute/index.md
@@ -9,63 +9,58 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-label
 ---
-<p>L’attribut <code>aria-label</code> est utilisé pour définir une légende non-visible associée à un élément HTML dont le sens est transmis uniquement par le visuel. Par exemple, une croix pour fermer une fenêtre modale.</p>
+L’attribut `aria-label` est utilisé pour définir une légende non-visible associée à un élément HTML dont le sens est transmis uniquement par le visuel. Par exemple, une croix pour fermer une fenêtre modale.
 
-<h2 id="Contexte">Contexte</h2>
+## Contexte
 
-<p>Pour la plupart des usagers, le contexte et l'apparence d'un élément suffisent à déterminer son rôle. Par exemple, une croix pour fermer une fenêtre modale ou une icône de hamburger pour ouvrir un menu.</p>
+Pour la plupart des usagers, le contexte et l'apparence d'un élément suffisent à déterminer son rôle. Par exemple, une croix pour fermer une fenêtre modale ou une icône de hamburger pour ouvrir un menu.
 
-<p>En revanche, certains usagers tels que les aveugles et malvoyants ne peuvent pas faire de même. Cet attribut permet aux développeurs d'indiquer une alternative textuelle à ces contrôles visuels, qui sera lue par les technologies d'assistance. En revanche, le contenu de l'attribut <code>aria-label</code> ne sera pas visible pour les autres usagers.</p>
+En revanche, certains usagers tels que les aveugles et malvoyants ne peuvent pas faire de même. Cet attribut permet aux développeurs d'indiquer une alternative textuelle à ces contrôles visuels, qui sera lue par les technologies d'assistance. En revanche, le contenu de l'attribut `aria-label` ne sera pas visible pour les autres usagers.
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<div class="note">
-  <p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p>
-</div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<p>Les lecteurs d'écran lisent le contenu textuel de cet attribut.</p>
+Les lecteurs d'écran lisent le contenu textuel de cet attribut.
 
-<h2 id="Usage">Usage</h2>
+## Usage
 
-<p>L’attribut <code>aria-label</code> ne doit être utilisé que lorsque le texte d’un label <em>n’est pas</em> visible à l’écran. Si le texte du label de l’élément existe et est visible, utilisez plutôt l’attribut <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-labelledby">aria-labelledby</a>.</p>
+L’attribut `aria-label` ne doit être utilisé que lorsque le texte d’un label _n’est pas_ visible à l’écran. Si le texte du label de l’élément existe et est visible, utilisez plutôt l’attribut [aria-labelledby](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-labelledby).
 
-<p>Cet attribut peut être utilisé avec n’importe quel élément HTML. Néanmoins, il n'est pas nécessaire de l'utiliser si l'élément possède déjà un mécanisme pour légender son contenu. Par exemple l'élément <code>&lt;label&gt;</code> pour les éléments de formulaire, ou l'attribut <code>alt</code> pour les images.</p>
+Cet attribut peut être utilisé avec n’importe quel élément HTML. Néanmoins, il n'est pas nécessaire de l'utiliser si l'élément possède déjà un mécanisme pour légender son contenu. Par exemple l'élément `<label>` pour les éléments de formulaire, ou l'attribut `alt` pour les images.
 
-<h3 id="Valeur">Valeur</h3>
+### Valeur
 
-<p>Une légende sous forme de chaîne de caractère.</p>
+Une légende sous forme de chaîne de caractère.
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<h3 id="Un_bouton_sans_contenu_textuel_explicite">Un bouton sans contenu textuel explicite</h3>
+### Un bouton sans contenu textuel explicite
 
-<p>Dans l’exemple ci-dessous, un bouton est stylé pour ressembler à un bouton « <em>Fermer</em> » classique, avec un <code>X</code> en son centre. Comme il n’existe aucune information indiquant que la fonction du bouton est de fermer la boîte de dialogue, l’attribut <code>aria-label</code> est utilisé pour fournir un label aux technologies d’assistance.</p>
+Dans l’exemple ci-dessous, un bouton est stylé pour ressembler à un bouton « *Fermer* » classique, avec un `X` en son centre. Comme il n’existe aucune information indiquant que la fonction du bouton est de fermer la boîte de dialogue, l’attribut `aria-label` est utilisé pour fournir un label aux technologies d’assistance.
 
-<pre class="brush: html"> &lt;button aria-label="Fermer" onclick="myDialog.close()"&gt;X&lt;/button&gt;
-</pre>
+```html
+ <button aria-label="Fermer" onclick="myDialog.close()">X</button>
+```
 
-<h3 id="Un_champ_de_saisie_utilisant_contentEditable">Un champ de saisie utilisant contentEditable</h3>
+### Un champ de saisie utilisant contentEditable
 
-<p>Pour proposer une expérience d'édition plus personnalisée, on pourrait utiliser une <code>div</code> avec l'attribut <code>contenteditable</code> à la place d'un élément de formulaire natif comme <code>&lt;textarea&gt;</code>. Cette situation ne permettrait pas d'associer un <code>&lt;label&gt;</code> à ce champ de saisie. Ainsi on pourrait utiliser <code>aria-label</code> à la place.</p>
+Pour proposer une expérience d'édition plus personnalisée, on pourrait utiliser une `div` avec l'attribut `contenteditable` à la place d'un élément de formulaire natif comme `<textarea>`. Cette situation ne permettrait pas d'associer un `<label>` à ce champ de saisie. Ainsi on pourrait utiliser `aria-label` à la place.
 
-<h2 id="Pour_aller_plus_loin">Pour aller plus loin</h2>
+## Pour aller plus loin
 
-<h3 id="Notes">Notes</h3>
+### Notes
 
-<p>L’affectation d’<em>API accessibilité</em> la plus courante pour un label est la propriété de <em>nom accessible</em>.</p>
+L’affectation d’_API accessibilité_ la plus courante pour un label est la propriété de _nom accessible_.
 
-<h3 id="Utilisé_par_les_rôles_ARIA">Utilisé par les rôles ARIA</h3>
+### Utilisé par les rôles ARIA
 
-<p>Tous les éléments de balisage de base.</p>
+Tous les éléments de balisage de base.
 
-<h3 id="Techniques_ARIA_connexes">Techniques ARIA connexes</h3>
+### Techniques ARIA connexes
 
-<ul>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-labelledby">Utiliser l’attribut <code>aria-labelledby</code></a>.</li>
-</ul>
+- [Utiliser l’attribut `aria-labelledby`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-labelledby).
 
-<h3 id="Autres_ressources">Autres ressources</h3>
+### Autres ressources
 
-<ul>
- <li><a href="https://www.w3.org/TR/wai-aria/#aria-label">Spécification WAI-ARIA pour aria-label</a>.</li>
-</ul>
+- [Spécification WAI-ARIA pour aria-label](https://www.w3.org/TR/wai-aria/#aria-label).
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-labelledby_attribute/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-labelledby_attribute/index.md
index 2602081deb..a7a35af681 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-labelledby_attribute/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-labelledby_attribute/index.md
@@ -8,141 +8,144 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-labelledby
 ---
-<h3 id="Description">Description</h3>
+### Description
 
-<p>Cette technique présente l’utilisation de l’attribut <a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-labelledby"><code>aria-labelledby</code></a>.</p>
+Cette technique présente l’utilisation de l’attribut [`aria-labelledby`](http://www.w3.org/TR/wai-aria/states_and_properties#aria-labelledby).
 
-<p>L’attribut <code>aria-labelledby</code> est utilisé pour indiquer les ID des éléments qui labellisent l’objet. Il est utilisé pour établir une relation entre les composants, ou les groupes, et leurs labels. Les utilisateurs de technologies d’assistance telles que les lecteurs d’écran, naviguent généralement dans un document en tabulant entre les zones de l’écran. Si un label n’est pas associé à un élément de saisie, un composant ou un groupe, il ne sera pas lu par le lecteur d’écran.</p>
+L’attribut `aria-labelledby` est utilisé pour indiquer les ID des éléments qui labellisent l’objet. Il est utilisé pour établir une relation entre les composants, ou les groupes, et leurs labels. Les utilisateurs de technologies d’assistance telles que les lecteurs d’écran, naviguent généralement dans un document en tabulant entre les zones de l’écran. Si un label n’est pas associé à un élément de saisie, un composant ou un groupe, il ne sera pas lu par le lecteur d’écran.
 
-<p><code>aria-labelledby</code> est très similaire à l’attribut <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-describedby">aria-describedby</a> : un label décrit la nature d’un objet, alors qu’une description fournit plus d’informations pouvant être utiles à l’utilisateur.</p>
+`aria-labelledby` est très similaire à l’attribut [aria-describedby](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-describedby) : un label décrit la nature d’un objet, alors qu’une description fournit plus d’informations pouvant être utiles à l’utilisateur.
 
-<p>L’attribut <code>aria-labelledby</code> n’est pas uniquement utilisé avec les éléments de formulaire ; il peut également être utilisé pour associer un texte statique avec des composants, des groupes d’éléments, des panneaux, des zones possédant un titre, des définitions, etc. La section {{ anch("Exemples") }} ci-dessous fournit plus d’informations sur l’utilisation de cet attribut dans ces cas précis.</p>
+L’attribut `aria-labelledby` n’est pas uniquement utilisé avec les éléments de formulaire ; il peut également être utilisé pour associer un texte statique avec des composants, des groupes d’éléments, des panneaux, des zones possédant un titre, des définitions, etc. La section {{ anch("Exemples") }} ci-dessous fournit plus d’informations sur l’utilisation de cet attribut dans ces cas précis.
 
-<p>L’attribut <code>aria-labelledby</code> peut être utilisé en conjonction avec l’élément {{ HTMLElement("label") }} (à l’aide de l’attribut <code>for</code>) pour améliorer la compatibilité avec les agents utilisateurs qui ne prennent pas encore en charge ARIA.</p>
+L’attribut `aria-labelledby` peut être utilisé en conjonction avec l’élément {{ HTMLElement("label") }} (à l’aide de l’attribut `for`) pour améliorer la compatibilité avec les agents utilisateurs qui ne prennent pas encore en charge ARIA.
 
-<p>Cet attribut peut être utilisé avec n’importe quel élément caractéristique de formulaire HTML ; il n’est pas limité aux éléments auxquels un rôle ARIA a été assigné.</p>
+Cet attribut peut être utilisé avec n’importe quel élément caractéristique de formulaire HTML ; il n’est pas limité aux éléments auxquels un rôle ARIA a été assigné.
 
-<h3 id="Valeurs">Valeurs</h3>
+### Valeurs
 
-<p>Une liste d’ID d’éléments séparés par des espaces</p>
+Une liste d’ID d’éléments séparés par des espaces
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<p>Lorsque les deux attributs <code>aria-labelledby</code> et <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_aria-label_attribute"><code>aria-label</code></a> sont utilisés, les agents utilisateurs donnent la priorité à <code>aria-labelledby</code> lors du calcul de la propriété de nom accessible.</p>
+Lorsque les deux attributs `aria-labelledby` et [`aria-label`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_aria-label_attribute) sont utilisés, les agents utilisateurs donnent la priorité à `aria-labelledby` lors du calcul de la propriété de nom accessible.
 
-<h3 id="Exemples">Exemples</h3>
+### Exemples
 
-<h4 id="Exemple_1_Labels_multiples">Exemple 1 : Labels multiples</h4>
+#### Exemple 1 : Labels multiples
 
-<p>Dans l’exemple ci-dessous, chaque champ de saisie est labellisé à la fois avec son propre label individuel et avec le label pour le groupe :</p>
+Dans l’exemple ci-dessous, chaque champ de saisie est labellisé à la fois avec son propre label individuel et avec le label pour le groupe :
 
-<pre class="brush: html">&lt;div id="facturation"&gt;Facturation&lt;/div&gt;
+```html
+<div id="facturation">Facturation</div>
 
-&lt;div&gt;
-  &lt;div id="nom"&gt;Nom&lt;/div&gt;
+<div>
+  <div id="nom">Nom</div>
 
-  &lt;input type="text" aria-labelledby="nom facturation"/&gt;
-&lt;/div&gt;
+  <input type="text" aria-labelledby="nom facturation"/>
+</div>
 
-&lt;div&gt;
-  &lt;div id="adresse"&gt;Adresse&lt;/div&gt;
+<div>
+  <div id="adresse">Adresse</div>
 
-  &lt;input type="text" aria-labelledby="adresse facturation"/&gt;
-&lt;/div&gt;
-</pre>
+  <input type="text" aria-labelledby="adresse facturation"/>
+</div>
+```
 
-<h4 id="Exemple_2_Association_de_titres_et_de_zones">Exemple 2 : Association de titres et de zones</h4>
+#### Exemple 2 : Association de titres et de zones
 
-<p>Dans l’exemple ci-dessous, les éléments d’en-têtes sont associés avec les contenus dont ils sont les intitulés. Notez que la zone référencée est celle qui <em>contient</em> l’en-tête.</p>
+Dans l’exemple ci-dessous, les éléments d’en-têtes sont associés avec les contenus dont ils sont les intitulés. Notez que la zone référencée est celle qui _contient_ l’en-tête.
 
-<pre class="brush: html">&lt;div role="main" aria-labelledby="foo"&gt;
-  &lt;h1 id="foo"&gt;Le feu devenu incontrôlable gagne les abords d’Aubagne&lt;/h1&gt;
+```html
+<div role="main" aria-labelledby="foo">
+  <h1 id="foo">Le feu devenu incontrôlable gagne les abords d’Aubagne</h1>
   Un fort mistral a propagé le feu de forêt qui s’est déclaré ce lundi soir suite aux fortes températures de ces derniers jours…
-&lt;/div&gt;
-</pre>
+</div>
+```
 
-<h4 id="Exemple_3_Groupes_de_boutons_radio">Exemple 3 : Groupes de boutons radio</h4>
+#### Exemple 3 : Groupes de boutons radio
 
-<p>Dans l’exemple ci-dessous, le conteneur d’un <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_radiogroup">radiogroup</a> est associé avec son label à l’aide de l’attribut <code>aria-labelledby</code> :</p>
+Dans l’exemple ci-dessous, le conteneur d’un [radiogroup](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_radiogroup) est associé avec son label à l’aide de l’attribut `aria-labelledby` :
 
-<pre class="brush: html">&lt;div id="radio_label"&gt;My radio label&lt;/div&gt;
+```html
+<div id="radio_label">My radio label</div>
 
-&lt;ul role="radiogroup" aria-labelledby="radio_label"&gt;
-  &lt;li role="radio"&gt;Élément №1&lt;/li&gt;
-  &lt;li role="radio"&gt;Élément №2&lt;/li&gt;
-  &lt;li role="radio"&gt;Élément №3&lt;/li&gt;
-&lt;/ul&gt;
-</pre>
+<ul role="radiogroup" aria-labelledby="radio_label">
+  <li role="radio">Élément №1</li>
+  <li role="radio">Élément №2</li>
+  <li role="radio">Élément №3</li>
+</ul>
+```
 
-<h4 id="Exemple_4_Titre_de_boite_de_dialogue">Exemple 4 : Titre de boite de dialogue</h4>
+#### Exemple 4 : Titre de boite de dialogue
 
-<p>Dans l’exemple ci-dessous, l’élément d’en-tête qui labellise la boite de dialogue y est relié par l’attribut <code>aria-labelledby</code> :</p>
+Dans l’exemple ci-dessous, l’élément d’en-tête qui labellise la boite de dialogue y est relié par l’attribut `aria-labelledby` :
 
-<pre class="brush: html">&lt;div role="dialog" aria-labelledby="titreDialogue"&gt;
-  &lt;h2 id="titreDialogue"&gt;Choisir un fichier&lt;/h2&gt;
+```html
+<div role="dialog" aria-labelledby="titreDialogue">
+  <h2 id="titreDialogue">Choisir un fichier</h2>
   … Contenus de la boîte de dialogue
-&lt;/div&gt;
-</pre>
+</div>
+```
 
-<h4 id="Exemple_5_Définition_intégrée">Exemple 5 : Définition intégrée</h4>
+#### Exemple 5 : Définition intégrée
 
-<p>Dans l’exemple ci-dessous, la définition d’un terme qui est décrit dans le flux naturel de la narration, est associée au terme lui-même à l’aide de l’attribut <strong>aria-labelledby</strong>:</p>
+Dans l’exemple ci-dessous, la définition d’un terme qui est décrit dans le flux naturel de la narration, est associée au terme lui-même à l’aide de l’attribut **aria-labelledby**:
 
-<pre class="brush: html">&lt;p&gt;Le docteur expliqua que c’était un &lt;dfn id="placebo"&gt;placebo&lt;/dfn&gt;, &lt;span role="definition" aria-labelledby="placebo"&gt; ou
-une préparation inerte prescrite plus pour le soulagement mental du patient que ses effets possible sur une pathologie.&lt;/span&gt;
-&lt;/p&gt;
-</pre>
+```html
+<p>Le docteur expliqua que c’était un <dfn id="placebo">placebo</dfn>, <span role="definition" aria-labelledby="placebo"> ou
+une préparation inerte prescrite plus pour le soulagement mental du patient que ses effets possible sur une pathologie.</span>
+</p>
+```
 
-<h4 id="Exemple_6_Listes_de_définitions">Exemple 6 : Listes de définitions</h4>
+#### Exemple 6 : Listes de définitions
 
-<p>Dans l’exemple ci-dessous, les définitions sont associées avec les termes qu’elles définissent à l’aide de l’attribut <code>aria-labelledby</code> :</p>
+Dans l’exemple ci-dessous, les définitions sont associées avec les termes qu’elles définissent à l’aide de l’attribut `aria-labelledby` :
 
-<pre class="brush: html">&lt;dl&gt;
-  &lt;dt id="anatheme"&gt;anathème&lt;/dt&gt;
-    &lt;dd role="definition" aria-labelledby="anatheme"&gt;une interdiction ou une condamnation prononcée par une autorité ecclésiastique
-                                         et accompagnée de l’excommunication&lt;/dd&gt;
-    &lt;dd role="definition" aria-labelledby="anatheme"&gt;une dénonciation vigoureuse&amp;nbsp;: condamnation&lt;/dd&gt;
+```html
+<dl>
+  <dt id="anatheme">anathème</dt>
+    <dd role="definition" aria-labelledby="anatheme">une interdiction ou une condamnation prononcée par une autorité ecclésiastique
+                                         et accompagnée de l’excommunication</dd>
+    <dd role="definition" aria-labelledby="anatheme">une dénonciation vigoureuse&nbsp;: condamnation</dd>
 
-  &lt;dt id="homelie"&gt;homélie&lt;/dt&gt;
-    &lt;dd role="definition" aria-labelledby="homelie"&gt;généralement un sermon court&lt;/dd&gt;
-    &lt;dd role="definition" aria-labelledby="homelie"&gt;une lecture ou un discours sur un thème moral&lt;/dd&gt;
+  <dt id="homelie">homélie</dt>
+    <dd role="definition" aria-labelledby="homelie">généralement un sermon court</dd>
+    <dd role="definition" aria-labelledby="homelie">une lecture ou un discours sur un thème moral</dd>
 
-&lt;/dl&gt;
-</pre>
+</dl>
+```
 
-<h4 id="Exemple_7_Menus">Exemple 7 : Menus</h4>
+#### Exemple 7 : Menus
 
-<p>Dans l’exemple ci-dessous, un <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-haspopup">menu contextuel</a> est associé avec son label à l’aide de l’attribut <code>aria-labelledby</code> :</p>
+Dans l’exemple ci-dessous, un [menu contextuel](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-haspopup) est associé avec son label à l’aide de l’attribut `aria-labelledby` :
 
-<pre class="brush: html">&lt;div role="menubar"&gt;
-  &lt;div role="menuitem" aria-haspopup="true" id="fichierMenu"&gt;Fichier&lt;/div&gt;
-  &lt;div role="menu" aria-labelledby="fichierMenu"&gt;
-    &lt;div role="menuitem"&gt;Ouvrir&lt;/div&gt;
-    &lt;div role="menuitem"&gt;Enregistrer&lt;/div&gt;
-    &lt;div role="menuitem"&gt;Enregistrer sous…&lt;/div&gt;
+```html
+<div role="menubar">
+  <div role="menuitem" aria-haspopup="true" id="fichierMenu">Fichier</div>
+  <div role="menu" aria-labelledby="fichierMenu">
+    <div role="menuitem">Ouvrir</div>
+    <div role="menuitem">Enregistrer</div>
+    <div role="menuitem">Enregistrer sous…</div>
     …
-  &lt;/div&gt;
+  </div>
 …
-&lt;/div&gt;
-</pre>
+</div>
+```
 
-<h3 id="Notes">Notes</h3>
+### Notes
 
-<p>L’affectation d’<em>API accessibilité</em> la plus courante pour un label est la propriété de <em>nom accessible</em>.</p>
+L’affectation d’_API accessibilité_ la plus courante pour un label est la propriété de _nom accessible_.
 
-<h3 id="Utilisé_par_les_rôles_ARIA">Utilisé par les rôles ARIA</h3>
+### Utilisé par les rôles ARIA
 
-<p>Tous les éléments de balisage de base.</p>
+Tous les éléments de balisage de base.
 
-<h3 id="Techniques_ARIA_connexes">Techniques ARIA connexes</h3>
+### Techniques ARIA connexes
 
-<ul>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-label">Utiliser l’attribut <code>aria-label</code></a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-describedby">Utiliser l’attribut <code>aria-describedby</code></a>.</li>
-</ul>
+- [Utiliser l’attribut `aria-label`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-label) ;
+- [Utiliser l’attribut `aria-describedby`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-describedby).
 
-<h3 id="Autres_ressources">Autres ressources</h3>
+### Autres ressources
 
-<ul>
- <li><a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-labelledby">Spécification WAI-ARIA pour aria-labelledby</a>.</li>
-</ul>
+- [Spécification WAI-ARIA pour aria-labelledby](http://www.w3.org/TR/wai-aria/states_and_properties#aria-labelledby).
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-orientation_attribute/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-orientation_attribute/index.md
index e5ef3e789c..b69d64990b 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-orientation_attribute/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-orientation_attribute/index.md
@@ -8,55 +8,50 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-orientation_attribute
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-orientation
 ---
-<h3 id="Description">Description</h3>
+### Description
 
-<p>Cette technique présente l’utilisation de l’attribut <a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-orientation">aria-orientation</a>.</p>
+Cette technique présente l’utilisation de l’attribut [aria-orientation](http://www.w3.org/TR/wai-aria/states_and_properties#aria-orientation).
 
-<p>L’attribut <code>aria-orientation</code> est utilisé pour indiquer si un élément est orienté verticalement ou horizontalement.</p>
+L’attribut `aria-orientation` est utilisé pour indiquer si un élément est orienté verticalement ou horizontalement.
 
-<h3 id="Valeurs">Valeurs</h3>
+### Valeurs
 
-<p>Vocabulaire</p>
+Vocabulaire
 
-<dl>
- <dt>vertical</dt>
- <dd>L’élément est orienté verticalement.</dd>
- <dt>horizontal (défaut)</dt>
- <dd>L’élément est orienté horizontalement.</dd>
-</dl>
+- vertical
+  - : L’élément est orienté verticalement.
+- horizontal (défaut)
+  - : L’élément est orienté horizontalement.
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<div class="note"><p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p></div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<h3 id="Exemples">Exemples</h3>
+### Exemples
 
-<h4 id="Exemple_1">Exemple 1 :</h4>
+#### Exemple 1 :
 
-<p>L’extrait de code ci-dessous présente un curseur simple orienté verticalement.</p>
+L’extrait de code ci-dessous présente un curseur simple orienté verticalement.
 
-<pre class="brush: html">&lt;a href="#" id="handle_zoomSlider"
+```html
+<a href="#" id="handle_zoomSlider"
   role="slider"
   aria-orientation="vertical"
   aria-valuemin="0"
   aria-valuemax="17"
-  aria-valuenow="14" &gt;
-    &lt;span&gt;11&lt;/span&gt;
-&lt;/a&gt;
-</pre>
+  aria-valuenow="14" >
+    <span>11</span>
+</a>
+```
 
-<h3 id="Notes">Notes</h3>
+### Notes
 
-<h3 id="Utilisé_avec_les_rôles_ARIA">Utilisé avec les rôles ARIA</h3>
+### Utilisé avec les rôles ARIA
 
-<ul>
- <li>scrollbar ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_slider_role">slider</a> ;</li>
- <li>separator.</li>
-</ul>
+- scrollbar ;
+- [slider](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_slider_role) ;
+- separator.
 
-<h3 id="Autres_ressources">Autres ressources</h3>
+### Autres ressources
 
-<ul>
- <li><a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-orientation">Spécification WAI-ARIA pour l’attribut <code>aria-orientation</code></a>.</li>
-</ul>
+- [Spécification WAI-ARIA pour l’attribut `aria-orientation`](http://www.w3.org/TR/wai-aria/states_and_properties#aria-orientation).
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-relevant_attribute/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-relevant_attribute/index.md
index 8cc57e6365..f29b625d53 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-relevant_attribute/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-relevant_attribute/index.md
@@ -7,25 +7,21 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-relevant_attribute
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-relevant
 ---
-<p>L’attribut <a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-relevant">aria-relevant</a> est une valeur optionnelle utilisée pour décrire quels types de modifications ont été apportés à une région <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Live_Regions"><code>aria-live</code></a>, ainsi que ceux qui sont pertinents et doivent être annoncés. Toute modification jugée comme non pertinente se comporte de la même manière que si l’attribut <code>aria-live</code> n’était pas activé.</p>
+L’attribut [aria-relevant](http://www.w3.org/TR/wai-aria/states_and_properties#aria-relevant) est une valeur optionnelle utilisée pour décrire quels types de modifications ont été apportés à une région [`aria-live`](/fr/docs/Web/Accessibility/ARIA/ARIA_Live_Regions), ainsi que ceux qui sont pertinents et doivent être annoncés. Toute modification jugée comme non pertinente se comporte de la même manière que si l’attribut `aria-live` n’était pas activé.
 
-<p>L’attribut aria-relevant est habituellement utilisé lorsque le contenu d’une page web peut être mis à jour alors que la page est affichée.</p>
+L’attribut aria-relevant est habituellement utilisé lorsque le contenu d’une page web peut être mis à jour alors que la page est affichée.
 
-<h3 id="Valeurs">Valeurs</h3>
+### Valeurs
 
-<p>Une liste délimitée par des espaces avec une ou plusieurs des valeurs suivantes :</p>
+Une liste délimitée par des espaces avec une ou plusieurs des valeurs suivantes :
 
-<ul>
- <li>« additions » L’insertion de noeuds au sein de la région live doit être considérée comme pertinente</li>
- <li>« removals » La suppression de noeuds doit être considérée comme pertinente</li>
- <li>« text » Des changements apportés au contenu texte de noeuds existants doivent être considérés comme pertinents</li>
- <li>« all » Equivalent à « additions removals text »</li>
-</ul>
+- « additions » L’insertion de noeuds au sein de la région live doit être considérée comme pertinente
+- « removals » La suppression de noeuds doit être considérée comme pertinente
+- « text » Des changements apportés au contenu texte de noeuds existants doivent être considérés comme pertinents
+- « all » Equivalent à « additions removals text »
 
-<p><code>aria-relevant="additions text"</code> est la valeur par défaut d’une région live.</p>
+`aria-relevant="additions text"` est la valeur par défaut d’une région live.
 
-<h3 id="Autres_ressources">Autres ressources</h3>
+### Autres ressources
 
-<ul>
- <li><a href="https://www.w3.org/TR/wai-aria/states_and_properties#aria-relevant">Spécification WAI-ARIA pour aria-relevant</a></li>
-</ul>
+- [Spécification WAI-ARIA pour aria-relevant](https://www.w3.org/TR/wai-aria/states_and_properties#aria-relevant)
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-required_attribute/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-required_attribute/index.md
index b1e4385b1b..3779f56201 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-required_attribute/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-required_attribute/index.md
@@ -8,66 +8,61 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-required_attribute
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-required
 ---
-<h3 id="Description">Description</h3>
+### Description
 
-<p>Cette technique présente l’utilisation de l’attribut <a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-required"><code>aria-required</code></a>.</p>
+Cette technique présente l’utilisation de l’attribut [`aria-required`](http://www.w3.org/TR/wai-aria/states_and_properties#aria-required).
 
-<p>L’attribut <code>aria-required</code> est utilisé pour indiquer que l’utilisateur doit obligatoirement remplir un champ de formulaire avant de le soumettre. Cet attribut peut être utilisé avec n’importe quel élément de formulaire HTML ; il n’est pas limité aux éléments auxquels a été assigné un <code>rôle</code> ARIA.</p>
+L’attribut `aria-required` est utilisé pour indiquer que l’utilisateur doit obligatoirement remplir un champ de formulaire avant de le soumettre. Cet attribut peut être utilisé avec n’importe quel élément de formulaire HTML ; il n’est pas limité aux éléments auxquels a été assigné un `rôle` ARIA.
 
-<p>{{ HTMLVersionInline("5") }} a introduit l’attribut <a href="/fr/docs/Web/HTML/Attributes"><code>required</code></a>, mais <code>aria-required</code> est toujours utile pour les agents utilisateurs qui ne prennent pas encore en charge HTML5.</p>
+{{ HTMLVersionInline("5") }} a introduit l’attribut [`required`](/fr/docs/Web/HTML/Attributes), mais `aria-required` est toujours utile pour les agents utilisateurs qui ne prennent pas encore en charge HTML5.
 
-<h3 id="Valeurs">Valeurs</h3>
+### Valeurs
 
-<p><code>true</code> ou <code>false</code> (Valeur par défaut : <code>false</code>)</p>
+`true` ou `false` (Valeur par défaut : `false`)
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<p>Les lecteurs d’écran devraient annoncer le champ comme étant obligatoire.</p>
+Les lecteurs d’écran devraient annoncer le champ comme étant obligatoire.
 
-<p>Remarquez que cet attribut ne changera pas automatiquement la présentation du champ.</p>
+Remarquez que cet attribut ne changera pas automatiquement la présentation du champ.
 
-<div class="note"><p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p></div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<h3 id="Exemples">Exemples</h3>
+### Exemples
 
-<h4 id="Exemple_1_un_formulaire_simple">Exemple 1 : un formulaire simple</h4>
+#### Exemple 1 : un formulaire simple
 
-<pre class="brush: html">&lt;form action="post"&gt;
-  &lt;label for="prenom"&gt;Prénom&amp;nbsp;:&lt;/label&gt;
-  &lt;input id="prenom" type="text" aria-required="true"&gt;
-  &lt;br/&gt;
-  &lt;label for="nom"&gt;Nom&amp;nbsp;:&lt;/label&gt;
-  &lt;input id="nom" type="text" aria-required="true"&gt;
-  &lt;br/&gt;
-  &lt;label for="adresse"&gt;Adresse&amp;nbsp;:&lt;/label&gt;
-  &lt;input id="adresse" type="text"&gt;
-&lt;/form&gt;
-</pre>
+```html
+<form action="post">
+  <label for="prenom">Prénom&nbsp;:</label>
+  <input id="prenom" type="text" aria-required="true">
+  <br/>
+  <label for="nom">Nom&nbsp;:</label>
+  <input id="nom" type="text" aria-required="true">
+  <br/>
+  <label for="adresse">Adresse&nbsp;:</label>
+  <input id="adresse" type="text">
+</form>
+```
 
-<h3 id="Notes">Notes</h3>
+### Notes
 
-<h3 id="Utilisé_dans_les_rôles_ARIA">Utilisé dans les rôles ARIA</h3>
+### Utilisé dans les rôles ARIA
 
-<ul>
- <li>Combobox ;</li>
- <li>Gridcell ;</li>
- <li>Listbox ;</li>
- <li>Radiogroup ;</li>
- <li>Spinbutton ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_textbox">Textbox</a> ;</li>
- <li>Tree.</li>
-</ul>
+- Combobox ;
+- Gridcell ;
+- Listbox ;
+- Radiogroup ;
+- Spinbutton ;
+- [Textbox](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_textbox) ;
+- Tree.
 
-<h3 id="Techniques_ARIA_connexes">Techniques ARIA connexes</h3>
+### Techniques ARIA connexes
 
-<ul>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-invalid">Utiliser l’attribut <code>aria-invalid</code></a></li>
-</ul>
+- [Utiliser l’attribut `aria-invalid`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-invalid)
 
-<h3 id="Autres_ressources">Autres ressources</h3>
+### Autres ressources
 
-<ul>
- <li><a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-required">Spécification WAI-ARIA pour <code>aria-required</code></a> ;</li>
- <li><a href="http://www.w3.org/TR/wai-aria-practices/#ariaform">WAI-ARIA Authoring Practices for forms</a> (Règles WAI-ARIA de création de formulaires) ;</li>
- <li><a href="/fr/docs/Web/Guide/HTML/HTML5/Constraint_validation">Validation de condition</a> en {{ HTMLVersionInline("5") }}.</li>
-</ul>
+- [Spécification WAI-ARIA pour `aria-required`](http://www.w3.org/TR/wai-aria/states_and_properties#aria-required) ;
+- [WAI-ARIA Authoring Practices for forms](http://www.w3.org/TR/wai-aria-practices/#ariaform) (Règles WAI-ARIA de création de formulaires) ;
+- [Validation de condition](/fr/docs/Web/Guide/HTML/HTML5/Constraint_validation) en {{ HTMLVersionInline("5") }}.
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuemax_attribute/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuemax_attribute/index.md
index 5c9c26b05f..c5b15f8d43 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuemax_attribute/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuemax_attribute/index.md
@@ -8,54 +8,49 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemax_attribute
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemax
 ---
-<h3 id="Description">Description</h3>
+### Description
 
-<p>Cette technique présente l’utilisation de l’attribut <a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-valuemax">aria-valuemax</a>.</p>
+Cette technique présente l’utilisation de l’attribut [aria-valuemax](http://www.w3.org/TR/wai-aria/states_and_properties#aria-valuemax).
 
-<p>L’attribut <code>aria-valuemax</code> est utilisé pour définir la valeur maximale autorisée pour un composant à intervalle tels qu’une barre de progression <code>progressbar</code>, un bouton rotatif <code>spinbutton</code> ou un curseur <code>slider</code>. Si <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow"><code>aria-valuenow</code></a> a des valeurs minimale et maximale connues, le développeur devrait fournir les propriétés de <code>aria-valuemax</code> et <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemin"><code>aria-valuemin</code></a>. La valeur de <code>aria-valuemax</code> <strong>DOIT</strong> être supérieure ou égale à celle de <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemin"><code>aria-valuemin</code></a>.</p>
+L’attribut `aria-valuemax` est utilisé pour définir la valeur maximale autorisée pour un composant à intervalle tels qu’une barre de progression `progressbar`, un bouton rotatif `spinbutton` ou un curseur `slider`. Si [`aria-valuenow`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow) a des valeurs minimale et maximale connues, le développeur devrait fournir les propriétés de `aria-valuemax` et [`aria-valuemin`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemin). La valeur de `aria-valuemax` **DOIT** être supérieure ou égale à celle de [`aria-valuemin`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemin).
 
-<p><code>aria-valuemax</code> est un attribut <strong>obligatoire</strong> des rôles <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_slider">slider</a>, <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_scrollbar">scrollbar</a> et <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_spinbutton">spinbutton</a>.</p>
+`aria-valuemax` est un attribut **obligatoire** des rôles [slider](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_slider), [scrollbar](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_scrollbar) et [spinbutton](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_spinbutton).
 
-<h3 id="Valeurs">Valeurs</h3>
+### Valeurs
 
-<p>Représentation d’un nombre par une chaîne</p>
+Représentation d’un nombre par une chaîne
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<p>Si la valeur <code>aria-valuemax</code> n’est pas déterminée, ou si <code>aria-valuemin</code> n’est pas inférieure ou égale à la valeur de <code>aria-valuemax</code>, cela créera une condition d’erreur qui sera gérée par la technologie d’assistance.</p>
+Si la valeur `aria-valuemax` n’est pas déterminée, ou si `aria-valuemin` n’est pas inférieure ou égale à la valeur de `aria-valuemax`, cela créera une condition d’erreur qui sera gérée par la technologie d’assistance.
 
-<div class="note"><p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p></div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<h3 id="Exemples">Exemples</h3>
+### Exemples
 
-<h4 id="Exemple_1">Exemple 1:</h4>
+#### Exemple 1:
 
-<p>L’extrait de code ci-dessous montre un curseur basique avec une valeur maximale de 10.</p>
+L’extrait de code ci-dessous montre un curseur basique avec une valeur maximale de 10.
 
-<pre class="brush: html">&lt;div role="slider" aria-valuenow="4" aria-valuemin="1" aria-valuemax="10"&gt;
-</pre>
+```html
+<div role="slider" aria-valuenow="4" aria-valuemin="1" aria-valuemax="10">
+```
 
-<h3 id="Notes">Notes</h3>
+### Notes
 
-<h3 id="Utilisés_avec_les_rôles_ARIA">Utilisés avec les rôles ARIA</h3>
+### Utilisés avec les rôles ARIA
 
-<ul>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_progressbar">progressbar</a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_scrollbar">scrollbar</a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_slider">slider</a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_spinbutton">spinbutton</a>.</li>
-</ul>
+- [progressbar](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_progressbar) ;
+- [scrollbar](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_scrollbar) ;
+- [slider](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_slider) ;
+- [spinbutton](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_spinbutton).
 
-<h3 id="Techniques_ARIA_connexes">Techniques ARIA connexes</h3>
+### Techniques ARIA connexes
 
-<ul>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemin">aria-valuemin</a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow">aria-valuenow</a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuetext">aria-valuetext</a>.</li>
-</ul>
+- [aria-valuemin](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemin) ;
+- [aria-valuenow](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow) ;
+- [aria-valuetext](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuetext).
 
-<h3 id="Autres_ressources">Autres ressources</h3>
+### Autres ressources
 
-<ul>
- <li><a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-valuemax">Spécification WAI-ARIA pour l’attribut <code>aria-valuemax</code></a>.</li>
-</ul>
+- [Spécification WAI-ARIA pour l’attribut `aria-valuemax`](http://www.w3.org/TR/wai-aria/states_and_properties#aria-valuemax).
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuemin_attribute/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuemin_attribute/index.md
index 5443a16c0e..ed3cec7ca6 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuemin_attribute/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuemin_attribute/index.md
@@ -8,52 +8,47 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemin_attribute
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemin
 ---
-<h3 id="Description">Description</h3>
+### Description
 
-<p>L’attribut <code>aria-valuemin</code> est utilisé pour définir la valeur minimale autorisée pour un composant à intervalle tel qu’une barre de progression <code>progressbar</code>, un bouton rotatif <code>spinbutton</code> ou un curseur <code>slider</code>. Si <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow"><code>aria-valuenow</code></a> a des valeurs limites connues (minimum et maximum), le développeur devrait spécifier les propriétés de <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemax"><code>aria-valuemax</code></a> et <code>aria-valuemin</code>. La valeur de <code>aria-valuemin</code> <strong>DOIT</strong> être inférieure ou égale à celle de <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemax"><code>aria-valuemax</code></a>.</p>
+L’attribut `aria-valuemin` est utilisé pour définir la valeur minimale autorisée pour un composant à intervalle tel qu’une barre de progression `progressbar`, un bouton rotatif `spinbutton` ou un curseur `slider`. Si [`aria-valuenow`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow) a des valeurs limites connues (minimum et maximum), le développeur devrait spécifier les propriétés de [`aria-valuemax`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemax) et `aria-valuemin`. La valeur de `aria-valuemin` **DOIT** être inférieure ou égale à celle de [`aria-valuemax`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemax).
 
-<p><code>aria-valuemin</code> est un attribut <strong>obligatoire</strong> des rôles <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_slider">slider</a>, <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_scrollbar">scrollbar</a> et <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_spinbutton">spinbutton</a>.</p>
+`aria-valuemin` est un attribut **obligatoire** des rôles [slider](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_slider), [scrollbar](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_scrollbar) et [spinbutton](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_spinbutton).
 
-<h3 id="Valeurs">Valeurs</h3>
+### Valeurs
 
-<p>Représentation d’un nombre sous forme d'une chaîne</p>
+Représentation d’un nombre sous forme d'une chaîne
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<p>Si <code>aria-valuemin</code> n’est pas inférieure ou égale à la valeur de <code>aria-valuemax</code>, cela créera une condition d’erreur qui sera gérée par la technologie d’assistance.</p>
+Si `aria-valuemin` n’est pas inférieure ou égale à la valeur de `aria-valuemax`, cela créera une condition d’erreur qui sera gérée par la technologie d’assistance.
 
-<div class="note"><p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p></div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<h3 id="Exemples">Exemples</h3>
+### Exemples
 
-<h4 id="Exemple_1">Exemple 1 :</h4>
+#### Exemple 1 :
 
-<p>L’extrait de code ci-dessous montre un curseur basique avec une valeur minimale de 1.</p>
+L’extrait de code ci-dessous montre un curseur basique avec une valeur minimale de 1.
 
-<pre class="brush: html">&lt;div role="slider" aria-valuenow="4" aria-valuemin="1" aria-valuemax="10"&gt;
-</pre>
+```html
+<div role="slider" aria-valuenow="4" aria-valuemin="1" aria-valuemax="10">
+```
 
-<h3 id="Notes">Notes</h3>
+### Notes
 
-<h3 id="Utilisé_avec_les_rôles_ARIA">Utilisé avec les rôles ARIA</h3>
+### Utilisé avec les rôles ARIA
 
-<ul>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_progressbar">progressbar</a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_scrollbar">scrollbar</a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_slider">slider</a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_spinbutton">spinbutton</a>.</li>
-</ul>
+- [progressbar](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_progressbar) ;
+- [scrollbar](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_scrollbar) ;
+- [slider](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_slider) ;
+- [spinbutton](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_spinbutton).
 
-<h3 id="Techniques_ARIA_connexes">Techniques ARIA connexes</h3>
+### Techniques ARIA connexes
 
-<ul>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemax">aria-valuemax</a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow">aria-valuenow</a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuetext">aria-valuetext</a>.</li>
-</ul>
+- [aria-valuemax](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemax) ;
+- [aria-valuenow](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow) ;
+- [aria-valuetext](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuetext).
 
-<h3 id="Autres_ressources">Autres ressources</h3>
+### Autres ressources
 
-<ul>
- <li><a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-valuemin">Spécification WAI-ARIA pour l’attribut <code>aria-valuemin</code></a>.</li>
-</ul>
+- [Spécification WAI-ARIA pour l’attribut `aria-valuemin`](http://www.w3.org/TR/wai-aria/states_and_properties#aria-valuemin).
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuenow_attribute/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuenow_attribute/index.md
index 6d13e9a360..4cf525f585 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuenow_attribute/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuenow_attribute/index.md
@@ -8,82 +8,69 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuenow_attribute
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow
 ---
-<p>L'attribut <code>aria-valuenow</code> est utilisé pour définir la valeur courante de l'intervalle d'un composant tel qu'un curseur, un bouton tournant (potentiomètre) ou une barre de progression. Si la valeur courante n'est pas connue, l'attribut <code>aria-valuenow</code> ne devrait pas être défini. Si <code>aria-valuenow</code> a des valeurs minimale et maximale connues, on devrait définir les attributs <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemin_attribute"><code>aria-valuemin</code></a> et <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemax_attribute"><code>aria-valuemax</code></a>.</p>
+L'attribut `aria-valuenow` est utilisé pour définir la valeur courante de l'intervalle d'un composant tel qu'un curseur, un bouton tournant (potentiomètre) ou une barre de progression. Si la valeur courante n'est pas connue, l'attribut `aria-valuenow` ne devrait pas être défini. Si `aria-valuenow` a des valeurs minimale et maximale connues, on devrait définir les attributs [`aria-valuemin`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemin_attribute) et [`aria-valuemax`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemax_attribute).
 
-<p>Lorsque la valeur rendue ne peut être précisément représentée par un nombre, les développeuses et développeurs <strong>DEVRAIENT</strong> utiliser l'attribut <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuetext_attribute"><code>aria-valuetext</code></a> en conjonction avec <code>aria-valuenow</code> pour fournir une représentation humainement lisible de la valeur courante. Par exemple, un curseur peut avoir des valeurs retournées comme <code>"petite"</code>, <code>"moyenne"</code> et <code>"grande"</code>. Dans ce cas, les valeurs de <code>aria-valuenow</code> peuvent varier de 1 à 3, ce qui indique la position de chaque valeur dans l'espace de valeurs, mais la valeur de <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuetext_attribute"><code>aria-valuetext</code></a> sera l'une des chaînes : <code>"petite"</code>, <code>"moyenne"</code> ou <code>"grande"</code>.</p>
+Lorsque la valeur rendue ne peut être précisément représentée par un nombre, les développeuses et développeurs **DEVRAIENT** utiliser l'attribut [`aria-valuetext`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuetext_attribute) en conjonction avec `aria-valuenow` pour fournir une représentation humainement lisible de la valeur courante. Par exemple, un curseur peut avoir des valeurs retournées comme `"petite"`, `"moyenne"` et `"grande"`. Dans ce cas, les valeurs de `aria-valuenow` peuvent varier de 1 à 3, ce qui indique la position de chaque valeur dans l'espace de valeurs, mais la valeur de [`aria-valuetext`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuetext_attribute) sera l'une des chaînes : `"petite"`, `"moyenne"` ou `"grande"`.
 
-<p>L'attribut <code>aria-valuenow</code> est <strong>obligatoire</strong> pour les rôles <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_slider_role"><code>slider</code></a>, <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_scrollbar_role"><code>scrollbar</code></a> et <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_spinbutton_role"><code>spinbutton</code></a>.</p>
+L'attribut `aria-valuenow` est **obligatoire** pour les rôles [`slider`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_slider_role), [`scrollbar`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_scrollbar_role) et [`spinbutton`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_spinbutton_role).
 
-<h2 id="value">Valeur</h2>
+## Valeur
 
-<p>Une chaîne de caractères qui représente le nombre.</p>
+Une chaîne de caractères qui représente le nombre.
 
-<h2 id="possible_effects_on_user_agents_and_assistive_technology">Effets possibles sur les agents utilisateurs et les technologies d'assistance</h2>
+## Effets possibles sur les agents utilisateurs et les technologies d'assistance
 
-<p>Pour les éléments possédant les rôles <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_progressbar_role"><code>progressbar</code></a> et <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_scrollbar_role"><code>scrollbar</code></a>, les technologies d'assistance <strong>DEVRAIENT</strong> renvoyer la valeur courante sous forme de pourcentage, calculée comme étant la position dans l'intervalle compris entre <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemin_attribute"><code>aria-valuemin</code></a> et <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemax_attribute"><code>aria-valuemax</code></a> si les deux sont définies, sinon la valeur actuelle avec un pourcentage.</p>
+Pour les éléments possédant les rôles [`progressbar`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_progressbar_role) et [`scrollbar`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_scrollbar_role), les technologies d'assistance **DEVRAIENT** renvoyer la valeur courante sous forme de pourcentage, calculée comme étant la position dans l'intervalle compris entre [`aria-valuemin`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemin_attribute) et [`aria-valuemax`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemax_attribute) si les deux sont définies, sinon la valeur actuelle avec un pourcentage.
 
-<p>Pour les éléments possédant les rôles <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_slider_role"><code>slider</code></a> et <a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_spinbutton_role"><code>spinbutton</code></a>, les technologies d'assistance <strong>DEVRAIENT</strong> retourner la valeur courante à l'utilisateur.</p>
+Pour les éléments possédant les rôles [`slider`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_slider_role) et [`spinbutton`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_spinbutton_role), les technologies d'assistance **DEVRAIENT** retourner la valeur courante à l'utilisateur.
 
-<div class="note">
-  <p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d'assistance devraient traiter cette technique. L'information fournie ci-dessus est l'une de ces opinions et n'est pas normative.</p>
-</div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d'assistance devraient traiter cette technique. L'information fournie ci-dessus est l'une de ces opinions et n'est pas normative.
 
-<h2 id="examples">Exemples</h2>
+## Exemples
 
-<h3 id="example_1">Exemple 1</h3>
+### Exemple 1
 
-<p>L'extrait de code ci-dessous affiche un curseur simple avec une valeur courante de 4.</p>
+L'extrait de code ci-dessous affiche un curseur simple avec une valeur courante de 4.
 
-<pre class="brush: html">&lt;div role="slider" aria-valuenow="4" aria-valuemin="1" aria-valuemax="10"&gt;
-</pre>
+```html
+<div role="slider" aria-valuenow="4" aria-valuemin="1" aria-valuemax="10">
+```
 
-<h3 id="working_examples">Exemples concrets</h3>
+### Exemples concrets
 
-<ul>
-  <li><code>progressbar</code>
-    <ul>
-      <li><a href="https://dequeuniversity.com/library/aria/progress-bar-bounded">Deque Code Library of Accessibility Examples: Progress Bar (Bounded)</a></li>
-      <li><a href="https://dequeuniversity.com/library/aria/progress-bar-unbounded">Deque Code Library of Accessibility Examples: Progress Bar (Unbounded)</a></li>
-     </ul>
-  </li>
-  <li><code>slider</code>
-    <ul>
-      <li><a href="https://w3c.github.io/aria-practices/examples/slider/multithumb-slider.html">WAI-ARIA Authoring Practices: Horizontal Multi-Thumb Slider Example</a></li>
-      <li><a href="https://dequeuniversity.com/library/aria/slider">Deque Code Library of Accessibility Examples: Slider</a></li>
-      <li><a href="https://dequeuniversity.com/library/aria/slider-multirange">Deque Code Library of Accessibility Examples: Slider (Multirange)</a></li>
-     </ul>
-  </li>
-  <li><code>spinbutton</code>
-    <ul>
-      <li><a href="https://w3c.github.io/aria-practices/examples/spinbutton/datepicker-spinbuttons.html">WAI-ARIA Authoring Practices: Date Picker Spin Button Example</a></li>
-      <li><a href="https://w3c.github.io/aria-practices/examples/toolbar/toolbar.html">WAI-ARIA Authoring Practices: Toolbar Example</a></li>
-     </ul>
-  </li>
-</ul>
+- `progressbar`
 
-<h2 id="used_with_aria_roles">Rôles ARIA concernés</h2>
+  - [Deque Code Library of Accessibility Examples: Progress Bar (Bounded)](https://dequeuniversity.com/library/aria/progress-bar-bounded)
+  - [Deque Code Library of Accessibility Examples: Progress Bar (Unbounded)](https://dequeuniversity.com/library/aria/progress-bar-unbounded)
 
-<ul>
-  <li><a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_progressbar_role"><code>progressbar</code></a></li>
-  <li><a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_scrollbar_role"><code>scrollbar</code></a></li>
-  <li><a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_slider_role"><code>slider</code></a></li>
-  <li><a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_spinbutton_role"><code>spinbutton</code></a></li>
- </ul>
+- `slider`
 
-<h2 id="related_aria_techniques">Techniques ARIA connexes</h2>
+  - [WAI-ARIA Authoring Practices: Horizontal Multi-Thumb Slider Example](https://w3c.github.io/aria-practices/examples/slider/multithumb-slider.html)
+  - [Deque Code Library of Accessibility Examples: Slider](https://dequeuniversity.com/library/aria/slider)
+  - [Deque Code Library of Accessibility Examples: Slider (Multirange)](https://dequeuniversity.com/library/aria/slider-multirange)
 
-<ul>
- <li><a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemax_attribute">aria-valuemax</a> ;</li>
- <li><a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemin_attribute">aria-valuemin</a> ;</li>
- <li><a href="/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuetext_attribute">aria-valuetext</a>.</li>
-</ul>
+- `spinbutton`
 
-<h2 id="compatibility">Compatibilité</h2>
+  - [WAI-ARIA Authoring Practices: Date Picker Spin Button Example](https://w3c.github.io/aria-practices/examples/spinbutton/datepicker-spinbuttons.html)
+  - [WAI-ARIA Authoring Practices: Toolbar Example](https://w3c.github.io/aria-practices/examples/toolbar/toolbar.html)
 
-<p>À définir : ajouter les informations de prise en charge pour les combinaisons les plus courantes d'agents utilisateurs et de produits de technologies d'assistance.</p>
+## Rôles ARIA concernés
 
-<h2 id="additional_resources">Autres ressources</h2>
+- [`progressbar`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_progressbar_role)
+- [`scrollbar`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_scrollbar_role)
+- [`slider`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_slider_role)
+- [`spinbutton`](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_spinbutton_role)
 
-<ul>
- <li><a href="https://www.w3.org/TR/wai-aria-1.1/#aria-valuenow">Spécification WAI-ARIA pour l'attribut <code>aria-valuenow</code></a>.</li>
-</ul>
+## Techniques ARIA connexes
+
+- [aria-valuemax](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemax_attribute) ;
+- [aria-valuemin](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemin_attribute) ;
+- [aria-valuetext](/fr/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuetext_attribute).
+
+## Compatibilité
+
+À définir : ajouter les informations de prise en charge pour les combinaisons les plus courantes d'agents utilisateurs et de produits de technologies d'assistance.
+
+## Autres ressources
+
+- [Spécification WAI-ARIA pour l'attribut `aria-valuenow`](https://www.w3.org/TR/wai-aria-1.1/#aria-valuenow).
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuetext_attribute/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuetext_attribute/index.md
index f875cce058..4dd141cfd7 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuetext_attribute/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_aria-valuetext_attribute/index.md
@@ -8,56 +8,51 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuetext_attribute
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuetext
 ---
-<h3 id="Description">Description</h3>
+### Description
 
-<p>L’attribut <code>aria-valuetext</code> est utilisé pour définir un texte alternatif, lisible par l'homme, de la valeur <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow"><code>aria-valuenow</code></a> d’un composant à intervalle tel qu’une barre de progression, un bouton rotatif <code>spinbutton</code> ou un curseur <code>slider</code>.</p>
+L’attribut `aria-valuetext` est utilisé pour définir un texte alternatif, lisible par l'homme, de la valeur [`aria-valuenow`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow) d’un composant à intervalle tel qu’une barre de progression, un bouton rotatif `spinbutton` ou un curseur `slider`.
 
-<p>Les développeurs <strong>DEVRAIENT</strong> uniquement définir l’attribut <code>aria-valuetext</code> lorsque la valeur retournée ne peut pas être précisément représentée sous forme de nombre.</p>
+Les développeurs **DEVRAIENT** uniquement définir l’attribut `aria-valuetext` lorsque la valeur retournée ne peut pas être précisément représentée sous forme de nombre.
 
-<p>Par exemple, dans le cas d'un curseur qui peut retourner les valeurs <code>petite</code>, <code>moyenne</code>et <code>grand</code>, les valeurs de <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow"><code>aria-valuenow</code></a> pourraient aller de 1 à 3, indiquant ainsi la position de chaque valeur dans l’intervalle, mais la valeur de <code>aria-valuetext</code> sera l'une des chaînes suivantes : <code>petite</code>, <code>moyenne</code> ou <code>grande</code>.</p>
+Par exemple, dans le cas d'un curseur qui peut retourner les valeurs `petite`, `moyenne`et `grand`, les valeurs de [`aria-valuenow`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow) pourraient aller de 1 à 3, indiquant ainsi la position de chaque valeur dans l’intervalle, mais la valeur de `aria-valuetext` sera l'une des chaînes suivantes : `petite`, `moyenne` ou `grande`.
 
-<h3 id="Valeurs">Valeurs</h3>
+### Valeurs
 
-<p>Représentation d’un nombre sous forme d'une chaîne</p>
+Représentation d’un nombre sous forme d'une chaîne
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<p>Si l’attribut <code>aria-valuetext</code> est absent, les technologies d’assistance compteront uniquement sur l’attribut <a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow"><code>aria-valuenow</code></a> pour la valeur courante. Si <code>aria-valuetext</code> est spécifié, les technologies d’assistance <strong>DEVRAIENT</strong> retourner cette valeur plutôt que celle de <code>aria-valuenow</code>.</p>
+Si l’attribut `aria-valuetext` est absent, les technologies d’assistance compteront uniquement sur l’attribut [`aria-valuenow`](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow) pour la valeur courante. Si `aria-valuetext` est spécifié, les technologies d’assistance **DEVRAIENT** retourner cette valeur plutôt que celle de `aria-valuenow`.
 
-<div class="note"><p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p></div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<h3 id="Exemples">Exemples</h3>
+### Exemples
 
-<h4 id="Exemple_1">Exemple 1 :</h4>
+#### Exemple 1 :
 
-<p>L’extrait de code ci-dessous montre un curseur simple de sélection d’un jour de la semaine. La valeur du curseur est numérique, et l’attribut <code>aria-valuetext</code> est utilisé pour fournir le nom de jour. L’application actualisera programmatiquement <code>aria-valuetext</code> selon la valeur de <code>aria-valuenow</code>.</p>
+L’extrait de code ci-dessous montre un curseur simple de sélection d’un jour de la semaine. La valeur du curseur est numérique, et l’attribut `aria-valuetext` est utilisé pour fournir le nom de jour. L’application actualisera programmatiquement `aria-valuetext` selon la valeur de `aria-valuenow`.
 
-<pre class="brush: html">&lt;div role="slider" aria-valuenow="1"
+```html
+<div role="slider" aria-valuenow="1"
     aria-valuemin="1" aria-valuemax="7"
-    aria-valuetext="Dimanche"&gt;
-</pre>
+    aria-valuetext="Dimanche">
+```
 
-<h4 id="Exemples_concrets">Exemples concrets :</h4>
+#### Exemples concrets :
 
-<h3 id="Notes">Notes</h3>
+### Notes
 
-<h3 id="Utilisé_avec_les_rôles_ARIA">Utilisé avec les rôles ARIA</h3>
+### Utilisé avec les rôles ARIA
 
-<ul>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_progressbar">progressbar</a> ;</li>
- <li>scrollbar ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_slider">slider</a></li>
- <li>spinbutton.</li>
-</ul>
+- [progressbar](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_progressbar) ;
+- scrollbar ;
+- [slider](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_slider)
+- spinbutton.
 
-<h3 id="Techniques_ARIA_connexes">Techniques ARIA connexes</h3>
+### Techniques ARIA connexes
 
-<ul>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow">aria-valuenow</a>.</li>
-</ul>
+- [aria-valuenow](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow).
 
-<h3 id="Autres_ressources">Autres ressources</h3>
+### Autres ressources
 
-<ul>
- <li><a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-valuetext">Spécification WAI-ARIA pour l’attribut <code>aria-valuetext</code></a>.</li>
-</ul>
+- [Spécification WAI-ARIA pour l’attribut `aria-valuetext`](http://www.w3.org/TR/wai-aria/states_and_properties#aria-valuetext).
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_article_role/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_article_role/index.md
index 8a9a076f49..b67c6b261a 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_article_role/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_article_role/index.md
@@ -9,47 +9,46 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_article_role
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_rôle_article
 ---
-<h3 id="Description">Description</h3>
+### Description
 
-<p>Cette technique présente l’utilisation du rôle <a href="http://www.w3.org/TR/wai-aria/roles#article"><code>article</code> (en)</a> et décrit les effets produits sur les navigateurs et les technologies d’assistance.</p>
+Cette technique présente l’utilisation du rôle [`article` (en)](http://www.w3.org/TR/wai-aria/roles#article) et décrit les effets produits sur les navigateurs et les technologies d’assistance.
 
-<p>Le rôle <code>article</code> est utilisé pour identifier une section de page qui forme une partie indépendante d'un document, d'une page ou d'un site. Les exemples d'article peuvent être des billets de blogs ou des articles d'un magazine ou d'un journal ou encore les commentaires soumis par les utilisateurs. Ils sont <em>indépendants</em> dans le sens où leur contenu pourrait être autonome, par exemple pour un flux de syndication.</p>
+Le rôle `article` est utilisé pour identifier une section de page qui forme une partie indépendante d'un document, d'une page ou d'un site. Les exemples d'article peuvent être des billets de blogs ou des articles d'un magazine ou d'un journal ou encore les commentaires soumis par les utilisateurs. Ils sont _indépendants_ dans le sens où leur contenu pourrait être autonome, par exemple pour un flux de syndication.
 
-<p>Les articles peuvent être imbriqués. Par exemple, une entrée de blog sur un site acceptant les commentaires des visiteurs pourrait représenter ces commentaires comme des articles incluent dans l'article de l'entrée de blog.</p>
+Les articles peuvent être imbriqués. Par exemple, une entrée de blog sur un site acceptant les commentaires des visiteurs pourrait représenter ces commentaires comme des articles incluent dans l'article de l'entrée de blog.
 
-<p>Le rôle ARIA <code>article</code> est similaire à l'élément {{ HTMLVersionInline("5") }} {{ HTMLElement("article") }}. Cependant l'élément {{ HTMLElement("article") }} devrait toujours recevoir le rôle ARIA <code>article</code> car toutes les technologies d'assistance ne prennent pas encore en charge HTML5.</p>
+Le rôle ARIA `article` est similaire à l'élément {{ HTMLVersionInline("5") }} {{ HTMLElement("article") }}. Cependant l'élément {{ HTMLElement("article") }} devrait toujours recevoir le rôle ARIA `article` car toutes les technologies d'assistance ne prennent pas encore en charge HTML5.
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<p>Lorsque l'utilisateur navigue dans un élément ayant le rôle <code>article</code>, les technologies d'assistance qui interceptent généralement les événements clavier standards <strong>doivent</strong> basculer en mode de navigation du document, plutôt que de passer les événements clavier à l'application web.</p>
+Lorsque l'utilisateur navigue dans un élément ayant le rôle `article`, les technologies d'assistance qui interceptent généralement les événements clavier standards **doivent** basculer en mode de navigation du document, plutôt que de passer les événements clavier à l'application web.
 
-<p>Les technologies d'assistance <strong>doivent</strong> fournit une fonctionnalité permettant à l'utilisateur de naviguer dans la hiérarchie de chacun des éléments <code>article</code> imbriqués.</p>
+Les technologies d'assistance **doivent** fournit une fonctionnalité permettant à l'utilisateur de naviguer dans la hiérarchie de chacun des éléments `article` imbriqués.
 
-<div class="note">
-  <p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p>
-</div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<h3 id="Exemples">Exemples</h3>
+### Exemples
 
-<h4 id="Utilisation_du_role_article_sans_élément_article">Utilisation du role article sans élément article :</h4>
+#### Utilisation du role article sans élément article :
 
-<pre class="brush: html">&lt;div role="article"&gt;
+```html
+<div role="article">
 
-  &lt;h1&gt;Une titre de billet de blog&lt;/h1&gt;
-  &lt;p&gt;contenu du billet...&lt;/p&gt;
+  <h1>Une titre de billet de blog</h1>
+  <p>contenu du billet...</p>
 
-  &lt;div class="comments"&gt;
-    &lt;div role="article"&gt;
-      &lt;p&gt;Un premier commentaire&lt;/p&gt;
-    &lt;/div&gt;
-    &lt;div role="article"&gt;
-      &lt;p&gt;Un deuxième commentaire&lt;/p&gt;
-    &lt;/div&gt;
-  &lt;/div&gt;
+  <div class="comments">
+    <div role="article">
+      <p>Un premier commentaire</p>
+    </div>
+    <div role="article">
+      <p>Un deuxième commentaire</p>
+    </div>
+  </div>
 
-&lt;/div&gt;
-</pre>
+</div>
+```
 
-<h3 id="Autres_ressources">Autres ressources</h3>
+### Autres ressources
 
-<p><a href="http://www.w3.org/TR/wai-aria/roles#article">Spécification WAI-ARIA du rôle <code>article</code> (en)</a></p>
+[Spécification WAI-ARIA du rôle `article` (en)](http://www.w3.org/TR/wai-aria/roles#article)
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_group_role/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_group_role/index.md
index a69035dfb1..79d19d503d 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_group_role/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_group_role/index.md
@@ -8,116 +8,106 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_group_role
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_group
 ---
-<h3 id="Description">Description</h3>
+### Description
 
-<p>Cette technique présente l’utilisation du rôle <a href="http://www.w3.org/TR/wai-aria/roles#group">group</a> et décrit les effets produits sur les navigateurs et les technologies d’assistance.</p>
+Cette technique présente l’utilisation du rôle [group](http://www.w3.org/TR/wai-aria/roles#group) et décrit les effets produits sur les navigateurs et les technologies d’assistance.
 
-<p>Le rôle <code>group</code> est utilisé pour identifier un ensemble d’objets de l’interface utilisateur qui, contrairement à une <a href="http://www.w3.org/TR/wai-aria/roles#region"><code>region</code></a>, ne sont pas destinés à être intégrés dans une table de contenus ou une page récapitulative (telles que des structures dynamiquement créées par des scripts ou par les technologies d’assistance) ; un groupe ne devrait pas être considéré comme une partie perceptible majeure d’une page. Lorsque le rôle <code>group</code> est ajouté à un élément, , le navigateur émettra un événement <code>group</code> accessible aux produits de technologie d’assistance qui pourront alors le notifier à l’utilisateur.</p>
+Le rôle `group` est utilisé pour identifier un ensemble d’objets de l’interface utilisateur qui, contrairement à une [`region`](http://www.w3.org/TR/wai-aria/roles#region), ne sont pas destinés à être intégrés dans une table de contenus ou une page récapitulative (telles que des structures dynamiquement créées par des scripts ou par les technologies d’assistance) ; un groupe ne devrait pas être considéré comme une partie perceptible majeure d’une page. Lorsque le rôle `group` est ajouté à un élément, , le navigateur émettra un événement `group` accessible aux produits de technologie d’assistance qui pourront alors le notifier à l’utilisateur.
 
-<p>Un groupe devrait utilisé pour former un ensemble logique d’éléments avec des fonctions connexes, tels que les enfants dans un composant d’arborescence formant un ensemble apparenté dans une hiérarchie, ou une collection d’éléments ayant le même conteneur dans un répertoire. Cependant, lorsqu’on utilise un groupe pour former une liste, les développeurs doivent limiter ses enfants aux éléments <a href="http://www.w3.org/TR/wai-aria/roles#listitem">listitem</a>. Les éléments de groupe devraient être imbriqués.</p>
+Un groupe devrait utilisé pour former un ensemble logique d’éléments avec des fonctions connexes, tels que les enfants dans un composant d’arborescence formant un ensemble apparenté dans une hiérarchie, ou une collection d’éléments ayant le même conteneur dans un répertoire. Cependant, lorsqu’on utilise un groupe pour former une liste, les développeurs doivent limiter ses enfants aux éléments [listitem](http://www.w3.org/TR/wai-aria/roles#listitem). Les éléments de groupe devraient être imbriqués.
 
-<p>La gestion correcte d’un groupe par les technologies d’assistance est déterminée par le contexte dans lequel il est fourni.</p>
+La gestion correcte d’un groupe par les technologies d’assistance est déterminée par le contexte dans lequel il est fourni.
 
-<p>Si un auteur pense qu’une section est suffisamment importante pour faire partie de la table des matières d’une page, il devrait assigner un rôle de <a href="http://www.w3.org/TR/wai-aria/roles#region"><code>region</code></a> ou un rôle standard de <a href="http://www.w3.org/TR/wai-aria/roles#landmark_roles">point de repère</a> à cette section.</p>
+Si un auteur pense qu’une section est suffisamment importante pour faire partie de la table des matières d’une page, il devrait assigner un rôle de [`region`](http://www.w3.org/TR/wai-aria/roles#region) ou un rôle standard de [point de repère](http://www.w3.org/TR/wai-aria/roles#landmark_roles) à cette section.
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<p>Lorsque le rôle <code>group</code> est ajouté à un élément, ou qu’un tel élément devient visible, l’agent utilisateur devrait suivre les étapes suivantes :</p>
+Lorsque le rôle `group` est ajouté à un élément, ou qu’un tel élément devient visible, l’agent utilisateur devrait suivre les étapes suivantes :
 
-<ul>
- <li>Présenter l’élément ayant un rôle de groupe à l’API d’accessibilité du système d’exploitation ;</li>
- <li>Déclencher un événement groupe accessible à l’aide l’API d’accessibilité du système d’exploitation si elle le prend en charge.</li>
-</ul>
+- Présenter l’élément ayant un rôle de groupe à l’API d’accessibilité du système d’exploitation ;
+- Déclencher un événement groupe accessible à l’aide l’API d’accessibilité du système d’exploitation si elle le prend en charge.
 
-<p>Les technologies d’assistance devraient être à l’écoute de tels événements et les notifier à l’utilisateur en conséquence :</p>
+Les technologies d’assistance devraient être à l’écoute de tels événements et les notifier à l’utilisateur en conséquence :
 
-<ul>
- <li>Les lecteurs d’écran devraient annoncer le groupe lorsque le focus atteint l’un des contrôles appartenant au groupe, et si <a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-describedby">aria-describedby</a> a été défini, la description peut être lue. Après cela seulement le contrôle focalisé devrait être annoncé.</li>
- <li>Les loupes d’écran devraient agrandir le groupe.</li>
-</ul>
+- Les lecteurs d’écran devraient annoncer le groupe lorsque le focus atteint l’un des contrôles appartenant au groupe, et si [aria-describedby](http://www.w3.org/TR/wai-aria/states_and_properties#aria-describedby) a été défini, la description peut être lue. Après cela seulement le contrôle focalisé devrait être annoncé.
+- Les loupes d’écran devraient agrandir le groupe.
 
-<div class="note"><p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p></div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<h3 id="Exemples">Exemples</h3>
+### Exemples
 
-<h4 id="Exemple_1_Utiliser_le_rôle_group_avec_une_arborescence_HTML">Exemple 1 : Utiliser le rôle <code>group</code> avec une arborescence HTML</h4>
+#### Exemple 1 : Utiliser le rôle `group` avec une arborescence HTML
 
-<p>L’extrait de code ci-dessous montre comment le rôle <code>group</code> est ajouté directement dans le code source HTML.</p>
+L’extrait de code ci-dessous montre comment le rôle `group` est ajouté directement dans le code source HTML.
 
-<pre class="brush: html">&lt;div id="tree1" class="tree" role="tree" tabindex="-1"&gt;
-  &lt;div id="animals" class="groupHeader" role="presentation" aria-owns="animalGroup" aria-expanded="true"&gt;
-    &lt;img class="headerImg" role="presentation" tabindex="-1" src="images/treeExpanded.gif" /&gt;
-    &lt;span role="treeitem" tabindex="0"&gt;Animaux&lt;/span&gt;
-  &lt;/div&gt;
+```html
+<div id="tree1" class="tree" role="tree" tabindex="-1">
+  <div id="animals" class="groupHeader" role="presentation" aria-owns="animalGroup" aria-expanded="true">
+    <img class="headerImg" role="presentation" tabindex="-1" src="images/treeExpanded.gif" />
+    <span role="treeitem" tabindex="0">Animaux</span>
+  </div>
 
-  &lt;div id="animalGroup" class="group" role="group"&gt;
-    &lt;div id="birds" class="treeitem" role="presentation"&gt;
-      &lt;span role="treeitem" tabindex="-1"&gt;Oiseaux&lt;/span&gt;
-    &lt;/div&gt;
+  <div id="animalGroup" class="group" role="group">
+    <div id="birds" class="treeitem" role="presentation">
+      <span role="treeitem" tabindex="-1">Oiseaux</span>
+    </div>
 
-    &lt;div id="cats" class="groupHeader" role="presentation" aria-owns="catGroup" aria-expanded="false"&gt;
-      &lt;img class="headerImg" role="presentation" tabindex="-1" src="images/treeContracted.gif" /&gt;
-      &lt;span role="treeitem" tabindex="0"&gt;Chats&lt;/span&gt;
-    &lt;/div&gt;
+    <div id="cats" class="groupHeader" role="presentation" aria-owns="catGroup" aria-expanded="false">
+      <img class="headerImg" role="presentation" tabindex="-1" src="images/treeContracted.gif" />
+      <span role="treeitem" tabindex="0">Chats</span>
+    </div>
 
- &lt;div id="catGroup" class="group" role="group"&gt;
-      &lt;div id="siamese" class="treeitem" role="presentation"&gt;
-        &lt;span role="treeitem" tabindex="-1"&gt;Siamois&lt;/span&gt;
-      &lt;/div&gt;
-      &lt;div id="tabby" class="treeitem" role="presentation"&gt;
-        &lt;span role="treeitem" tabindex="-1"&gt;Tigré&lt;/span&gt;
-      &lt;/div&gt;
-    &lt;/div&gt;
-  &lt;/div&gt;
-&lt;/div&gt;</pre>
+ <div id="catGroup" class="group" role="group">
+      <div id="siamese" class="treeitem" role="presentation">
+        <span role="treeitem" tabindex="-1">Siamois</span>
+      </div>
+      <div id="tabby" class="treeitem" role="presentation">
+        <span role="treeitem" tabindex="-1">Tigré</span>
+      </div>
+    </div>
+  </div>
+</div>
+```
 
-<h4 id="Exemple_2_Utiliser_le_rôle_group_avec_un_menu_déroulant_HTML">Exemple 2 : Utiliser le rôle <code>group</code> avec un menu déroulant HTML</h4>
+#### Exemple 2 : Utiliser le rôle `group` avec un menu déroulant HTML
 
-<p>L’extrait de code ci-dessous montre comment le rôle <code>group</code> est ajouté directement au code source HTML.</p>
+L’extrait de code ci-dessous montre comment le rôle `group` est ajouté directement au code source HTML.
 
-<pre class="brush: html">&lt;div role="menu"&gt;
-  &lt;ul role="group"&gt;
-    &lt;li role="menuitem"&gt;Courrier entrant&lt;/li&gt;
-    &lt;li role="menuitem"&gt;Archive&lt;/li&gt;
-    &lt;li role="menuitem"&gt;Corbeille&lt;/li&gt;
-  &lt;/ul&gt;
-  &lt;ul role="group"&gt;
-    &lt;li role="menuitem"&gt;Dossier personnalisé 1&lt;/li&gt;
-    &lt;li role="menuitem"&gt;Dossier personnalisé 2&lt;/li&gt;
-    &lt;li role="menuitem"&gt;Dossier personnalisé 3&lt;/li&gt;
-  &lt;/ul&gt;
+```html
+<div role="menu">
+  <ul role="group">
+    <li role="menuitem">Courrier entrant</li>
+    <li role="menuitem">Archive</li>
+    <li role="menuitem">Corbeille</li>
+  </ul>
+  <ul role="group">
+    <li role="menuitem">Dossier personnalisé 1</li>
+    <li role="menuitem">Dossier personnalisé 2</li>
+    <li role="menuitem">Dossier personnalisé 3</li>
+  </ul>
 
-  &lt;ul role="group"&gt;
-    &lt;li role="menuitem"&gt;Nouveau dossier&lt;/li&gt;
-  &lt;/ul&gt;
-&lt;/div&gt;</pre>
+  <ul role="group">
+    <li role="menuitem">Nouveau dossier</li>
+  </ul>
+</div>
+```
 
-<h4 id="Exemples_concrets">Exemples concrets :</h4>
+#### Exemples concrets :
 
-<ul>
- <li><a href="http://test.cita.illinois.edu/aria/tree/tree2.php">http://test.cita.illinois.edu/aria/tree/tree2.php</a></li>
-</ul>
+- <http://test.cita.illinois.edu/aria/tree/tree2.php>
 
-<h3 id="Notes">Notes</h3>
+### Notes
 
-<ul>
- <li>Les membres du groupe qui se trouve à l’extérieur du sous-arbre DOM du groupe doivent avoir leurs relations avec ce dernier explicitement assignées afin de participer au groupe.</li>
-</ul>
+- Les membres du groupe qui se trouve à l’extérieur du sous-arbre DOM du groupe doivent avoir leurs relations avec ce dernier explicitement assignées afin de participer au groupe.
 
-<h3 id="Attributs_ARIA_utilisés">Attributs ARIA utilisés</h3>
+### Attributs ARIA utilisés
 
-<ul>
- <li><a href="http://www.w3.org/TR/wai-aria/roles#group">group (en)</a></li>
-</ul>
+- [group (en)](http://www.w3.org/TR/wai-aria/roles#group)
 
-<h3 id="Techniques_ARIA_connexes">Techniques ARIA connexes</h3>
+### Techniques ARIA connexes
 
-<ul>
- <li>Rôle <a href="http://www.w3.org/TR/wai-aria/roles#region">region (en)</a></li>
-</ul>
+- Rôle [region (en)](http://www.w3.org/TR/wai-aria/roles#region)
 
-<h3 id="Autres_ressources">Autres ressources</h3>
+### Autres ressources
 
-<ul>
- <li>Bonnes pratiques ARIA – Répertoires, groupes et zones : <a href="http://www.w3.org/TR/wai-aria-practices/#kbd_layout_groupheading">Directories, Groups, and Regions (en)</a></li>
-</ul>
+- Bonnes pratiques ARIA – Répertoires, groupes et zones : [Directories, Groups, and Regions (en)](http://www.w3.org/TR/wai-aria-practices/#kbd_layout_groupheading)
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_link_role/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_link_role/index.md
index 6decbf1edb..08b116042f 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_link_role/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_link_role/index.md
@@ -8,32 +8,42 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_link_role
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_link
 ---
-<h3 id="Description">Description</h3>
-
-<p>Cette technique présente l’utilisation du rôle <a href="http://www.w3.org/TR/wai-aria/roles#link">link</a> et décrit les effets produits sur les navigateurs et les technologies d’assistance.</p>
-
-<p>Le rôle <code>link</code> est utilisé pour identifier un élément qui crée un hyperlien vers une ressource qui peut être dans l’application ou à l’extérieur. Lorsque ce rôle est ajouté à un élément, la tabulation peut être utilisée pour donner le focus au lien et la barre d’espace ou la touche Entrée peuvent exécuter le lien.</p>
-<p>L’attribut <a href="http://www.w3.org/TR/wai-aria-practices/#focus_tabindex">tabindex</a> peut éventuellement être utilisé avec ce rôle pour spécifier directement la position de l’élément dans l’ordre de tabulation.</p>
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
-<p>Lorsque le rôle <code>link</code> est ajouté à un élément, ou qu’un élément possédant ce rôle devient visible, l’agent utilisateur devrait suivre les étapes suivantes :</p>
-<ul>
- <li>Présenter l’élément comme un lien à l’API accessibilité du système d’exploitation.</li>
- <li>Déclencher un événement lien accessible à l’aide de l’API d’accessibilité du système d’exploitation si elle le prend en charge.</li>
-</ul>
-<p>Les technologies d’assistance devraient être à l’écoute de tels événements et les notifier à l’utilisateur en conséquence :</p>
-<ul>
- <li>Les lecteurs d'écran devraient annoncer le texte du lien ou son label lorsque l'élément avec le rôle <code>link</code>reçoit le focus, en plus du fait ce que c'est un lien. Les liens ARIA devraient être intégré dans la fonction « lister les liens » (<em>List Links</em>) des lecteurs d'écran de la même façon que les liens ordinaires, et les actions dans cette liste de dialogue, tels que « Activer le lien » ou « Déplacer le lien », devraient se comporter de la meme façon qu'avec des liens ordinaires. </li>
- <li>Les loupes d’écran devraient agrandir le lien.</li>
-</ul>
-<div class="note">
- <p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p></div>
-<h3 id="Exemples">Exemples</h3>
-<h4 id="Exemple_1_Ajoute_le_rôle_dans_le_code_HTML">Exemple 1 : <strong>Ajoute le rôle dans le code HTML</strong></h4>
-<p>L’extrait de code ci-dessous montre comment le rôle <code>link</code> est ajouté dans le code source HTML. </p>
-<pre class="brush: html">&lt;div role=”link”&gt;Un lien&lt;/div&gt;
-</pre>
-<h4 id="Exemple_2_Lien_accessible_créé_depuis_une_application_à_l'aide_d'un_&lt;span>"><strong>Exemple 2 : Lien accessible créé depuis une application à l'aide d'un &lt;span&gt;</strong></h4>
-<pre class="brush: html">&lt;script type="text/javascript"&gt;
+### Description
+
+Cette technique présente l’utilisation du rôle [link](http://www.w3.org/TR/wai-aria/roles#link) et décrit les effets produits sur les navigateurs et les technologies d’assistance.
+
+Le rôle `link` est utilisé pour identifier un élément qui crée un hyperlien vers une ressource qui peut être dans l’application ou à l’extérieur. Lorsque ce rôle est ajouté à un élément, la tabulation peut être utilisée pour donner le focus au lien et la barre d’espace ou la touche Entrée peuvent exécuter le lien.
+
+L’attribut [tabindex](http://www.w3.org/TR/wai-aria-practices/#focus_tabindex) peut éventuellement être utilisé avec ce rôle pour spécifier directement la position de l’élément dans l’ordre de tabulation.
+
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
+
+Lorsque le rôle `link` est ajouté à un élément, ou qu’un élément possédant ce rôle devient visible, l’agent utilisateur devrait suivre les étapes suivantes :
+
+- Présenter l’élément comme un lien à l’API accessibilité du système d’exploitation.
+- Déclencher un événement lien accessible à l’aide de l’API d’accessibilité du système d’exploitation si elle le prend en charge.
+
+Les technologies d’assistance devraient être à l’écoute de tels événements et les notifier à l’utilisateur en conséquence :
+
+- Les lecteurs d'écran devraient annoncer le texte du lien ou son label lorsque l'élément avec le rôle `link`reçoit le focus, en plus du fait ce que c'est un lien. Les liens ARIA devraient être intégré dans la fonction « lister les liens » (_List Links_) des lecteurs d'écran de la même façon que les liens ordinaires, et les actions dans cette liste de dialogue, tels que « Activer le lien » ou « Déplacer le lien », devraient se comporter de la meme façon qu'avec des liens ordinaires.
+- Les loupes d’écran devraient agrandir le lien.
+
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
+
+### Exemples
+
+#### Exemple 1 : **Ajoute le rôle dans le code HTML**
+
+L’extrait de code ci-dessous montre comment le rôle `link` est ajouté dans le code source HTML.
+
+```html
+<div role=”link”>Un lien</div>
+```
+
+#### **Exemple 2 : Lien accessible créé depuis une application à l'aide d'un \<span>**
+
+```html
+<script type="text/javascript">
 sap = {ui:{keycodes:{SPACE:32, ENTER:13 }}};
 //gère les clics et les événement clavier sur le lien
 function navigateLink(evt) {
@@ -44,32 +54,34 @@ function navigateLink(evt) {
         if (ref) window.open(ref.getAttribute("href"),"_blank");
     }
 }
-&lt;/script&gt;
+</script>
 
-&lt;body role="application"&gt;
+<body role="application">
 
-    &lt;h3&gt;Lien simple créé avec un &lt;span&gt;&lt;/h3&gt;
-    &lt;span href="http://www.w3c.org" onkeydown="navigateLink(event)" onclick="navigateLink(event)" tabindex="0" id="link1" role="link" class="link"&gt;
+    <h3>Lien simple créé avec un <span></h3>
+    <span href="http://www.w3c.org" onkeydown="navigateLink(event)" onclick="navigateLink(event)" tabindex="0" id="link1" role="link" class="link">
       Activez ce lien en appuyant sur la barre d’espace ou la touche Entrée
-    &lt;/span&gt;
-&lt;/body&gt;</pre>
-<h4 id="Exemples_concrets">Exemples concrets :</h4>
-<ul>
- <li><a href="http://codetalks.org/source/widgets/link/link.html">http://codetalks.org/source/widgets/link/link.html</a></li>
- <li><a href="http://codetalks.org/source/widgets/link/link.sample.html">http://codetalks.org/source/widgets/link/link.sample.html</a></li>
-</ul>
-<h3 id="Notes">Notes</h3>
-<p>Si l'activation du lien déclenche une action mais ne déplace pas le focus du navigateur ou que cela ouvre une nouvelle page, vous devriez considérer l'utilisation du rôle <a href="http://www.w3.org/TR/wai-aria/roles#button">button</a> au lieu du rôle <code>link</code>.</p>
-<h3 id="Attributs_ARIA_utilisés">Attributs ARIA utilisés</h3>
-<ul>
- <li><a href="http://www.w3.org/TR/wai-aria/roles#link"><code>link</code></a></li>
-</ul>
-<h3 id="Techniques_ARIA_connexes">Techniques ARIA connexes</h3>
-<ul>
- <li>Rôle <a href="http://www.w3.org/TR/wai-aria/roles#button">button</a>.</li>
-</ul>
-
-<h3 id="Autres_ressources">Autres ressources</h3>
-<ul>
- <li>Bonnes pratiques ARIA - Rôle <code>Link</code> : <a href="http://www.w3.org/TR/wai-aria-practices/#link">#link</a></li>
-</ul>
+    </span>
+</body>
+```
+
+#### Exemples concrets :
+
+- <http://codetalks.org/source/widgets/link/link.html>
+- <http://codetalks.org/source/widgets/link/link.sample.html>
+
+### Notes
+
+Si l'activation du lien déclenche une action mais ne déplace pas le focus du navigateur ou que cela ouvre une nouvelle page, vous devriez considérer l'utilisation du rôle [button](http://www.w3.org/TR/wai-aria/roles#button) au lieu du rôle `link`.
+
+### Attributs ARIA utilisés
+
+- [`link`](http://www.w3.org/TR/wai-aria/roles#link)
+
+### Techniques ARIA connexes
+
+- Rôle [button](http://www.w3.org/TR/wai-aria/roles#button).
+
+### Autres ressources
+
+- Bonnes pratiques ARIA - Rôle `Link` : [#link](http://www.w3.org/TR/wai-aria-practices/#link)
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_log_role/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_log_role/index.md
index 34d8e47e12..350f5f7ebe 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_log_role/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_log_role/index.md
@@ -8,85 +8,74 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_log_role
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_log
 ---
-<h3 id="Description">Description</h3>
+### Description
 
-<p>Cette technique présente l’utilisation du rôle <a href="http://www.w3.org/TR/wai-aria/roles#log"><code>log</code></a> et décrit les effets produits sur les navigateurs et les technologies d’assistance.</p>
+Cette technique présente l’utilisation du rôle [`log`](http://www.w3.org/TR/wai-aria/roles#log) et décrit les effets produits sur les navigateurs et les technologies d’assistance.
 
-<p>Le rôle <code>log</code> est utilisé pour identifier un élément qui crée <a href="http://www.w3.org/WAI/PF/aria/terms#def_liveregion">une zone live</a> où de nouvelles informations sont ajoutées dans un ordre significatif et où les anciennes informations peuvent être supprimées. Par exemple, un journal de salon de discussion, l’historique d’une messagerie ou un fichier d’erreurs. Contrairement aux autres types de zones live, ce rôle est ordonné de façon séquentielle et les nouvelles informations sont uniquement ajoutées à la fin de l’enregistrement. Lorsque ce rôle est ajouté à un élément, le navigateur émettra un événement <code>log</code> accessible aux produits de technologie d’assistance qui pourront alors le notifier à l’utilisateur.</p>
+Le rôle `log` est utilisé pour identifier un élément qui crée [une zone live](http://www.w3.org/WAI/PF/aria/terms#def_liveregion) où de nouvelles informations sont ajoutées dans un ordre significatif et où les anciennes informations peuvent être supprimées. Par exemple, un journal de salon de discussion, l’historique d’une messagerie ou un fichier d’erreurs. Contrairement aux autres types de zones live, ce rôle est ordonné de façon séquentielle et les nouvelles informations sont uniquement ajoutées à la fin de l’enregistrement. Lorsque ce rôle est ajouté à un élément, le navigateur émettra un événement `log` accessible aux produits de technologie d’assistance qui pourront alors le notifier à l’utilisateur.
 
-<p>Par défaut, les mises à jour ne contiennent que les changements apportés à la zone live et elles sont annoncées à l'utilisateur lorsqu'il est inactif. Si l'utilisateur a besoin d'entendre l'ensemble de la zone live lorsqu'un changement se produit, il faut utiliser <code>aria-atomic="true"</code>. Pour faire les annonces le plus tôt possible et lorsque l'utilisateur peut être interrompu, <code>aria-live="assertive"</code> peut être défini pour lancer des mises à jour plus agressives.</p>
+Par défaut, les mises à jour ne contiennent que les changements apportés à la zone live et elles sont annoncées à l'utilisateur lorsqu'il est inactif. Si l'utilisateur a besoin d'entendre l'ensemble de la zone live lorsqu'un changement se produit, il faut utiliser `aria-atomic="true"`. Pour faire les annonces le plus tôt possible et lorsque l'utilisateur peut être interrompu, `aria-live="assertive"` peut être défini pour lancer des mises à jour plus agressives.
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<p>Lorsque le rôle <code>log</code> est ajouté à un élément, ou qu’un tel élément devient visible, l’agent utilisateur devrait suivre les étapes suivantes :</p>
+Lorsque le rôle `log` est ajouté à un élément, ou qu’un tel élément devient visible, l’agent utilisateur devrait suivre les étapes suivantes :
 
-<ul>
- <li>Présenter l’élément ayant un rôle de journal à l’API d’accessibilité du système d’exploitation ;</li>
- <li>Déclencher un événement journal accessible à l’aide de l’API d’accessibilité du système d’exploitation si elle le prend en charge.</li>
-</ul>
+- Présenter l’élément ayant un rôle de journal à l’API d’accessibilité du système d’exploitation ;
+- Déclencher un événement journal accessible à l’aide de l’API d’accessibilité du système d’exploitation si elle le prend en charge.
 
-<p>Les technologies d’assistance devraient être à l’écoute de tels événements et les notifier à l’utilisateur en conséquence :</p>
+Les technologies d’assistance devraient être à l’écoute de tels événements et les notifier à l’utilisateur en conséquence :
 
-<ul>
- <li>Les lecteurs d'écran devraient annoncer les changements intervenus dans le fichier de journalisation lorsque l'utilisateur est inactif, à moins que <code>aria-live="assertive"</code> soit défini, dans quel cas l'utilisateur peut être interrompu.</li>
- <li>Les loupes d'écran devraient indiquer visuellement la disponibilité d'une mise à jour du fichier de journalisation.</li>
-</ul>
+- Les lecteurs d'écran devraient annoncer les changements intervenus dans le fichier de journalisation lorsque l'utilisateur est inactif, à moins que `aria-live="assertive"` soit défini, dans quel cas l'utilisateur peut être interrompu.
+- Les loupes d'écran devraient indiquer visuellement la disponibilité d'une mise à jour du fichier de journalisation.
 
-<div class="note"><p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p></div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<h3 id="Exemples">Exemples</h3>
+### Exemples
 
-<h4 id="Exemple_1_Ajout_du_rôle_dans_du_code_HTML">Exemple 1 : Ajout du rôle dans du code HTML</h4>
+#### Exemple 1 : Ajout du rôle dans du code HTML
 
-<p>L’extrait de code ci-dessous montre comment le rôle <code>log</code> est ajouté directement dans le code source HTML.</p>
+L’extrait de code ci-dessous montre comment le rôle `log` est ajouté directement dans le code source HTML.
 
-<pre class="brush: html">&lt;div id=”liveregion” class=”region” role=”log”&gt;&lt;/div&gt;
-</pre>
+```html
+<div id=”liveregion” class=”region” role=”log”></div>
+```
 
-<h4 id="Exemple_2_Extrait_d’un_exemple_d’application">Exemple 2 : Extrait d’un exemple d’application</h4>
+#### Exemple 2 : Extrait d’un exemple d’application
 
-<p>Cet extrait de code crée le journal dans une application de chat AJAX.</p>
+Cet extrait de code crée le journal dans une application de chat AJAX.
 
-<pre class="brush: html">&lt;div id="chatArea" role="log"&gt;
-  &lt;ul id="chatRegion" aria-live="polite" aria-atomic="false"&gt;
-    &lt;li&gt;Veuillez choisir un pseudo pour commencer à utiliser AJAX Chat.&lt;/li&gt;
-  &lt;/ul&gt;
+```html
+<div id="chatArea" role="log">
+  <ul id="chatRegion" aria-live="polite" aria-atomic="false">
+    <li>Veuillez choisir un pseudo pour commencer à utiliser AJAX Chat.</li>
+  </ul>
 
-  &lt;ul id="userListRegion" aria-live="off" aria-relevant="additions removals text"&gt;
-  &lt;/ul&gt;
-&lt;/div&gt;</pre>
+  <ul id="userListRegion" aria-live="off" aria-relevant="additions removals text">
+  </ul>
+</div>
+```
 
-<p>Voir l’<a href="http://codetalks.org/source/live/chat.html">exemple</a> sur CodeTalks pour plus d’informations.</p>
+Voir l’[exemple](http://codetalks.org/source/live/chat.html) sur CodeTalks pour plus d’informations.
 
-<h4 id="Exemples_concrets">Exemples concrets :</h4>
+#### Exemples concrets :
 
-<ul>
- <li><a href="http://test.cita.illinois.edu/aria/live/live1.php">http://test.cita.illinois.edu/aria/live/live1.php</a> ;</li>
- <li><a href="http://websiteaccessibility.donaldevans.com/2011/07/12/aria-log/">http://websiteaccessibility.donaldevans.com/2011/07/12/aria-log/</a> ;</li>
- <li><a href="http://codetalks.org/source/live/chat.html">http://codetalks.org/source/live/chat.html</a> [<a href="http://codetalks.org/source/live/chat_notes.html">notes</a>].</li>
-</ul>
+- <http://test.cita.illinois.edu/aria/live/live1.php> ;
+- <http://websiteaccessibility.donaldevans.com/2011/07/12/aria-log/> ;
+- <http://codetalks.org/source/live/chat.html> \[[notes](http://codetalks.org/source/live/chat_notes.html)].
 
-<h3 id="Notes">Notes</h3>
+### Notes
 
-<ul>
- <li>L'utilisation du rôle <code>log</code> sur un élément implique que cet élément possède l'attribut <code>aria-live="polite"</code>.</li>
- <li>Pour une zone avec un défilement de texte, comme un bandeau défilant, il est préférable d'utiliser le rôle <code>marquee</code>.</li>
-</ul>
+- L'utilisation du rôle `log` sur un élément implique que cet élément possède l'attribut `aria-live="polite"`.
+- Pour une zone avec un défilement de texte, comme un bandeau défilant, il est préférable d'utiliser le rôle `marquee`.
 
-<h3 id="Attributs_ARIA_utilisés">Attributs ARIA utilisés</h3>
+### Attributs ARIA utilisés
 
-<ul>
- <li><a href="http://www.w3.org/TR/wai-aria/roles#log">log</a>.</li>
-</ul>
+- [log](http://www.w3.org/TR/wai-aria/roles#log).
 
-<h3 id="Techniques_ARIA_connexes">Techniques ARIA connexes</h3>
+### Techniques ARIA connexes
 
-<ul>
- <li>Rôle <a href="http://www.w3.org/TR/wai-aria/roles#marquee">marquee</a>.</li>
-</ul>
+- Rôle [marquee](http://www.w3.org/TR/wai-aria/roles#marquee).
 
-<h3 id="Autres_ressources">Autres ressources</h3>
+### Autres ressources
 
-<ul>
- <li>Bonnes pratiques ARIA – Implémentation des zones live : <a href="http://www.w3.org/TR/wai-aria-practices/#LiveRegions">#LiveRegions</a>.</li>
-</ul>
+- Bonnes pratiques ARIA – Implémentation des zones live : [#LiveRegions](http://www.w3.org/TR/wai-aria-practices/#LiveRegions).
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_presentation_role/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_presentation_role/index.md
index 25bf9addfd..9287c5f81e 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_presentation_role/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_presentation_role/index.md
@@ -8,45 +8,49 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_presentation_role
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_presentation
 ---
-<p>Cette page présente l'usage du rôle <code><a href="https://www.w3.org/TR/wai-aria-practices-1.1/#presentation_role">presentation</a></code> et décrit l'effet qu'il a sur les navigateurs et les technologies d'assistance.</p>
+Cette page présente l'usage du rôle [`presentation`](https://www.w3.org/TR/wai-aria-practices-1.1/#presentation_role) et décrit l'effet qu'il a sur les navigateurs et les technologies d'assistance.
 
-<h2 id="Description">Description</h2>
+## Description
 
-<p>Le rôle <code>presentation</code> est utilisé pour retirer toute représentation sémantique pour un élément donné ainsi que pour ses descendants. Par exemple, un tableau utilisé pour la mise en page pourrait avoir un rôle <code>presentation</code> appliqué sur l'élément <code>table</code> pour retirer la sémantique de l'élément en lui-même ainsi que tout ses sous-éléments, comme l'en-tête de tableau ou même les données de tableau elles-mêmes.</p>
+Le rôle `presentation` est utilisé pour retirer toute représentation sémantique pour un élément donné ainsi que pour ses descendants. Par exemple, un tableau utilisé pour la mise en page pourrait avoir un rôle `presentation` appliqué sur l'élément `table` pour retirer la sémantique de l'élément en lui-même ainsi que tout ses sous-éléments, comme l'en-tête de tableau ou même les données de tableau elles-mêmes.
 
-<h2 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h2>
+## Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<p>Les agents utilisateurs ou les technologies d'assistance ne devrait normalement pas lire les éléments marqués comme étant de rôle <code>presentation</code>.</p>
+Les agents utilisateurs ou les technologies d'assistance ne devrait normalement pas lire les éléments marqués comme étant de rôle `presentation`.
 
-<div class="note"><p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p></div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<h3 id="Exemple_1_Les_icônes-fontes">Exemple 1: Les icônes-fontes</h3>
+### Exemple 1: Les icônes-fontes
 
-<p>Une des recommandations d'accessibilité propose que les couleurs ou les représentations imagées (icônes par exemple) ne soient pas l'unique méthode pour transmettre une information. Ainsi nous pouvons partir du postula que votre icône est un complément décoratif à un texte explicite. Il faut donc lui appliquer un rôle <code>presentation</code>.</p>
+Une des recommandations d'accessibilité propose que les couleurs ou les représentations imagées (icônes par exemple) ne soient pas l'unique méthode pour transmettre une information. Ainsi nous pouvons partir du postula que votre icône est un complément décoratif à un texte explicite. Il faut donc lui appliquer un rôle `presentation`.
 
-<pre class="brush: html">&lt;i class="icon-user" role="presentation"&gt;&lt;/i&gt;
-</pre>
+```html
+<i class="icon-user" role="presentation"></i>
+```
 
-<h4 id="Exemples_concrets">Exemples concrets :</h4>
+#### Exemples concrets :
 
-<p>Par exemple, en reprenant le bouton de la navigation principale de ce site web, nous pourrions écrire.</p>
+Par exemple, en reprenant le bouton de la navigation principale de ce site web, nous pourrions écrire.
 
-<pre class="brush: html">&lt;button type="button" aria-haspopup="true"&gt;
+```html
+<button type="button" aria-haspopup="true">
     Technologies
-    &lt;span class="main-menu-arrow" role="presentation"&gt;▼&lt;/span&gt;
-&lt;/button&gt;
-</pre>
+    <span class="main-menu-arrow" role="presentation">▼</span>
+</button>
+```
 
-<h3 id="Exemple_2_Inline_SVG">Exemple 2 : Inline SVG</h3>
+### Exemple 2 : Inline SVG
 
-<p>De plus en plus d'images sont proposées sous la forme de compositions SVG directement insérées dans le document HTML. À l'image de l'attribut <code>alt</code> vide sur un élément <code>img</code>, il est possible d'indiquer qu'un élément SVG est purement décoratif grâce au rôle <code>presentation</code>.</p>
+De plus en plus d'images sont proposées sous la forme de compositions SVG directement insérées dans le document HTML. À l'image de l'attribut `alt` vide sur un élément `img`, il est possible d'indiquer qu'un élément SVG est purement décoratif grâce au rôle `presentation`.
 
-<pre class="brush: html">&lt;svg role="presentation"&gt;
+```html
+<svg role="presentation">
 …
-&lt;/svg&gt;</pre>
+</svg>
+```
 
-<h2 id="Autres_ressources">Autres ressources</h2>
+## Autres ressources
 
-<p>Using Aria - 2.9 Use of Role=presentation or Role=none: <a href="https://www.w3.org/TR/using-aria/#presentation">https://www.w3.org/TR/using-aria/#presentation</a></p>
+Using Aria - 2.9 Use of Role=presentation or Role=none: <https://www.w3.org/TR/using-aria/#presentation>
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_progressbar_role/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_progressbar_role/index.md
index 6a12160b24..2473934478 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_progressbar_role/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_progressbar_role/index.md
@@ -8,56 +8,52 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_progressbar_role
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_progressbar
 ---
-<h3 id="Description">Description</h3>
+### Description
 
-<p>Cette technique présente l’utilisation du rôle <a href="https://www.w3.org/TR/wai-aria/#progressbar"><code>progressbar</code></a>.</p>
+Cette technique présente l’utilisation du rôle [`progressbar`](https://www.w3.org/TR/wai-aria/#progressbar).
 
-<p>Le rôle <code>progressbar</code> devrait être utilisé pour un élément qui affiche la progression d’un tâche prenant un certain temps ou s’effectuant en plusieurs étapes.</p>
+Le rôle `progressbar` devrait être utilisé pour un élément qui affiche la progression d’un tâche prenant un certain temps ou s’effectuant en plusieurs étapes.
 
-<p>Une barre de progression indique que la requête de l’utilisateur a été prise en compte et que l’application progresse vers la finalisation de l’action demandée. Si la valeur courante de la barre de progression peut être connue, le développeur pourra indiquer la progression à l’aide des attributs <a href="https://www.w3.org/TR/wai-aria-1.1/#aria-valuenow"><code>aria-valuenow</code></a>, <a href="https://www.w3.org/TR/wai-aria-1.1/#aria-valuemin"><code>aria-valuemin</code></a> et <a href="https://www.w3.org/TR/wai-aria-1.1/#aria-valuemax"><code>aria-valuemax</code></a>. Si la valeur de progression est indéterminée, le développeur peut omettre l’attribut <a href="https://www.w3.org/TR/wai-aria-1.1/#aria-valuenow"><code>aria-valuenow</code></a>.</p>
+Une barre de progression indique que la requête de l’utilisateur a été prise en compte et que l’application progresse vers la finalisation de l’action demandée. Si la valeur courante de la barre de progression peut être connue, le développeur pourra indiquer la progression à l’aide des attributs [`aria-valuenow`](https://www.w3.org/TR/wai-aria-1.1/#aria-valuenow), [`aria-valuemin`](https://www.w3.org/TR/wai-aria-1.1/#aria-valuemin) et [`aria-valuemax`](https://www.w3.org/TR/wai-aria-1.1/#aria-valuemax). Si la valeur de progression est indéterminée, le développeur peut omettre l’attribut [`aria-valuenow`](https://www.w3.org/TR/wai-aria-1.1/#aria-valuenow).
 
-<p>Lorsqu’une tâche progresse, la valeur <code>aria-valuenow</code> doit être dynamiquement actualisée pour indiquer la progression aux produits de technologies d’assistance.</p>
+Lorsqu’une tâche progresse, la valeur `aria-valuenow` doit être dynamiquement actualisée pour indiquer la progression aux produits de technologies d’assistance.
 
-<p>Si le rôle <code>progressbar</code> décrit la progression du chargement d’une zone particulière d’une page, l’auteur <strong>DOIT</strong> utiliser l’attribut <a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-describedby"><code>aria-describedby</code></a> pour pointer vers l’état courant, et définir l’attribut <a href="https://www.w3.org/TR/wai-aria-1.1/#aria-busy"><code>aria-busy</code></a> à <code>true</code> pour la zone jusqu’à la fin du chargement. Il n’est pas possible à l’utilisateur de modifier la valeur de <code>progressbar</code> car elle est toujours en lecture seule.</p>
+Si le rôle `progressbar` décrit la progression du chargement d’une zone particulière d’une page, l’auteur **DOIT** utiliser l’attribut [`aria-describedby`](http://www.w3.org/TR/wai-aria/states_and_properties#aria-describedby) pour pointer vers l’état courant, et définir l’attribut [`aria-busy`](https://www.w3.org/TR/wai-aria-1.1/#aria-busy) à `true` pour la zone jusqu’à la fin du chargement. Il n’est pas possible à l’utilisateur de modifier la valeur de `progressbar` car elle est toujours en lecture seule.
 
-<div class="note">
-  <p><strong>Note :</strong> généralement les technologies d’assistance retourneront la valeur de l’attribut <a href="https://www.w3.org/TR/wai-aria-1.1/#aria-valuenow"><code>aria-valuenow</code></a> sous la forme d’un pourcentage d’une plage de valeurs comprise entre <a href="https://www.w3.org/TR/wai-aria-1.1/#aria-valuemin"><code>aria-valuemin</code></a> et <a href="https://www.w3.org/TR/wai-aria-1.1/#aria-valuemax"><code>aria-valuemax</code></a>, sauf si <a href="https://www.w3.org/TR/wai-aria-1.1/#aria-valuetext"><code>aria-valuetext</code></a> est spécifié. Il est préférable de définir les valeurs pour les attributs <code>aria-valuemin</code>, <code>aria-valuemax</code> et <code>aria-valuenow</code> de façon appropriée pour ce calcul.</p></div>
+> **Note :** généralement les technologies d’assistance retourneront la valeur de l’attribut [`aria-valuenow`](https://www.w3.org/TR/wai-aria-1.1/#aria-valuenow) sous la forme d’un pourcentage d’une plage de valeurs comprise entre [`aria-valuemin`](https://www.w3.org/TR/wai-aria-1.1/#aria-valuemin) et [`aria-valuemax`](https://www.w3.org/TR/wai-aria-1.1/#aria-valuemax), sauf si [`aria-valuetext`](https://www.w3.org/TR/wai-aria-1.1/#aria-valuetext) est spécifié. Il est préférable de définir les valeurs pour les attributs `aria-valuemin`, `aria-valuemax` et `aria-valuenow` de façon appropriée pour ce calcul.
 
-<div class="note">
-  <p><strong>Note :</strong> les éléments possédant le rôle <code>progressbar</code> ont une valeur <code>aria-readonly</code> implicite définie à <code>true</code>.</p>
-</div>
+> **Note :** les éléments possédant le rôle `progressbar` ont une valeur `aria-readonly` implicite définie à `true`.
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<p>Les lecteurs devraient annoncer les mises à jour de la progression dès qu’elles se produisent. Si la barre de progression a un label, il devrait également être mentionné.</p>
+Les lecteurs devraient annoncer les mises à jour de la progression dès qu’elles se produisent. Si la barre de progression a un label, il devrait également être mentionné.
 
-<div class="note"><p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p></div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<h3 id="Exemples">Exemples</h3>
+### Exemples
 
-<h4 id="Exemple_1_barre_de_progression_simple_avec_pourcentage_de_progression">Exemple 1 : barre de progression simple avec pourcentage de progression</h4>
+#### Exemple 1 : barre de progression simple avec pourcentage de progression
 
-<pre class="brush: html">&lt;div role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"&gt;20 %&lt;/div&gt;
-</pre>
+```html
+<div role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">20 %</div>
+```
 
-<h4 id="Exemple_2_Utilisation_de_aria-valuetext">Exemple 2 : Utilisation de <code>aria-valuetext</code></h4>
+#### Exemple 2 : Utilisation de `aria-valuetext`
 
-<pre class="brush: html">&lt;div role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuetext="Étape 2 : Copie des fichiers…" aria-valuemax="100"&gt;
+```html
+<div role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuetext="Étape 2 : Copie des fichiers…" aria-valuemax="100">
   Étape 2 : Copie des fichiers…
-&lt;/div&gt;
-
-</pre>
+</div>
+```
 
-<h4 id="Exemples_concrets">Exemples concrets :</h4>
+#### Exemples concrets :
 
-<h3 id="Notes">Notes</h3>
+### Notes
 
-<h3 id="Attributs_ARIA_utilisés">Attributs ARIA utilisés</h3>
+### Attributs ARIA utilisés
 
-<ul>
- <li><a href="https://www.w3.org/TR/wai-aria/#progressbar">progressbar</a></li>
- <li><a href="https://www.w3.org/TR/wai-aria-1.1/#aria-valuenow">aria-valuenow</a></li>
- <li><a href="https://www.w3.org/TR/wai-aria-1.1/#aria-valuemin">aria-valuemin</a></li>
- <li><a href="https://www.w3.org/TR/wai-aria-1.1/#aria-valuemax">aria-valuemax</a></li>
- <li><a href="https://www.w3.org/TR/wai-aria-1.1/#aria-valuetext">aria-valuetext</a></li>
-</ul>
\ No newline at end of file
+- [progressbar](https://www.w3.org/TR/wai-aria/#progressbar)
+- [aria-valuenow](https://www.w3.org/TR/wai-aria-1.1/#aria-valuenow)
+- [aria-valuemin](https://www.w3.org/TR/wai-aria-1.1/#aria-valuemin)
+- [aria-valuemax](https://www.w3.org/TR/wai-aria-1.1/#aria-valuemax)
+- [aria-valuetext](https://www.w3.org/TR/wai-aria-1.1/#aria-valuetext)
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_slider_role/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_slider_role/index.md
index 16da9c8804..9612cd75c3 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_slider_role/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_slider_role/index.md
@@ -8,100 +8,82 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_slider_role
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_slider
 ---
-<h3 id="Description">Description</h3>
+### Description
 
-<p>Cette technique présente l’utilisation du rôle <a href="http://www.w3.org/TR/wai-aria/roles#slider">slider</a>.</p>
+Cette technique présente l’utilisation du rôle [slider](http://www.w3.org/TR/wai-aria/roles#slider).
 
-<p>Le rôle <code>slider</code> est utilisé pour des balises qui permettent à l'utilisateur de sélectionner une valeur dans un intervalle donné. Le rôle <code>slider</code> est assigné à la « <em>molette</em> », le contrôle qui est ajusté pour modifier la valeur. Typiquement, un autre élément est stylé pour représenter visuellement l'intervalle de valeurs possibles, et le curseur est positionné visuellement pour représenter la valeur dans cet intervalle. Lorsque l'utilisateur interagit avec la molette, l'application doit programmatiquement ajuster l'attribut <code>aria-valuenow</code> du curseur de défilement (et si possible <code>aria-valuetext</code>) pour refléter la valeur courante. Voir la section {{ anch("Exemples") }} ci-dessous pour plus d'informations.</p>
+Le rôle `slider` est utilisé pour des balises qui permettent à l'utilisateur de sélectionner une valeur dans un intervalle donné. Le rôle `slider` est assigné à la « *molette* », le contrôle qui est ajusté pour modifier la valeur. Typiquement, un autre élément est stylé pour représenter visuellement l'intervalle de valeurs possibles, et le curseur est positionné visuellement pour représenter la valeur dans cet intervalle. Lorsque l'utilisateur interagit avec la molette, l'application doit programmatiquement ajuster l'attribut `aria-valuenow` du curseur de défilement (et si possible `aria-valuetext`) pour refléter la valeur courante. Voir la section {{ anch("Exemples") }} ci-dessous pour plus d'informations.
 
-<h4 id="Clavier_et_focus">Clavier et focus</h4>
+#### Clavier et focus
 
-<p>Le curseur doit pouvoir recevoir le focus et être manipulable au clavier. Lorsque l'utilisateur tabule pour amener le focus sur le curseur, il doit arriver sur la molette : le contrôle qu'un utilisateur de souris fera glisser. Les touches flèches doivent agir de la façon suivante (attention toutefois, dans les applications, aux directions de flèches pour les langues s'écrivant de droite à gauche) :</p>
+Le curseur doit pouvoir recevoir le focus et être manipulable au clavier. Lorsque l'utilisateur tabule pour amener le focus sur le curseur, il doit arriver sur la molette : le contrôle qu'un utilisateur de souris fera glisser. Les touches flèches doivent agir de la façon suivante (attention toutefois, dans les applications, aux directions de flèches pour les langues s'écrivant de droite à gauche) :
 
-<table>
- <thead>
-  <tr>
-   <th scope="col">Touche(s)</th>
-   <th scope="col">Action</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>Flèches haut et droite</td>
-   <td>Augmente la valeur sélectionnée</td>
-  </tr>
-  <tr>
-   <td>Flèches bas et gauche</td>
-   <td>Baisse la valeur sélectionnée</td>
-  </tr>
-  <tr>
-   <td>Page haut et Page bas</td>
-   <td>Augmente ou baisse facultativement la valeur selon un pas prédéfini (par exemple de 10 en 10 dans un intervalle de 0 à 100)</td>
-  </tr>
- </tbody>
-</table>
+| Touche(s)              | Action                                                                                                                      |
+| ---------------------- | --------------------------------------------------------------------------------------------------------------------------- |
+| Flèches haut et droite | Augmente la valeur sélectionnée                                                                                             |
+| Flèches bas et gauche  | Baisse la valeur sélectionnée                                                                                               |
+| Page haut et Page bas  | Augmente ou baisse facultativement la valeur selon un pas prédéfini (par exemple de 10 en 10 dans un intervalle de 0 à 100) |
 
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
 
-<div class="note"><p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p></div>
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
 
-<h3 id="Exemples">Exemples</h3>
+### Exemples
 
-<h4 id="Exemple_1_Intervalle_numérique_simple">Exemple 1 : Intervalle numérique simple</h4>
+#### Exemple 1 : Intervalle numérique simple
 
-<p>Dans l'exemple ci-dessous, un simple curseur est utilisé pour sélectionner une valeur entre 1 et 100. Le volume courant est 60. L'application actualisera programmatiquement la valeur de <code>aria-valuenow</code> en réponse à l'action de l'utilisateur.</p>
+Dans l'exemple ci-dessous, un simple curseur est utilisé pour sélectionner une valeur entre 1 et 100. Le volume courant est 60. L'application actualisera programmatiquement la valeur de `aria-valuenow` en réponse à l'action de l'utilisateur.
 
-<pre class="brush: html">&lt;div id="slider-label"&gt;Volume&lt;/div&gt;
+```html
+<div id="slider-label">Volume</div>
 
-&lt;div class="vol-slider"&gt;
-  &lt;a href="#" id="vol-handle" class="handle" role="slider" aria-labelledby="slider-label"
+<div class="vol-slider">
+  <a href="#" id="vol-handle" class="handle" role="slider" aria-labelledby="slider-label"
     aria-valuemin="1"
     aria-valuemax="100"
-    aria-valuenow="60"&gt;
-  &lt;/a&gt;
-&lt;/div&gt;
-</pre>
+    aria-valuenow="60">
+  </a>
+</div>
+```
 
-<h4 id="Exemple_2_Valeurs_texte">Exemple 2 : Valeurs texte</h4>
+#### Exemple 2 : Valeurs texte
 
-<p>Parfois, un slider est utilisé pour choisir une valeur qui n'est pas, sémantiquement , un nombre. Dans ces cas là, l'attribut <code>aria-valuetext</code> est utilisé pour donner le texte approprié pour la valeur sélectionnée. Dans l'exemple ci-dessous, le slider est utilisé pour sélectionner un jour de la semaine .</p>
+Parfois, un slider est utilisé pour choisir une valeur qui n'est pas, sémantiquement , un nombre. Dans ces cas là, l'attribut `aria-valuetext` est utilisé pour donner le texte approprié pour la valeur sélectionnée. Dans l'exemple ci-dessous, le slider est utilisé pour sélectionner un jour de la semaine .
 
-<pre class="brush: html">&lt;div id="slider-label"&gt;Jour de la semaine :&lt;/div&gt;
+```html
+<div id="slider-label">Jour de la semaine :</div>
 
-&lt;div class="day-slider"&gt;
-  &lt;a href="#" id="day-handle" class="day-slider-handle" role="slider" aria-labelledby="slider-label"
+<div class="day-slider">
+  <a href="#" id="day-handle" class="day-slider-handle" role="slider" aria-labelledby="slider-label"
     aria-valuemin="1"
     aria-valuemax="7"
     aria-valuenow="2"
-    aria-valuetext="Lundi"&gt;
-  &lt;/a&gt;
-&lt;/div&gt;
-</pre>
+    aria-valuetext="Lundi">
+  </a>
+</div>
+```
 
-<p>L'extrait de code ci-dessous décrit une fonction qui répond à l'action de l'utilisateur et actualise les attributs <code>aria-valuenow</code> et <code>aria-valuetext</code> :</p>
+L'extrait de code ci-dessous décrit une fonction qui répond à l'action de l'utilisateur et actualise les attributs `aria-valuenow` et `aria-valuetext` :
 
-<pre class="brush: js">var dayNames = ["Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi"];
+```js
+var dayNames = ["Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi"];
 var updateSlider = function (newValue) {
     var handle = document.getElementById("day-handle");
     handle.setAttribute("aria-valuenow", newValue.toString());
     handle.setAttribute("aria-valuetext", dayNames[newValue]);
 };
-</pre>
+```
 
-<h3 id="Notes">Notes</h3>
+### Notes
 
-<h3 id="Attributs_ARIA_utilisés">Attributs ARIA utilisés</h3>
+### Attributs ARIA utilisés
 
-<ul>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemin">aria-valuemin</a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemax">aria-valuemax</a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow">aria-valuenow</a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuetext">aria-valuetext</a> ;</li>
- <li><a href="/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-orientation">aria-orientation</a>.</li>
-</ul>
+- [aria-valuemin](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemin) ;
+- [aria-valuemax](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuemax) ;
+- [aria-valuenow](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuenow) ;
+- [aria-valuetext](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-valuetext) ;
+- [aria-orientation](/fr/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-orientation).
 
-<h3 id="Autres_ressources">Autres ressources</h3>
+### Autres ressources
 
-<ul>
- <li><a href="http://www.w3.org/TR/wai-aria/roles#slider">Spécifications WAI-ARIA pour le rôle <code>slider</code></a></li>
-</ul>
+- [Spécifications WAI-ARIA pour le rôle `slider`](http://www.w3.org/TR/wai-aria/roles#slider)
diff --git a/files/fr/web/accessibility/aria/aria_techniques/using_the_status_role/index.md b/files/fr/web/accessibility/aria/aria_techniques/using_the_status_role/index.md
index 38827d4db1..2c2e2acb40 100644
--- a/files/fr/web/accessibility/aria/aria_techniques/using_the_status_role/index.md
+++ b/files/fr/web/accessibility/aria/aria_techniques/using_the_status_role/index.md
@@ -8,43 +8,52 @@ tags:
 translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_status_role
 original_slug: Accessibilité/ARIA/Techniques_ARIA/Utiliser_le_role_status
 ---
-<h3 id="Description">Description</h3>
-
-<p>Cette technique présente l’utilisation du rôle <a href="http://www.w3.org/TR/wai-aria/roles#status">status</a> et décrit les effets produits sur les navigateurs et les technologies d’assistance.</p>
-
-<p>Le rôle <code>status</code> est un type de <a href="http://www.w3.org/WAI/PF/aria/terms#def_liveregion">zone live</a> et un conteneur dont le contenu est un message d’informations destiné à l’utilisateur. Ce message n’est pas assez important pour justifier une <a href="http://www.w3.org/TR/wai-aria/roles#alert">alerte</a>. Il est souvent présenté comme une barre d’état. Lorsque le rôle est ajouté à un élément, le navigateur émettra un événement <code>status</code> accessible aux produits de technologies d’assistance qui pourront alors le notifier à l’utilisateur.</p>
-<p>Le contenu des informations d’état doit être fourni dans un objet d’état et il faut s’assurer que cet objet ne reçoive pas le focus. Si une autre partie de la page contrôle ce qui s’affiche dans l’objet d’état, la relation doit être explicitement définie à l’aide de l’attribut <a href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-controls">aria-controls</a>.</p>
-<p>Les technologies d’assistance devraient réserver des cellules dans la grille Braille pour rendre l’état.</p>
-<h3 id="Effets_possibles_sur_les_agents_utilisateurs_et_les_technologies_d’assistance">Effets possibles sur les agents utilisateurs et les technologies d’assistance</h3>
-<p>Lorsque le rôle <code>status</code> est ajouté à un élément, ou qu’un tel élément devient visible, l’agent utilisateur devrait suivre les étapes suivantes :</p>
-<ul>
- <li>Présenter l’élément ayant un rôle de <code>status</code> à l’API d’accessibilité du système d’exploitation ;</li>
- <li>Déclencher un événement <code>status</code> accessible à l’aide l’API d’accessibilité du système d’exploitation si elle le prend en charge.</li>
-</ul>
-<p>Les technologies d’assistance devraient être à l’écoute de tels événements et les notifier à l’utilisateur en conséquence :</p>
-<ul>
- <li>Les lecteurs d’écran peuvent fournir une touche spécifique pour annoncer l’état actuel et ce dernier devrait présenter les contenus des états des zones live. Cela devrait être annoncé lorsque l'utilisateur est inactif, à moins que l'attribut <code>aria-live=”assertive”</code> soit défini dans quel cas l'utilisateur peut être interrompu ;</li>
- <li>Les loupes d’écran devraient agrandir l’objet d’état.</li>
-</ul>
-<div class="note">
- <p><strong>Note :</strong> il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.</p>
-</div>
-<h3 id="Exemples">Exemples</h3>
-<h4 id="Exemple_1_ajout_du_rôle_status_dans_le_code_HTML">Exemple 1 : ajout du rôle <code>status</code> dans le code HTML</h4>
-<p>L’extrait de code ci-dessous montre comment le rôle <code>status</code> est ajouté directement dans le code source HTML.</p>
-<pre class="brush: html">&lt;p role="status"&gt;Vos modifications ont été automatiquement enregistrées.&lt;/p&gt;
-</pre>
-<h4 id="Exemples_concrets">Exemples concrets :</h4>
-<h3 id="Notes">Notes</h3>
-<h3 id="Attributs_ARIA_utilisés">Attributs ARIA utilisés</h3>
-<ul>
- <li><a href="http://www.w3.org/TR/wai-aria/roles#status">status</a>.</li>
-</ul>
-<h3 id="Techniques_ARIA_connexes">Techniques ARIA connexes</h3>
-<ul>
- <li>Rôle <a href="http://www.w3.org/TR/wai-aria/roles#alert">alert</a>.</li>
-</ul>
-<h3 id="Autres_ressources">Autres ressources</h3>
-<ul>
- <li>Bonnes pratiques ARIA – Implémentation des zones live : <a href="http://www.w3.org/TR/wai-aria-practices/#LiveRegions">#LiveRegions</a>.</li>
-</ul>
+### Description
+
+Cette technique présente l’utilisation du rôle [status](http://www.w3.org/TR/wai-aria/roles#status) et décrit les effets produits sur les navigateurs et les technologies d’assistance.
+
+Le rôle `status` est un type de [zone live](http://www.w3.org/WAI/PF/aria/terms#def_liveregion) et un conteneur dont le contenu est un message d’informations destiné à l’utilisateur. Ce message n’est pas assez important pour justifier une [alerte](http://www.w3.org/TR/wai-aria/roles#alert). Il est souvent présenté comme une barre d’état. Lorsque le rôle est ajouté à un élément, le navigateur émettra un événement `status` accessible aux produits de technologies d’assistance qui pourront alors le notifier à l’utilisateur.
+
+Le contenu des informations d’état doit être fourni dans un objet d’état et il faut s’assurer que cet objet ne reçoive pas le focus. Si une autre partie de la page contrôle ce qui s’affiche dans l’objet d’état, la relation doit être explicitement définie à l’aide de l’attribut [aria-controls](http://www.w3.org/TR/wai-aria/states_and_properties#aria-controls).
+
+Les technologies d’assistance devraient réserver des cellules dans la grille Braille pour rendre l’état.
+
+### Effets possibles sur les agents utilisateurs et les technologies d’assistance
+
+Lorsque le rôle `status` est ajouté à un élément, ou qu’un tel élément devient visible, l’agent utilisateur devrait suivre les étapes suivantes :
+
+- Présenter l’élément ayant un rôle de `status` à l’API d’accessibilité du système d’exploitation ;
+- Déclencher un événement `status` accessible à l’aide l’API d’accessibilité du système d’exploitation si elle le prend en charge.
+
+Les technologies d’assistance devraient être à l’écoute de tels événements et les notifier à l’utilisateur en conséquence :
+
+- Les lecteurs d’écran peuvent fournir une touche spécifique pour annoncer l’état actuel et ce dernier devrait présenter les contenus des états des zones live. Cela devrait être annoncé lorsque l'utilisateur est inactif, à moins que l'attribut `aria-live=”assertive”` soit défini dans quel cas l'utilisateur peut être interrompu ;
+- Les loupes d’écran devraient agrandir l’objet d’état.
+
+> **Note :** il existe plusieurs points de vue sur la façon dont les technologies d’assistance devraient traiter cette technique. L’information fournie ci-dessus est l’une de ces opinions et n’est pas normative.
+
+### Exemples
+
+#### Exemple 1 : ajout du rôle `status` dans le code HTML
+
+L’extrait de code ci-dessous montre comment le rôle `status` est ajouté directement dans le code source HTML.
+
+```html
+<p role="status">Vos modifications ont été automatiquement enregistrées.</p>
+```
+
+#### Exemples concrets :
+
+### Notes
+
+### Attributs ARIA utilisés
+
+- [status](http://www.w3.org/TR/wai-aria/roles#status).
+
+### Techniques ARIA connexes
+
+- Rôle [alert](http://www.w3.org/TR/wai-aria/roles#alert).
+
+### Autres ressources
+
+- Bonnes pratiques ARIA – Implémentation des zones live : [#LiveRegions](http://www.w3.org/TR/wai-aria-practices/#LiveRegions).