Prepare Web API section for Markdown conversion (#2464)

* Remove summary classes and ids

* Remove unecessary hidden

* Remove useless span filled with useless attributes / ids

* Remove useless font

* Remove notranslate

* Remove id in other elements than headings

* Remove name attributes

* Remove <pre><code> for JS w/ language-js class

* Remove <pre><code> for HTML w/ language-html class

* Remove <pre><code> for other lang w/ language-* class

* Rm highlighted line in code samples

* fix links, internal, external, absolute URLs

* missing file from last commit

* Fix styles errors apart from table + some classes

* Fix notes and warnings (+ some other :x)

* fix typo during merge which broke a doc

* aand forgot a conflict

* fix remaining classes of errors except dls and images

* Fix dls

* Fix images (deki/mozillademos) and remaining style issues

* Remove script tag from svg file

* Remove script tag from svg fileS

* Compress SVG files for CI

6 files changed, 278 insertions, 304 deletions

diff --git a/files/fr/web/api/keyboardevent/charcode/index.html b/files/fr/web/api/keyboardevent/charcode/index.html
index 34335deca5..523257e055 100644
--- a/files/fr/web/api/keyboardevent/charcode/index.html
+++ b/files/fr/web/api/keyboardevent/charcode/index.html
@@ -18,12 +18,10 @@ translation_of: Web/API/KeyboardEvent/charCode
 <p>Pour des constantes équivalant ces codes numériques, voir {{ domxref("KeyboardEvent", "KeyEvent") }}.</p>
 
 <div class="note">
-<p><strong><code>N'utilisez plus cette propriété, elle est dépréciée.</code></strong></p>
-
-<p>Utilisez plutôt {{domxref("KeyboardEvent.key")}}.</p>
+<p><strong>Note :</strong> N'utilisez plus cette propriété, elle est dépréciée. Utilisez plutôt {{domxref("KeyboardEvent.key")}}.</p>
 </div>
 
-<h2 id="Syntax" name="Syntax">Syntaxe</h2>
+<h2 id="Syntax">Syntaxe</h2>
 
 <pre class="syntaxbox"><em>var value</em> = <em>event</em>.charCode;
 </pre>
@@ -32,7 +30,7 @@ translation_of: Web/API/KeyboardEvent/charCode
  <li><em><code>value</code></em> est la valeur Unicode du caractère associé à la touche pressée.</li>
 </ul>
 
-<h2 id="Example" name="Example">Exemple</h2>
+<h2 id="Example">Exemple</h2>
 
 <pre class="brush: js">&lt;html&gt;
   &lt;head&gt;
@@ -58,21 +56,21 @@ translation_of: Web/API/KeyboardEvent/charCode
 &lt;/html&gt;
 </pre>
 
-<h2 id="Notes" name="Notes">Notes</h2>
+<h2 id="Notes">Notes</h2>
 
 <p>Après un évènement {{ domxref("element.onkeypress", "keypress") }}, la valeur Unicode de la touche pressée est stockée dans l'une ou l'autre des propriétés <code>{{ domxref("event.keyCode", "keyCode") }}</code> et <code>charCode</code>, jamais les deux à la fois. Si la touche pressée génère un caractère (ex. 'a'), <code>charCode</code> prend la valeur du code de ce caractère, en respectant la casse. (i.e. <code>charCode</code> tient compte d'une touche Maj. enfoncée). Sinon, le code est stocké dans <code>keyCode</code>.</p>
 
-<p>Quand une ou plusieurs touche modificatrices sont pressées, il y a quelques règles complexes pour <code>charCode</code>, jetez un oeil à <a href="/en/Gecko_Keypress_Event" title="en/Gecko Keypress Event">Gecko Keypress Event</a> (en anglais) pour le détail.</p>
+<p>Quand une ou plusieurs touche modificatrices sont pressées, il y a quelques règles complexes pour <code>charCode</code>, jetez un oeil à <a href="/en/Gecko_Keypress_Event">Gecko Keypress Event</a> (en anglais) pour le détail.</p>
 
 <p><code>charCode</code> n'est jamais défini lors d'évènements {{ domxref("element.onkeydown", "keydown") }} et {{ domxref("element.onkeyup", "keyup") }}. Dans ces cas, <code>keyCode</code> is set instead.</p>
 
 <p>Pour obtenir le code de la touche qu'il soit stocké dans <code>keyCode</code> ou <code>charCode</code>, requêtez la propriété {{ domxref("event.which", "which") }}.</p>
 
-<p>Les caractères entrés via IME ne s'enregistrent pas sous <code>keyCode</code> ou <code>charCode</code>. <span class="comment">Actually with the Chinese IME I'm using, entering the IME results in a keypress event with keyCode = 229 and no other key events fire until the IME exits (which may happen after multiple characters are inputted). I'm not sure if other IME's work this way.</span></p>
+<p>Les caractères entrés via IME ne s'enregistrent pas sous <code>keyCode</code> ou <code>charCode</code>. Actually with the Chinese IME I'm using, entering the IME results in a keypress event with keyCode = 229 and no other key events fire until the IME exits (which may happen after multiple characters are inputted). I'm not sure if other IME's work this way.</p>
 
-<p>Pour une liste de valeurs de <code>charCode</code> associées à leurs touches, lancez l'exemple dans <a href="/en/Gecko_DOM_Reference/Examples#Example_7:_Displaying_Event_Object_Constants" title="en/Gecko_DOM_Reference/Examples#Example_7:_Displaying_Event_Object_Constants">Gecko DOM Reference:Examples #Example 7: Displaying Event Object Constants</a> (en anglais) et regardez le tableau HTML résultant.</p>
+<p>Pour une liste de valeurs de <code>charCode</code> associées à leurs touches, lancez l'exemple dans <a href="/en/Gecko_DOM_Reference/Examples#Example_7:_Displaying_Event_Object_Constants">Gecko DOM Reference:Examples #Example 7: Displaying Event Object Constants</a> (en anglais) et regardez le tableau HTML résultant.</p>
 
-<h2 id="Specifications" name="Specifications">Spécifications</h2>
+<h2 id="Specifications">Spécifications</h2>
 
 <table class="standard-table">
  <thead>
@@ -93,10 +91,4 @@ translation_of: Web/API/KeyboardEvent/charCode
 
 <h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
 
-
-
-<p>{{Compat("api.KeyboardEvent.charCode")}}</p>
-
-<div id="compat-desktop"></div>
-
-<div id="compat-mobile"></div>
+<p>{{Compat("api.KeyboardEvent.charCode")}}</p>
\ No newline at end of file
diff --git a/files/fr/web/api/keyboardevent/code/index.html b/files/fr/web/api/keyboardevent/code/index.html
index 04ebfa99e7..d9d70d3e19 100644
--- a/files/fr/web/api/keyboardevent/code/index.html
+++ b/files/fr/web/api/keyboardevent/code/index.html
@@ -12,7 +12,7 @@ translation_of: Web/API/KeyboardEvent/code
 ---
 <div>{{APIRef("DOM Events")}}</div>
 
-<p><span class="seoSummary">La propriété <strong><code>KeyboardEvent.code</code></strong> représente une touche physique du clavier (contrairement au caractère généré par celle-ci). En d'autres termes, cette propriété retourne une valeur qui n'est pas modifiée par la disposition du clavier ou l'état des touches de modification.</span></p>
+<p>La propriété <strong><code>KeyboardEvent.code</code></strong> représente une touche physique du clavier (contrairement au caractère généré par celle-ci). En d'autres termes, cette propriété retourne une valeur qui n'est pas modifiée par la disposition du clavier ou l'état des touches de modification.</p>
 
 <p>Si le clavier n'est pas physique, la valeur retournée sera définie par le navigateur pour être le plus proche possible des valeurs retournées par un clavier physique afin de maximiser la compatibilité entre un clavier physique et virtuel.</p>
 
@@ -64,11 +64,9 @@ translation_of: Web/API/KeyboardEvent/code
 
 <p>{{EmbedLiveSample('Pratiquer_KeyboardEvent', 600, 300) }}</p>
 
-<h3 id="Gérer_les_événements_de_clavier_dans_un_jeu"><span class="tlid-translation translation" lang="fr"><span title="">Gérer les événements de clavier dans un jeu</span></span></h3>
+<h3 id="Gérer_les_événements_de_clavier_dans_un_jeu">Gérer les événements de clavier dans un jeu</h3>
 
-<div class="text-wrap tlid-copy-target">
-<div class="result-shield-container tlid-copy-target"><span class="tlid-translation translation" lang="fr"><span title="">Cet exemple établit un écouteur d'événements pour</span></span> l'événement {{event("keydown")}}  <span class="tlid-translation translation" lang="fr"><span title="">qui gère la saisie au clavier pour un jeu qui utilise la disposition de clavier typique "ZQSD" pour se déplacer en avant, à gauche, en arrière et à droite.</span> <span title="">Cela utilisera les quatre mêmes touches physiquement, quels que soient les caractères correspondants, par exemple si l'utilisateur utilise un clavier QWERTY.</span></span></div>
-</div>
+<p>Cet exemple établit un écouteur d'événements pour l'événement {{event("keydown")}}  qui gère la saisie au clavier pour un jeu qui utilise la disposition de clavier typique "ZQSD" pour se déplacer en avant, à gauche, en arrière et à droite. Cela utilisera les quatre mêmes touches physiquement, quels que soient les caractères correspondants, par exemple si l'utilisateur utilise un clavier QWERTY.</p>
 
 <h4 id="HTML_2">HTML</h4>
 
@@ -138,7 +136,7 @@ let spaceship = document.getElementById("spaceship");
 }
 </pre>
 
-<p>La fonction <code>refresh()</code> <span class="tlid-translation translation" lang="fr"><span title="">gère l'application de la rotation et de la position à l'aide d'un</span></span> <a href="/en-US/docs/Web/SVG/Attribute/transform">SVG transform</a>.</p>
+<p>La fonction <code>refresh()</code> gère l'application de la rotation et de la position à l'aide d'un <a href="/en-US/docs/Web/SVG/Attribute/transform">SVG transform</a>.</p>
 
 <pre class="brush: js">function refresh() {
   let x = position.x - (shipSize.width/2);
@@ -149,7 +147,7 @@ let spaceship = document.getElementById("spaceship");
 }
 </pre>
 
-<p><span class="tlid-translation translation" lang="fr"><span title="">Enfin, la méthode <code>addEventListener()</code> est utilisée pour commencer à écouter les événements {{event ("keydown")}}, en mettant à jour chaque touche en mettant à jour la position et l’angle de rotation du vaisseau, puis en appelant la méthode <code>refresh()</code> pour tracer le navire dans sa nouvelle position </span><span title="">et son nouvel angle.</span></span></p>
+<p>Enfin, la méthode <code>addEventListener()</code> est utilisée pour commencer à écouter les événements {{event ("keydown")}}, en mettant à jour chaque touche en mettant à jour la position et l’angle de rotation du vaisseau, puis en appelant la méthode <code>refresh()</code> pour tracer le navire dans sa nouvelle position et son nouvel angle.</p>
 
 <pre class="brush: js">window.addEventListener("keydown", function(event) {
   if (event.preventDefaulted) {
@@ -191,7 +189,7 @@ let spaceship = document.getElementById("spaceship");
 
 <p>{{EmbedLiveSample("Handle_keyboard_events_in_a_game", 420, 460)}}</p>
 
-<p><span class="tlid-translation translation" lang="fr"><span title="">Ce code peut être amélioré de plusieurs manières.</span> <span title="">La plupart des jeux réels surveillent les événements</span></span> {{event("keydown")}}, <span class="tlid-translation translation" lang="fr"><span title="">démarrent le mouvement lorsque cela se produit et stoppent le mouvement lorsque l'événement</span></span> {{event("keyup")}} se produit, au lieu de compter sur des répétitions de touches. <span class="tlid-translation translation" lang="fr"><span title="">Cela permettrait des mouvements plus fluides et plus rapides, mais permettrait également au joueur de bouger et de diriger en même temps.</span> <span title="">Des transitions ou des animations peuvent également être utilisées pour rendre le mouvement du navire plus fluide.</span></span> Pour permettre cela, il ne faudrait pas utiliser de <code>switch</code>, ni de <code>else if</code>.ff</p>
+<p>Ce code peut être amélioré de plusieurs manières. La plupart des jeux réels surveillent les événements {{event("keydown")}}, démarrent le mouvement lorsque cela se produit et stoppent le mouvement lorsque l'événement {{event("keyup")}} se produit, au lieu de compter sur des répétitions de touches. Cela permettrait des mouvements plus fluides et plus rapides, mais permettrait également au joueur de bouger et de diriger en même temps. Des transitions ou des animations peuvent également être utilisées pour rendre le mouvement du navire plus fluide. Pour permettre cela, il ne faudrait pas utiliser de <code>switch</code>, ni de <code>else if</code>.ff</p>
 
 <h2 id="Spécifications">Spécifications</h2>
 
diff --git a/files/fr/web/api/keyboardevent/index.html b/files/fr/web/api/keyboardevent/index.html
index fe8ef03ea0..4ce7e9b411 100644
--- a/files/fr/web/api/keyboardevent/index.html
+++ b/files/fr/web/api/keyboardevent/index.html
@@ -14,7 +14,9 @@ translation_of: Web/API/KeyboardEvent
 
 <p>Les objets <strong><code>KeyboardEvent</code></strong> décrivent l'interaction d'un utilisateur avec le clavier. Chaque événement décrit une touche ; le type d'événement (<code>keydown</code>, <code>keypress</code>, ou <code>keyup</code>) identifie quel type d'activité a été effectué.</p>
 
-<div class="note"><strong>Note :</strong> <code>KeyboardEvent</code> indique exactement ce qui est en train de se passer sur une touche. Lorsque vous devez gérer une saisie de texte, utilisez l'événement <code>input</code> HTML5 à la place. Par exemple, si un utilisateur saisit du texte à partir d'un système d'écriture à la main comme une tablette PC, les événements touche peuvent ne pas être déclenchés.</div>
+<div class="note">
+  <p><strong>Note :</strong> <code>KeyboardEvent</code> indique exactement ce qui est en train de se passer sur une touche. Lorsque vous devez gérer une saisie de texte, utilisez l'événement <code>input</code> HTML5 à la place. Par exemple, si un utilisateur saisit du texte à partir d'un système d'écriture à la main comme une tablette PC, les événements touche peuvent ne pas être déclenchés.</p>
+</div>
 
 <h2 id="Constructeur">Constructeur</h2>
 
@@ -44,22 +46,18 @@ translation_of: Web/API/KeyboardEvent
  <dt>{{domxref("KeyboardEvent.altKey")}} {{Readonlyinline}}</dt>
  <dd>Returne un {{jsxref("Boolean")}} qui est <code>true</code> si la touche <kbd>Alt</kbd> (<kbd>Option</kbd> ou <kbd>⌥</kbd> sous OS X) était active quand l'évènement touche a été généré.</dd>
  <dt>{{domxref("KeyboardEvent.char")}} {{Non-standard_inline}}{{Deprecated_inline}}{{Readonlyinline}}</dt>
- <dd>Renvoie une {{domxref("DOMString")}} représentant la valeur de caractère de la touche. Si la touche correspond à un caractère imprimable, cette valeur est une chaîne Unicode non vide contenant ce caractère. Si la touche n'a pas de représentation imprimable, il s'agit d'une chaîne vide.</dd>
- <dd>
+ <dd><p>Renvoie une {{domxref("DOMString")}} représentant la valeur de caractère de la touche. Si la touche correspond à un caractère imprimable, cette valeur est une chaîne Unicode non vide contenant ce caractère. Si la touche n'a pas de représentation imprimable, il s'agit d'une chaîne vide.</p>
  <div class="note">
  <p><strong>Note :</strong> si la touche est utilisée comme une macro insérant plusieurs caractères, la valeur de cet attribut est la chaîne entière, pas seulement le premier caractère.</p>
  </div>
- </dd>
- <dd>
  <div class="warning">
- <p><strong>Avertissement :</strong> cela a été supprimé des DOM Level 3 Events. C'est pris en charge uniquement sur IE9 + et Microsoft Edge.</p>
+ <p><strong>Attention :</strong> cela a été supprimé des DOM Level 3 Events. C'est pris en charge uniquement sur IE9 + et Microsoft Edge.</p>
  </div>
  </dd>
  <dt>{{domxref("KeyboardEvent.charCode")}} {{Deprecated_inline}}{{Readonlyinline}}</dt>
- <dd>Retourne un {{jsxref ("Number")}} représentant le numéro de référence Unicode de la touche ; cet attribut est utilisé uniquement par l'événement <code>keypress</code>. Pour les touches dont l'attribut <code>char</code> contient plusieurs caractères, il s'agit de la valeur Unicode du premier caractère de cet attribut. Dans Firefox 26, cela retourne des codes pour les caractères imprimables.</dd>
- <dd>
+ <dd><p>Retourne un {{jsxref ("Number")}} représentant le numéro de référence Unicode de la touche ; cet attribut est utilisé uniquement par l'événement <code>keypress</code>. Pour les touches dont l'attribut <code>char</code> contient plusieurs caractères, il s'agit de la valeur Unicode du premier caractère de cet attribut. Dans Firefox 26, cela retourne des codes pour les caractères imprimables.</p>
  <div class="warning">
- <p><strong>Avertissement :</strong> cet attribut est obsolète : vous devriez utiliser {{domxref("KeyboardEvent.key")}} à la place, si disponible.</p>
+ <p><strong>Attention :</strong> cet attribut est obsolète : vous devriez utiliser {{domxref("KeyboardEvent.key")}} à la place, si disponible.</p>
  </div>
  </dd>
  <dt>{{domxref("KeyboardEvent.code")}} {{Readonlyinline}}</dt>
@@ -71,18 +69,18 @@ translation_of: Web/API/KeyboardEvent
  <dt>{{domxref("KeyboardEvent.key")}} {{Readonlyinline}}</dt>
  <dd>Retourne une {{domxref ("DOMString")}} représentant la valeur de touche de la touche représentée par l'événement.</dd>
  <dt>{{domxref("KeyboardEvent.keyCode")}} {{deprecated_inline}}{{Readonlyinline}}</dt>
- <dd>Retourne un {{jsxref("Number")}} représentant un code numérique dépendant du système et de l'implémentation, identifiant la valeur non modifiée de la touche pressée.
- <div class="warning"><strong>Avertissement : </strong>cet attribut est obsolète. vous devriez utiliser {{domxref("KeyboardEvent.key")}} à la place, si disponible.</div>
+ <dd><p>Retourne un {{jsxref("Number")}} représentant un code numérique dépendant du système et de l'implémentation, identifiant la valeur non modifiée de la touche pressée.</p>
+ <div class="warning"><p><strong>Attention :</strong> cet attribut est obsolète. vous devriez utiliser {{domxref("KeyboardEvent.key")}} à la place, si disponible.</p></div>
  </dd>
  <dt>{{domxref("KeyboardEvent.keyIdentifier")}} {{Non-standard_inline}}{{deprecated_inline}}{{Readonlyinline}}</dt>
  <dd>Cette propriété n'est pas standard et a été abandonnée en faveur de {{domxref("KeyboardEvent.key")}}. Elle faisait partie d'une ancienne version de DOM Level 3 Events.</dd>
  <dt>{{domxref("KeyboardEvent.keyLocation")}} {{Non-standard_inline}}{{deprecated_inline}}{{Readonlyinline}}</dt>
  <dd>C'est un alias obsolète non standard pour {{domxref("KeyboardEvent.location")}}. Il faisait partie d'une ancienne version de DOM Level 3 Events.</dd>
  <dt>{{domxref("KeyboardEvent.locale")}} {{Readonlyinline}}</dt>
- <dd>Retourne une {{domxref("DOMString")}} représentant une chaîne de paramètres régionaux indiquant les paramètres régionaux pour lesquels le clavier est configuré. Cela peut être une chaîne vide si le navigateur ou l'appareil ne connaît pas les paramètres régionaux du clavier.
- <div class="note"><strong>Note :</strong> cela ne décrit pas les paramètres régionaux des données entrées. Un utilisateur peut utiliser une disposition du clavier donnée, tout en saisissant du texte dans une autre langue.</div>
+ <dd><p>Retourne une {{domxref("DOMString")}} représentant une chaîne de paramètres régionaux indiquant les paramètres régionaux pour lesquels le clavier est configuré. Cela peut être une chaîne vide si le navigateur ou l'appareil ne connaît pas les paramètres régionaux du clavier.</p>
+ <div class="note"><p><strong>Note :</strong> cela ne décrit pas les paramètres régionaux des données entrées. Un utilisateur peut utiliser une disposition du clavier donnée, tout en saisissant du texte dans une autre langue.</p></div>
  </dd>
- <dt>{{domxref("KeyboardEvent.location")}}<a> {{Readonlyinline}}</a></dt>
+ <dt>{{domxref("KeyboardEvent.location")}}{{Readonlyinline}}</dt>
  <dd>Retourne un {{jsxref ("Number")}} représentant l'emplacement de la touche du clavier ou tout autre dispositif d'entrée.</dd>
  <dt>{{domxref("KeyboardEvent.metaKey")}} {{Readonlyinline}}</dt>
  <dd>Retourne un {{jsxref("Boolean")}} qui est <code>true</code> si la touche <kbd>Meta</kbd> (sur les claviers Mac, la touche <kbd>⌘ Command</kbd> ; sur les claviers Windows, la touche Windows (<kbd>⊞</kbd>)) était active quand l'évènement touche a été généré.</dd>
@@ -91,8 +89,8 @@ translation_of: Web/API/KeyboardEvent
  <dt>{{domxref("KeyboardEvent.shiftKey")}} {{Readonlyinline}}</dt>
  <dd>Retourne un {{jsxref("Boolean")}} qui est <code>true</code> si la touche <kbd>Shift</kbd> était active quand l'évènement touche a été généré.</dd>
  <dt>{{domxref("KeyboardEvent.which")}} {{deprecated_inline}}{{Readonlyinline}}</dt>
- <dd>Retourne un {{jsxref("Number")}} représentant un code numérique dépendant du système et de l'implémentation, identifiant la valeur non modifiée de la touche pressée ; c'est généralement le même que <code>keyCode</code>.
- <div class="warning"><strong>Avertissement :</strong> cet attribut est obsolète ; vous devriez utiliser {{domxref("KeyboardEvent.key")}} à la place, si disponible.</div>
+ <dd><p>Retourne un {{jsxref("Number")}} représentant un code numérique dépendant du système et de l'implémentation, identifiant la valeur non modifiée de la touche pressée ; c'est généralement le même que <code>keyCode</code>.</p>
+ <div class="warning"><p><strong>Attention :</strong> cet attribut est obsolète ; vous devriez utiliser {{domxref("KeyboardEvent.key")}} à la place, si disponible.</p></div>
  </dd>
 </dl>
 
@@ -111,15 +109,13 @@ translation_of: Web/API/KeyboardEvent
 <p>Certaines touches inversent l'état d'un voyant lumineux ; celles-ci comprennent des touches telles que Caps Lock, Num Lock et Scroll Lock. Sous Windows et Linux, ces touches génèrent uniquement les événements <code>keydown</code> et <code>keyup</code>.</p>
 
 <div class="note">
-<p>Sous Linux, Firefox 12 et les versions antérieures ont également envoyé l'événement <code>keypress</code> pour ces touches.</p>
+<p><strong>Note :</strong> Sous Linux, Firefox 12 et les versions antérieures ont également envoyé l'événement <code>keypress</code> pour ces touches.</p>
 </div>
 
 <p>Cependant, une limitation du modèle d'événement Mac OS X fait que Caps Lock ne génère que l'événement <code>keydown</code>. Num Lock était supporté sur certains modèles d'ordinateurs portables plus anciens (modèles 2007 et plus anciens), mais depuis lors, Mac OS X n'a pas supporté Num Lock même sur les claviers externes. Sur les MacBooks plus anciens avec une touche Num Lock, cette touche ne génère aucun événement touche. Gecko supporte la touche Scroll Lock si un clavier externe ayant une touche F14 est connecté. Dans certaines anciennes versions de Firefox, cette touche générait un événement <code>keypress</code> ; ce comportement incohérent était le {{bug(602812)}}.</p>
 
 <h3 id="Gestion_de_l'auto-répétition">Gestion de l'auto-répétition</h3>
 
-<p> </p>
-
 <p>Lorsqu'une touche est maintenue enfoncée, elle commence à se répéter automatiquement. Cela a pour résultat qu'une suite d'événements similaire à ce qui suit est générée :</p>
 
 <ol>
@@ -165,7 +161,9 @@ translation_of: Web/API/KeyboardEvent
  <dd>Le comportement de l'événement dépend de la plate-forme particulière. Il se comportera comme Windows ou Mac suivant ce que fait le modèle d'événement natif.</dd>
 </dl>
 
-<p class="note"><strong>Note :</strong> le déclenchement manuel d'un événement ne génère <em>pas</em> l'action par défaut associée à cet événement. Par exemple, le déclenchement manuel d'un événement touche n'entraîne pas l'apparition de cette lettre dans une zone de saisie de texte ayant la focalisation. Dans le cas des événements de l'interface utilisateur, cela est important pour des raisons de sécurité, car cela empêche les scripts de simuler les actions de l'utilisateur interagissant avec le navigateur lui-même.</p>
+<div class="note">
+  <p><strong>Note :</strong> le déclenchement manuel d'un événement ne génère <em>pas</em> l'action par défaut associée à cet événement. Par exemple, le déclenchement manuel d'un événement touche n'entraîne pas l'apparition de cette lettre dans une zone de saisie de texte ayant la focalisation. Dans le cas des événements de l'interface utilisateur, cela est important pour des raisons de sécurité, car cela empêche les scripts de simuler les actions de l'utilisateur interagissant avec le navigateur lui-même.</p>
+</div>
 
 <h2 id="Exemple">Exemple</h2>
 
diff --git a/files/fr/web/api/keyboardevent/key/index.html b/files/fr/web/api/keyboardevent/key/index.html
index cf51e90dc4..bfd9846960 100644
--- a/files/fr/web/api/keyboardevent/key/index.html
+++ b/files/fr/web/api/keyboardevent/key/index.html
@@ -15,11 +15,9 @@ translation_of: Web/API/KeyboardEvent/key
 
 <p>La propriété en lecture seule de <code>key</code> de l'interface {{domxref("KeyboardEvent")}} retourne la valeur d’une ou plusieurs touches pressées par l’utilisateur, tout en tenant compte de l'état des touches de modification telles que la touche <kbd>Shift</kbd> (<em>majuscules</em>) ainsi que les paramètres régionaux des clavier et mise en page. Ce peut être l’une des valeurs suivantes :</p>
 
-<div class="pull-aside moreinfo">
 <h4 id="Valeurs_des_touches">Valeurs des touches</h4>
 
-<p>Voir une liste complète des <a href="https://developer.mozilla.org/fr/docs/Web/API/KeyboardEvent/key/Key_Values">valeurs de touches</a></p>
-</div>
+<p>Voir une liste complète des <a href="/fr/docs/Web/API/KeyboardEvent/key/Key_Values">valeurs de touches</a></p>
 
 <ul>
  <li>
@@ -56,83 +54,83 @@ translation_of: Web/API/KeyboardEvent/key
 
 <h3 id="HTML">HTML</h3>
 
-<pre class="brush: html line-numbers  language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>fx<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>textarea</span> <span class="attr-name token">rows</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>5<span class="punctuation token">"</span></span> <span class="attr-name token">name</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>test-target<span class="punctuation token">"</span></span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>test-target<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>textarea</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>button</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>button<span class="punctuation token">"</span></span> <span class="attr-name token">name</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>btn-clear-console<span class="punctuation token">"</span></span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>btn-clear-console<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>clear console<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>button</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>flex<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>console-log<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span></code></pre>
+<pre class="brush: html">&lt;div class="fx"&gt;
+  &lt;div&gt;
+    &lt;textarea rows="5" name="test-target" id="test-target"&gt;&lt;/textarea&gt;
+    &lt;button type="button" name="btn-clear-console" id="btn-clear-console"&gt;clear console&lt;/button&gt;
+  &lt;/div&gt;
+  &lt;div class="flex"&gt;
+    &lt;div id="console-log"&gt;&lt;/div&gt;
+  &lt;/div&gt;
+&lt;/div&gt;</pre>
 
 <h3 id="CSS">CSS</h3>
 
-<pre class="brush: css line-numbers  language-css"><code class="language-css"><span class="selector token"><span class="class token">.fx</span> </span><span class="punctuation token">{</span>
-  <span class="property token">-webkit-display</span><span class="punctuation token">:</span> flex<span class="punctuation token">;</span>
-  <span class="property token">display</span><span class="punctuation token">:</span> flex<span class="punctuation token">;</span>
-  <span class="property token">margin-left</span><span class="punctuation token">:</span> -<span class="number token">20</span>px<span class="punctuation token">;</span>
-  <span class="property token">margin-right</span><span class="punctuation token">:</span> -<span class="number token">20</span>px<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="selector token"><span class="class token">.fx</span> &gt; div </span><span class="punctuation token">{</span>
-  <span class="property token">padding-left</span><span class="punctuation token">:</span> <span class="number token">20</span>px<span class="punctuation token">;</span>
-  <span class="property token">padding-right</span><span class="punctuation token">:</span> <span class="number token">20</span>px<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="selector token"><span class="class token">.fx</span> &gt; div<span class="pseudo-class token">:first-child</span> </span><span class="punctuation token">{</span>
-   <span class="property token">width</span><span class="punctuation token">:</span> <span class="number token">30%</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="selector token"><span class="class token">.flex</span> </span><span class="punctuation token">{</span>
-  <span class="property token">-webkit-flex</span><span class="punctuation token">:</span> <span class="number token">1</span><span class="punctuation token">;</span>
-  <span class="property token">flex</span><span class="punctuation token">:</span> <span class="number token">1</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="selector token"><span class="id token">#test-target</span> </span><span class="punctuation token">{</span>
-  <span class="property token">display</span><span class="punctuation token">:</span> block<span class="punctuation token">;</span>
-  <span class="property token">width</span><span class="punctuation token">:</span> <span class="number token">100%</span><span class="punctuation token">;</span>
-  <span class="property token">margin-bottom</span><span class="punctuation token">:</span> <span class="number token">10</span>px<span class="punctuation token">;</span>
-<span class="punctuation token">}</span></code></pre>
+<pre class="brush: css">.fx {
+  -webkit-display: flex;
+  display: flex;
+  margin-left: -20px;
+  margin-right: -20px;
+}
+
+.fx &gt; div {
+  padding-left: 20px;
+  padding-right: 20px;
+}
+
+.fx &gt; div:first-child {
+   width: 30%;
+}
+
+.flex {
+  -webkit-flex: 1;
+  flex: 1;
+}
+
+#test-target {
+  display: block;
+  width: 100%;
+  margin-bottom: 10px;
+}</pre>
 
 <h3 id="JavaScript">JavaScript</h3>
 
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">let</span> textarea <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">'test-target'</span><span class="punctuation token">)</span><span class="punctuation token">,</span>
-consoleLog <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">'console-log'</span><span class="punctuation token">)</span><span class="punctuation token">,</span>
-btnClearConsole <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">'btn-clear-console'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<pre class="brush: js">let textarea = document.getElementById('test-target'),
+consoleLog = document.getElementById('console-log'),
+btnClearConsole = document.getElementById('btn-clear-console');
 
-<span class="keyword token">function</span> <span class="function token">logMessage</span><span class="punctuation token">(</span>message<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  <span class="keyword token">let</span> p <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">createElement</span><span class="punctuation token">(</span><span class="string token">'p'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-  p<span class="punctuation token">.</span><span class="function token">appendChild</span><span class="punctuation token">(</span>document<span class="punctuation token">.</span><span class="function token">createTextNode</span><span class="punctuation token">(</span>message<span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-  consoleLog<span class="punctuation token">.</span><span class="function token">appendChild</span><span class="punctuation token">(</span>p<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
+function logMessage(message) {
+  let p = document.createElement('p');
+  p.appendChild(document.createTextNode(message));
+  consoleLog.appendChild(p);
+}
 
-textarea<span class="punctuation token">.</span><span class="function token">addEventListener</span><span class="punctuation token">(</span><span class="string token">'keydown'</span><span class="punctuation token">,</span> <span class="punctuation token">(</span>e<span class="punctuation token">)</span> <span class="operator token">=</span><span class="operator token">&gt;</span> <span class="punctuation token">{</span>
-  <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="operator token">!</span>e<span class="punctuation token">.</span>repeat<span class="punctuation token">)</span>
-    <span class="function token">logMessage</span><span class="punctuation token">(</span>`first keydown event<span class="punctuation token">.</span> key property value is <span class="string token">"${e.key}"</span><span class="template-string token"><span class="string token">`);
+textarea.addEventListener('keydown', (e) =&gt; {
+  if (!e.repeat)
+    logMessage(`first keydown event. key property value is "${e.key}"`);
   else
-    logMessage(`</span></span>keydown event repeats<span class="punctuation token">.</span> key property value is <span class="string token">"${e.key}"</span>`<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-textarea<span class="punctuation token">.</span><span class="function token">addEventListener</span><span class="punctuation token">(</span><span class="string token">'beforeinput'</span><span class="punctuation token">,</span> <span class="punctuation token">(</span>e<span class="punctuation token">)</span> <span class="operator token">=</span><span class="operator token">&gt;</span> <span class="punctuation token">{</span>
-  <span class="function token">logMessage</span><span class="punctuation token">(</span>`beforeinput event<span class="punctuation token">.</span> you are about inputing <span class="string token">"${e.data}"</span>`<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-textarea<span class="punctuation token">.</span><span class="function token">addEventListener</span><span class="punctuation token">(</span><span class="string token">'input'</span><span class="punctuation token">,</span> <span class="punctuation token">(</span>e<span class="punctuation token">)</span> <span class="operator token">=</span><span class="operator token">&gt;</span> <span class="punctuation token">{</span>
-  <span class="function token">logMessage</span><span class="punctuation token">(</span>`input event<span class="punctuation token">.</span> you have just inputed <span class="string token">"${e.data}"</span>`<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-textarea<span class="punctuation token">.</span><span class="function token">addEventListener</span><span class="punctuation token">(</span><span class="string token">'keyup'</span><span class="punctuation token">,</span> <span class="punctuation token">(</span>e<span class="punctuation token">)</span> <span class="operator token">=</span><span class="operator token">&gt;</span> <span class="punctuation token">{</span>
-  <span class="function token">logMessage</span><span class="punctuation token">(</span>`keyup event<span class="punctuation token">.</span> key property value is <span class="string token">"${e.key}"</span>`<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-btnClearConsole<span class="punctuation token">.</span><span class="function token">addEventListener</span><span class="punctuation token">(</span><span class="string token">'click'</span><span class="punctuation token">,</span> <span class="punctuation token">(</span>e<span class="punctuation token">)</span> <span class="operator token">=</span><span class="operator token">&gt;</span> <span class="punctuation token">{</span>
-  <span class="keyword token">let</span> child <span class="operator token">=</span> consoleLog<span class="punctuation token">.</span>firstChild<span class="punctuation token">;</span>
-  <span class="keyword token">while</span> <span class="punctuation token">(</span>child<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-   consoleLog<span class="punctuation token">.</span><span class="function token">removeChild</span><span class="punctuation token">(</span>child<span class="punctuation token">)</span><span class="punctuation token">;</span>
-   child <span class="operator token">=</span> consoleLog<span class="punctuation token">.</span>firstChild<span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+    logMessage(`keydown event repeats. key property value is "${e.key}"`);
+});
+
+textarea.addEventListener('beforeinput', (e) =&gt; {
+  logMessage(`beforeinput event. you are about inputing "${e.data}"`);
+});
+
+textarea.addEventListener('input', (e) =&gt; {
+  logMessage(`input event. you have just inputed "${e.data}"`);
+});
+
+textarea.addEventListener('keyup', (e) =&gt; {
+  logMessage(`keyup event. key property value is "${e.key}"`);
+});
+
+btnClearConsole.addEventListener('click', (e) =&gt; {
+  let child = consoleLog.firstChild;
+  while (child) {
+   consoleLog.removeChild(child);
+   child = consoleLog.firstChild;
+  }
+});</pre>
 
 <h3 id="Résultat">Résultat</h3>
 
@@ -164,7 +162,7 @@ btnClearConsole<span class="punctuation token">.</span><span class="function tok
 
 <h2 id="Exemple">Exemple</h2>
 
-<p><span id="result_box" lang="fr"><span>Cet exemple utilise {{domxref("EventTarget.addEventListener()")}} pour écouter les événements </span></span> {{domxref("Element/keydown_event", "keydown")}} <span lang="fr"><span>.</span> <span>Quand ils se produisent, la valeur de la touche est vérifiée pour voir si c'est l'une des touches qui intéressent le code, et si c'est le cas, elle est traitée (éventuellement en pilotant un vaisseau spatial, peut-être en changeant la cellule sélectionnée dans une feuille de calcul</span><span>).</span></span></p>
+<p>Cet exemple utilise {{domxref("EventTarget.addEventListener()")}} pour écouter les événements  {{domxref("Element/keydown_event", "keydown")}} . Quand ils se produisent, la valeur de la touche est vérifiée pour voir si c'est l'une des touches qui intéressent le code, et si c'est le cas, elle est traitée (éventuellement en pilotant un vaisseau spatial, peut-être en changeant la cellule sélectionnée dans une feuille de calcul).</p>
 
 <pre class="brush: js">window.addEventListener("keydown", function (event) {
   if (event.defaultPrevented) {
@@ -218,10 +216,4 @@ btnClearConsole<span class="punctuation token">.</span><span class="function tok
 
 <h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
 
-
-
-<p>{{Compat("api.KeyboardEvent.key")}}</p>
-
-<div id="compat-desktop"></div>
-
-<div id="compat-mobile"></div>
+<p>{{Compat("api.KeyboardEvent.key")}}</p>
\ No newline at end of file
diff --git a/files/fr/web/api/keyboardevent/key/key_values/index.html b/files/fr/web/api/keyboardevent/key/key_values/index.html
index a61f42654e..07c8ba499c 100644
--- a/files/fr/web/api/keyboardevent/key/key_values/index.html
+++ b/files/fr/web/api/keyboardevent/key/key_values/index.html
@@ -5,9 +5,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 ---
 <p>Les tableaux ci-dessous énumèrent les valeurs clés standard dans différentes catégories de clés, avec une explication de l'utilisation habituelle de la clé. Les codes de clés virtuels correspondants pour les plateformes communes sont inclus lorsqu'ils sont disponibles.</p>
 
-<div class="pull-aside">
-<div class="moreinfo">Apprenez à utiliser ces valeurs clés en JavaScript en utilisant <a href="/fr/docs/Web/API/KeyboardEvent/key">KeyboardEvent.key</a></div>
-</div>
+<p>Apprenez à utiliser ces valeurs clés en JavaScript en utilisant <a href="/fr/docs/Web/API/KeyboardEvent/key">KeyboardEvent.key</a></p>
 
 <p><a href="#Special_values">Special Values </a>| <a href="#Modifier_keys">Modifier Keys</a> | <a href="#Whitespace_keys">Whitespace Keys</a> | <a href="#Navigation_keys">Navigation Keys</a> | <a href="#Editing_keys">Editing Keys</a> | <a href="#UI_keys">UI Keys</a> | <a href="#Device_keys">Device Keys</a> | <a href="#IME_and_composition_keys">IME and Composition Keys</a> | <a href="#Function_keys">Function Keys</a> | <a href="#Phone_keys">Phone Keys</a> | <a href="#Multimedia_keys">Multimedia Keys</a> | <a href="#Audio_control_keys">Audio Control Keys</a> | <a href="#TV_control_keys">TV Control Keys</a> | <a href="#Media_controller_keys">Media Controller Keys</a> | <a href="#Speech_recognition_keys">Speech Recognition Keys</a> | <a href="#Document_keys">Document Keys</a> | <a href="#Application_selector_keys">Application Selector Keys</a> | <a href="#Browser_control_keys">Browser Control Keys</a> | <a href="#Numeric_keypad_keys">Numeric Keypad Keys</a></p>
 
@@ -18,15 +16,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Valeur</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Code clé virtuel</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Valeur</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Code clé virtuel</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
  </thead>
  <tbody>
@@ -48,15 +46,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
   <tr>
    <td><code>"Alt"</code> [5]</td>
@@ -228,15 +226,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
  </thead>
  <tbody>
@@ -290,15 +288,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
  </thead>
  <tbody>
@@ -392,15 +390,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
  </thead>
  <tbody>
@@ -526,15 +524,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
  </thead>
  <tbody>
@@ -625,7 +623,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
   <tr>
    <td><code>"Pause"</code></td>
    <td>The <kbd>Pause</kbd> key. Pauses the current application or state, if applicable.
-    <div class="note">This shouldn't be confused with the <code>"MediaPause"</code> key value, which is used for media controllers, rather than to control applications and processes.</div>
+    <div class="note"><p><strong>Note :</strong> This shouldn't be confused with the <code>"MediaPause"</code> key value, which is used for media controllers, rather than to control applications and processes.</p></div>
    </td>
    <td><code>VK_PAUSE</code> (0x13)</td>
    <td></td>
@@ -637,7 +635,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
   <tr>
    <td><code>"Play"</code></td>
    <td>The <kbd>Play</kbd> key. Resumes a previously paused application, if applicable.
-    <div class="note">This shouldn't be confused with the <code>"MediaPlay"</code> key value, which is used for media controllers, rather than to control applications and processes.</div>
+    <div class="note"><p><strong>Note :</strong> This shouldn't be confused with the <code>"MediaPlay"</code> key value, which is used for media controllers, rather than to control applications and processes.</p></div>
    </td>
    <td><code>VK_PLAY</code> (0xFA)</td>
    <td></td>
@@ -699,15 +697,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
  </thead>
  <tbody>
@@ -750,7 +748,7 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
   <tr>
    <td><code>"Power"</code></td>
    <td>The <kbd>Power</kbd> button or key, to toggle power on and off.
-    <div class="note">Not all systems pass this key through to to the user agent.</div>
+    <div class="note"><p><strong>Note :</strong> Not all systems pass this key through to to the user agent.</p></div>
    </td>
    <td></td>
    <td></td>
@@ -829,15 +827,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
  </thead>
  <tbody>
@@ -1010,15 +1008,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
   <tr>
    <td><code>"HangulMode"</code></td>
@@ -1059,15 +1057,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
   <tr>
    <td><code>"Eisu"</code> [1]</td>
@@ -1463,15 +1461,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
   <tr>
    <td><code>"F1"</code></td>
@@ -1699,15 +1697,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
   <tr>
    <td><code>"AppSwitch"</code></td>
@@ -1817,15 +1815,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
   <tr>
    <td><code>"ChannelDown"</code></td>
@@ -1940,15 +1938,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
   <tr>
    <td><code>"AudioBalanceLeft"</code></td>
@@ -2121,15 +2119,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
   <tr>
    <td><code>"TV"</code> [1]</td>
@@ -2392,21 +2390,21 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 </ul>
 
 <div class="note">
-<p>Remote controls typically include keys whose values are already defined elsewhere, such as under {{anch("Multimedia keys")}} or {{anch("Audio control keys")}}. Those keys' values will match what's documented in those tables.</p>
+<p><strong>Note :</strong> Remote controls typically include keys whose values are already defined elsewhere, such as under {{anch("Multimedia keys")}} or {{anch("Audio control keys")}}. Those keys' values will match what's documented in those tables.</p>
 </div>
 
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
   <tr>
    <td><code>"AVRInput"</code> [3]</td>
@@ -3002,15 +3000,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
   <tr>
    <td><code>"SpeechCorrectionList"</code> [1]</td>
@@ -3042,15 +3040,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
   <tr>
    <td><code>"Close"</code> [1]</td>
@@ -3145,15 +3143,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
   <tr>
    <td><code>"LaunchCalculator"</code> [5]</td>
@@ -3441,15 +3439,15 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
   <tr>
    <td><code>"BrowserBack"</code></td>
@@ -3532,21 +3530,21 @@ translation_of: Web/API/KeyboardEvent/key/Key_Values
 <p>These keys are found on the keyboard's numeric keypad. However, not all are present on every keyboard. Although typical numeric keypads have numeric keys from <kbd>0</kbd> to <kbd>9</kbd> (encoded as <code>"0"</code> through <code>"9"</code>), some multimedia keyboards include additional number keys for higher numbers.</p>
 
 <div class="note">
-<p>The <kbd>10</kbd> key, if present, generates events with the <code>key</code> value of <code>"0"</code>.</p>
+<p><strong>Note :</strong>The <kbd>10</kbd> key, if present, generates events with the <code>key</code> value of <code>"0"</code>.</p>
 </div>
 
 <table class="standard-table">
  <thead>
   <tr>
-   <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th>
-   <th rowspan="2" scope="col" style="text-align: left;">Description</th>
-   <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th>
+   <th rowspan="2" scope="col"><code>KeyboardEvent.key</code> Value</th>
+   <th rowspan="2" scope="col">Description</th>
+   <th colspan="4" scope="col">Virtual Keycode</th>
   </tr>
   <tr>
-   <th scope="col" style="text-align: left;">Windows</th>
-   <th scope="col" style="text-align: left;">Mac</th>
-   <th scope="col" style="text-align: left;">Linux</th>
-   <th scope="col" style="text-align: left;">Android</th>
+   <th scope="col">Windows</th>
+   <th scope="col">Mac</th>
+   <th scope="col">Linux</th>
+   <th scope="col">Android</th>
   </tr>
   <tr>
    <td><code>"Decimal"</code> [1] {{obsolete_inline}}</td>
diff --git a/files/fr/web/api/keyboardevent/keyboardevent/index.html b/files/fr/web/api/keyboardevent/keyboardevent/index.html
index 2f63832ae4..f488108a15 100644
--- a/files/fr/web/api/keyboardevent/keyboardevent/index.html
+++ b/files/fr/web/api/keyboardevent/keyboardevent/index.html
@@ -15,41 +15,37 @@ translation_of: Web/API/KeyboardEvent/KeyboardEvent
 
 <h2 id="Syntaxe">Syntaxe</h2>
 
-<pre class="syntaxbox"> <em>event</em> = new KeyboardEvent(<em>typeArg</em>, <em>KeyboardEventInit</em>);</pre>
+<pre class="syntaxbox"> event = new KeyboardEvent(typeArg, KeyboardEventInit);</pre>
 
 <h3 id="Valeurs">Valeurs</h3>
 
 <dl>
- <dt><em>typeArg</em></dt>
+ <dt>typeArg</dt>
  <dd>Une représentation du nom de l'évènement sous forme de {{domxref("DOMString")}}.</dd>
- <dt><em>KeyboardEventInit</em>{{optional_inline}}</dt>
-</dl>
-
-<dl>
- <dd>Un dictionnaire <code>KeyboardEventInit</code> ayant les champs suivants :
-
+ <dt>KeyboardEventInit{{optional_inline}}</dt>
+ <dd><p>Un dictionnaire <code>KeyboardEventInit</code> ayant les champs suivants :</p>
  <ul>
-  <li><code>"key"</code>, optionnel et par défaut <code>""</code>, de type {{domxref("DOMString")}}, qui définit la valeur de {{domxref("KeyboardEvent.key")}}.</li>
-  <li><code>"code"</code>, optionnel et par défaut <code>""</code>, de type {{domxref("DOMString")}}, qui définit la valeur de {{domxref("KeyboardEvent.code")}}.</li>
-  <li><code>"location"</code>, optionnel et par défaut <code>0</code>, de type <code>unsigned long</code>, qui définit la valeur de {{domxref("KeyboardEvent.location")}}.</li>
-  <li><code>"ctrlKey"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.ctrlKey")}}.</li>
-  <li><code>"shiftKey"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.shiftKey")}}.</li>
-  <li><code>"altKey"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.altKey")}}.</li>
-  <li><code>"metaKey"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.metaKey")}}.</li>
-  <li><code>"repeat"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.repeat")}}.</li>
-  <li><code>"isComposing"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.isComposing")}}.</li>
-  <li><code>"charCode"</code>, optionnel et par défaut <code>0</code>, de type <code>unsigned long</code>, qui définit la valeur du déprécié {{domxref("KeyboardEvent.charCode")}}.</li>
-  <li><code>"keyCode"</code>, optionnel et par défaut <code>0</code>, de type <code>unsigned long</code>, qui définit la valeur du déprécié {{domxref("KeyboardEvent.keyCode")}}.</li>
-  <li><code>"which"</code>, optionnel et par défaut <code>0</code>, de type <code>unsigned long</code>, qui définit la valeur du déprécié {{domxref("KeyboardEvent.which")}}.</li>
+  <li><code>"key"</code>, optionnel et par défaut <code>""</code>, de type {{domxref("DOMString")}}, qui définit la valeur de {{domxref("KeyboardEvent.key")}}.</li>
+  <li><code>"code"</code>, optionnel et par défaut <code>""</code>, de type {{domxref("DOMString")}}, qui définit la valeur de {{domxref("KeyboardEvent.code")}}.</li>
+  <li><code>"location"</code>, optionnel et par défaut <code>0</code>, de type <code>unsigned long</code>, qui définit la valeur de {{domxref("KeyboardEvent.location")}}.</li>
+  <li><code>"ctrlKey"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.ctrlKey")}}.</li>
+  <li><code>"shiftKey"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.shiftKey")}}.</li>
+  <li><code>"altKey"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.altKey")}}.</li>
+  <li><code>"metaKey"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.metaKey")}}.</li>
+  <li><code>"repeat"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.repeat")}}.</li>
+  <li><code>"isComposing"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.isComposing")}}.</li>
+  <li><code>"charCode"</code>, optionnel et par défaut <code>0</code>, de type <code>unsigned long</code>, qui définit la valeur du déprécié {{domxref("KeyboardEvent.charCode")}}.</li>
+  <li><code>"keyCode"</code>, optionnel et par défaut <code>0</code>, de type <code>unsigned long</code>, qui définit la valeur du déprécié {{domxref("KeyboardEvent.keyCode")}}.</li>
+  <li><code>"which"</code>, optionnel et par défaut <code>0</code>, de type <code>unsigned long</code>, qui définit la valeur du déprécié {{domxref("KeyboardEvent.which")}}.</li>
  </ul>
-
- <div class="note">
- <p><em>Le dictionnaire <code>KeyboardEventInit</code></em><em> accepte aussi les champs des dictionnaires  {{domxref("UIEvent.UIEvent", "UIEventInit")}} et {{domxref("Event.Event", "EventInit")}}.</em></p>
- </div>
  </dd>
 </dl>
 
-<h2 id="Specifications" name="Specifications">Spécifications</h2>
+<div class="note">
+  <p><strong>Note :</strong> Le dictionnaire <code>KeyboardEventInit</code> accepte aussi les champs des dictionnaires  {{domxref("UIEvent.UIEvent", "UIEventInit")}} et {{domxref("Event.Event", "EventInit")}}.</p>
+</div>
+
+<h2 id="Specifications">Spécifications</h2>
 
 <table class="standard-table">
  <thead>