diff options
| author | SphinxKnight <SphinxKnight@users.noreply.github.com> | 2022-03-16 17:52:18 +0100 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2022-03-16 17:52:18 +0100 |
| commit | 500f444d23a7a758da229ebe6b9691cc5d4fe731 (patch) | |
| tree | ca277561f7f3c5f2c9c3e80a895ac32f30852238 /files/fr/web/html | |
| parent | de831e4687986c3a60b9ced69ce9faefda8df4b9 (diff) | |
| download | translated-content-500f444d23a7a758da229ebe6b9691cc5d4fe731.tar.gz translated-content-500f444d23a7a758da229ebe6b9691cc5d4fe731.tar.bz2 translated-content-500f444d23a7a758da229ebe6b9691cc5d4fe731.zip | |
Fix #4269 - Removes empty/special characters (#4270)
* Remove ufeff
* Remove u2064
* Remove u2062
* Replace u202f followed by : with :
* Replace u202f next to « or » with and « or »
* Replace u202f followed by ; with ;
* Replace u202f followed by ! with
* Replace u202f followed by ? with ?
* Replace remaining u202f with classical space
* Replace u200b surrounded by space with classical space
* Replace u200b surrounded by space with classical space - again (repeated)
* Remove remaining u200b
* Remove u200a
* Replace u2009 with
* Remove u00ad
* Replace u00a0 followed by : ! or ? with and punctuation
* Replace u00a0 surrounded « or » with and punctuation
* Replace u00a0 followed by whitespaces
* Replace u00a0 preceded by whitespaces
* Replace u00a0 followed by a newline with a newline
* Replace u00a0 followed by a newline with a newline - Take2
* Replace u00a0 followed by a ; and punctuation
* Remove u00a0 followed by ,
* Remove u00a0 in indentation spaces with \n([ ]*)([\u00a0])([ ]*)
* Manual replacement of ([\u00a0])([ ]+)
* Replace remaining ([\u00a0]+) by a space
* cleaning empty elements
* remove ufe0f
* Remove u00a0 and u202f after merging against updated main
* remove double whitespace using (\w)( )(\w)
Diffstat (limited to 'files/fr/web/html')
79 files changed, 247 insertions, 247 deletions
diff --git a/files/fr/web/html/attributes/accept/index.md b/files/fr/web/html/attributes/accept/index.md index 66c18d9ef0..825503001a 100644 --- a/files/fr/web/html/attributes/accept/index.md +++ b/files/fr/web/html/attributes/accept/index.md @@ -16,14 +16,14 @@ L'attribut **`accept`** prend comme valeur une liste séparée par des virgules Comme un type de fichier donné peut être identifié de plusieurs manières, il est utile de fournir un ensemble complet de spécificateurs de type lorsque vous avez besoin de fichiers d'un type spécifique, ou d'utiliser le joker pour indiquer qu'un type de n'importe quel format est accepté. -Par exemple, il existe un certain nombre de façons d'identifier les fichiers Microsoft Word, de sorte qu'un site qui accepte les fichiers Word pourrait utiliser un `<input>` comme celui-ci : +Par exemple, il existe un certain nombre de façons d'identifier les fichiers Microsoft Word, de sorte qu'un site qui accepte les fichiers Word pourrait utiliser un `<input>` comme celui-ci : ```html <input type="file" id="docpicker" accept=".doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document"> ``` -En revanche, si vous acceptez un fichier multimédia, vous pouvez inclure tout format de ce type de média : +En revanche, si vous acceptez un fichier multimédia, vous pouvez inclure tout format de ce type de média : ```html <input type="file" id="soundFile" accept="audio/*"> diff --git a/files/fr/web/html/date_and_time_formats/index.md b/files/fr/web/html/date_and_time_formats/index.md index 48353fd7b2..ed70cec78d 100644 --- a/files/fr/web/html/date_and_time_formats/index.md +++ b/files/fr/web/html/date_and_time_formats/index.md @@ -264,7 +264,7 @@ On notera que les deux composantes pour l'année et pour la semaine sont complé ## Représentation des mois -Une chaîne de caractères pour un mois représente un mois d'une année donnée (plutôt qu'un mois « générique »). Aussi, on ne représentera pas simplement le mois de janvier mais le mois de janvier de l'année 1972. +Une chaîne de caractères pour un mois représente un mois d'une année donnée (plutôt qu'un mois « générique »). Aussi, on ne représentera pas simplement le mois de janvier mais le mois de janvier de l'année 1972. Une chaîne de caractères représentant un mois est valide si elle commence par un numéro d'année valide (une chaîne de caractères composée de quatre chiffres), suivie d'un tiret ("`-`", ou U+002D), suivi d'un nombre sur deux chiffres où `01` représente janvier et où `12` représente décembre. diff --git a/files/fr/web/html/element/a/index.md b/files/fr/web/html/element/a/index.md index fc5bbdf380..f703aa989b 100644 --- a/files/fr/web/html/element/a/index.md +++ b/files/fr/web/html/element/a/index.md @@ -418,7 +418,7 @@ Les personnes qui utilisent des outils d'assistance à la navigation comme des l Si une icône est utilisée en lieu et place du texte pour indiquer ce comportement, on s'assurera qu'elle contient bien [une description alternative](/fr/docs/Web/HTML/Element/Img#attr-alt). ```html -<a target="_blank" href="https://www.wikipedia.org"> +<a target="_blank" href="https://www.wikipedia.org"> Wikipédia <img alt="(s'ouvre dans un nouvel onglet)" src="newtab.svg"> </a> diff --git a/files/fr/web/html/element/audio/index.md b/files/fr/web/html/element/audio/index.md index 1345b3da29..d42cb18d38 100644 --- a/files/fr/web/html/element/audio/index.md +++ b/files/fr/web/html/element/audio/index.md @@ -231,7 +231,7 @@ En plus des dialogues parlés, les sous-titres et les transcriptions doivent ég 00:00:52 --> 00:01:02 [sur un ton énervé] Vous rendez la poulette ou c'est plus vous qui donnez à manger aux lapins ? -Une autre bonne pratique consiste à fournir du contenu comme un lien de téléchargement comme méthode alternative pour les personnes qui utilisent un navigateur qui ne prend pas en charge `<audio>` : +Une autre bonne pratique consiste à fournir du contenu comme un lien de téléchargement comme méthode alternative pour les personnes qui utilisent un navigateur qui ne prend pas en charge `<audio>` : ```html <audio controls> diff --git a/files/fr/web/html/element/colgroup/index.md b/files/fr/web/html/element/colgroup/index.md index fa0f0b76a7..42417eeaf4 100644 --- a/files/fr/web/html/element/colgroup/index.md +++ b/files/fr/web/html/element/colgroup/index.md @@ -135,7 +135,7 @@ Les attributs suivants sont dépréciés et ne doivent pas être utilisés. Ils - **`bgcolor`** {{deprecated_inline}} - - : La couleur de fond du tableau. Il s'agit d'un [code RVB hexadécimal à 6 chiffres](/fr/docs/Web/CSS/color_value#rgb_colors), préfixé par un « `#` ». L'un des [mots-clés de couleur](/fr/docs/Web/CSS/color_value#color_keywords) prédéfinis peut également être utilisé. + - : La couleur de fond du tableau. Il s'agit d'un [code RVB hexadécimal à 6 chiffres](/fr/docs/Web/CSS/color_value#rgb_colors), préfixé par un « `#` ». L'un des [mots-clés de couleur](/fr/docs/Web/CSS/color_value#color_keywords) prédéfinis peut également être utilisé. Pour obtenir un effet similaire, utilisez la propriété CSS [`background-color`](/fr/docs/Web/CSS/background-color). diff --git a/files/fr/web/html/element/head/index.md b/files/fr/web/html/element/head/index.md index f5ba498b1e..cbbbc9a6f0 100644 --- a/files/fr/web/html/element/head/index.md +++ b/files/fr/web/html/element/head/index.md @@ -94,7 +94,7 @@ La plupart des navigateurs conformes à HTML5 construisent automatiquement l'él | ---------------------------------------------------------------------------------------------------------------- | -------------------------------- | -------------------------------------------------- | | {{SpecName('HTML WHATWG', 'semantics.html#the-head-element', '<head>')}} | {{Spec2('HTML WHATWG')}} | Aucune modification depuis la dernière dérivation. | | {{SpecName('HTML5 W3C', 'document-metadata.html#the-head-element', '<head>')}} | {{Spec2('HTML5 W3C')}} | L'attribut `profile` est désormais obsolète. | -| {{SpecName('HTML4.01', 'global.html#h-7.4.1', '<head>')}} | {{Spec2('HTML4.01')}} |  | +| {{SpecName('HTML4.01', 'global.html#h-7.4.1', '<head>')}} | {{Spec2('HTML4.01')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/hgroup/index.md b/files/fr/web/html/element/hgroup/index.md index 4b4e76d8c1..f07358ec1f 100644 --- a/files/fr/web/html/element/hgroup/index.md +++ b/files/fr/web/html/element/hgroup/index.md @@ -10,7 +10,7 @@ translation_of: Web/HTML/Element/hgroup --- {{HTMLRef}} -L'élément HTML **`<hgroup>`** représente un titre de plusieurs niveaux pour une section d'un document. Il regroupe un ensemble d'éléments [`<h1>–<h6>`](/fr/docs/Web/HTML/Element/Heading_Elements). +L'élément HTML **`<hgroup>`** représente un titre de plusieurs niveaux pour une section d'un document. Il regroupe un ensemble d'éléments [`<h1>–<h6>`](/fr/docs/Web/HTML/Element/Heading_Elements). {{EmbedInteractiveExample("pages/tabbed/hgroup.html", "tabbed-standard")}} @@ -139,7 +139,7 @@ Ici, le titre secondaire est placé entre parenthèses après le titre principal | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------------------ | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'semantics.html#the-hgroup-element', '<hgroup>')}} | {{Spec2('HTML WHATWG')}} |  | +| {{SpecName('HTML WHATWG', 'semantics.html#the-hgroup-element', '<hgroup>')}} | {{Spec2('HTML WHATWG')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/input/button/index.md b/files/fr/web/html/element/input/button/index.md index e0ff7fcca8..ef0e339629 100644 --- a/files/fr/web/html/element/input/button/index.md +++ b/files/fr/web/html/element/input/button/index.md @@ -144,7 +144,7 @@ function disableBtn() { Si l'attribut `disabled` n'est pas fourni, il est hérité depuis l'élément parent. De cette façon, on peut activer/désactiver des groupes d'éléments en les plaçant dans un conteneur (par exemple un élément {{HTMLElement("fieldset")}}) et en indiquant `disabled` sur le conteneur. -C'est ce qu'illustre l'exemple suivant. Il est semblable à l'exemple précédent mais l'attribut `disabled` est activé sur l'élément `<fieldset>` lorsqu'on appuie sur le premier bouton. Les trois autres boutons sont donc désactivés pendant deux secondes. +C'est ce qu'illustre l'exemple suivant. Il est semblable à l'exemple précédent mais l'attribut `disabled` est activé sur l'élément `<fieldset>` lorsqu'on appuie sur le premier bouton. Les trois autres boutons sont donc désactivés pendant deux secondes. #### Exemple 2 diff --git a/files/fr/web/html/element/input/date/index.md b/files/fr/web/html/element/input/date/index.md index 0ec7d916c7..a41d265409 100644 --- a/files/fr/web/html/element/input/date/index.md +++ b/files/fr/web/html/element/input/date/index.md @@ -233,7 +233,7 @@ C'est pour cela que la meilleure solution consiste à avoir trois champs de sais ## Exemples -Dans l'exemple qui suit, on crée deux éléments d'interface utilisateur afin de choisir une date : le premier qui utilise un sélecteur natif `<input type="date">` et un second qui utilise trois éléments {{htmlelement("select")}} qui permettra de choisir une date pour les anciens navigateurs qui ne prendraient pas en charge le contrôle natif. +Dans l'exemple qui suit, on crée deux éléments d'interface utilisateur afin de choisir une date : le premier qui utilise un sélecteur natif `<input type="date">` et un second qui utilise trois éléments {{htmlelement("select")}} qui permettra de choisir une date pour les anciens navigateurs qui ne prendraient pas en charge le contrôle natif. {{EmbedLiveSample('Exemples', 600, 100)}} @@ -348,7 +348,7 @@ function populateDays(month) { // Si le mois est février, on calcule si l'année est bissextile var year = yearSelect.value; var leap = new Date(year, 1, 29).getMonth() == 1; -   dayNum = leap ? 29 : 28; + dayNum = leap ? 29 : 28; } // on ajoute le bon nombre de jours dans autant @@ -441,7 +441,7 @@ daySelect.onchange = function() { <td> {{htmlattrxref("autocomplete", "input")}}, {{htmlattrxref("list", "input")}}, - {{htmlattrxref("readonly", "input")}} et + {{htmlattrxref("readonly", "input")}} et {{htmlattrxref("step", "input")}} </td> </tr> diff --git a/files/fr/web/html/element/input/datetime-local/index.md b/files/fr/web/html/element/input/datetime-local/index.md index 02f7a49cd6..a5d22bfb05 100644 --- a/files/fr/web/html/element/input/datetime-local/index.md +++ b/files/fr/web/html/element/input/datetime-local/index.md @@ -222,7 +222,7 @@ C'est ce second problème qui est le plus important. Comme nous l'avons mentionn - `mm-dd-yyyy HH:mm` (heure exprimée sur 24 heures) - etc. -Une façon de contourner ce problème est de placer un attribut {{htmlattrxref("pattern", "input")}} dans l'élément ` <input type="``datetime-local"> `. Bien que cet élément n'utilise pas cet attribut, s'il est converti en `<input type="text">` par le navigateur, le motif sera alors utilisé. Vous pouvez par exemple essayer le code suivant dans un navigateur qui ne prend pas en charge `<input type="datetime-local">` : +Une façon de contourner ce problème est de placer un attribut {{htmlattrxref("pattern", "input")}} dans l'élément ` <input type="``datetime-local"> `. Bien que cet élément n'utilise pas cet attribut, s'il est converti en `<input type="text">` par le navigateur, le motif sera alors utilisé. Vous pouvez par exemple essayer le code suivant dans un navigateur qui ne prend pas en charge `<input type="datetime-local">` : ```html <form> diff --git a/files/fr/web/html/element/input/email/index.md b/files/fr/web/html/element/input/email/index.md index 22250ac4cf..769f4ae2d2 100644 --- a/files/fr/web/html/element/input/email/index.md +++ b/files/fr/web/html/element/input/email/index.md @@ -290,7 +290,7 @@ C'est pour cela qu'on indique la chaîne de caractères "Merci de fournir unique ## Exemples -Dans l'exemple qui suit, on peut saisir une adresse électronique qui contient au plus 256 caractères. La boîte de saisie affichera au plus 64 caractères et contiendra le texte `"user@example.gov"` comme indication lorsque le champ est vide. On trouve également l'attribut {{htmlattrxref("multiple", "input")}} qui permet de saisir zéro ou plusieurs adresses séparées par des virgules (cf. ci-avant). Enfin, l'attribut {{htmlattrxref("list", "input")}} utilisé indique un identifiant d'un élément {{HTMLElement("datalist")}} dont les éléments {{HTMLElement("option")}} déterminent les valeurs suggérées qui peuvent être sélectionnées par l'utilisateur. +Dans l'exemple qui suit, on peut saisir une adresse électronique qui contient au plus 256 caractères. La boîte de saisie affichera au plus 64 caractères et contiendra le texte `"user@example.gov"` comme indication lorsque le champ est vide. On trouve également l'attribut {{htmlattrxref("multiple", "input")}} qui permet de saisir zéro ou plusieurs adresses séparées par des virgules (cf. ci-avant). Enfin, l'attribut {{htmlattrxref("list", "input")}} utilisé indique un identifiant d'un élément {{HTMLElement("datalist")}} dont les éléments {{HTMLElement("option")}} déterminent les valeurs suggérées qui peuvent être sélectionnées par l'utilisateur. L'élément {{HTMLElement("label")}} qui précède l'élément `<input>` permettra d'afficher un libellé avant la boîte de saisie. Le lien entre les deux est fait grâce à l'attribut `for` qui contient `"emailAddress"` qui est l'identifiant de l'élément {{HTMLElement("input")}}. Grâce à cette association, cliquer sur l'étiquette permettra de placer le focus sur le champ de saisie. @@ -338,7 +338,7 @@ L'élément {{HTMLElement("label")}} qui précède l'élément `<input>` permett {{htmlattrxref("multiple", "input")}}, {{htmlattrxref("pattern", "input")}}, {{htmlattrxref("placeholder", "input")}}, - {{htmlattrxref("readonly", "input")}}, {{htmlattrxref("required", "input")}} + {{htmlattrxref("readonly", "input")}}, {{htmlattrxref("required", "input")}} et {{htmlattrxref("size", "input")}} </td> </tr> diff --git a/files/fr/web/html/element/input/file/index.md b/files/fr/web/html/element/input/file/index.md index 8d329673d4..7f9e702da0 100644 --- a/files/fr/web/html/element/input/file/index.md +++ b/files/fr/web/html/element/input/file/index.md @@ -80,7 +80,7 @@ Un identifiant de type de fichier est une chaîne de caractères qui décrit le - Une extension de fichier valide, sensible à la casse et qui commence par un point (« . »). Par exemple : `.jpg`, `.pdf` ou `.doc`. - Un type MIME valide, sans extension. - La chaîne de caractères `audio/*` qui indique « n'importe quel fichier audio » -- La chaîne de caractères `video/*` qui indique « n'importe quel fichier vidéo » +- La chaîne de caractères `video/*` qui indique « n'importe quel fichier vidéo » - La chaîne de caractères `image/*` qui indique « n'importe quel fichier image ». L'attribut `accept` prend comme valeur une chaîne de caractères composée d'un ou plusieurs identifiants de type, séparés par des virgules. Ainsi, si un sélecteur de fichier doit permettre de sélectionner des images ou des documents PDF, on pourra écrire : @@ -125,7 +125,7 @@ Lorsqu'on envoie le formulaire de l'exemple, le nom de chaque fichier sera ajout ### Obtenir des informations sur les fichiers sélectionnés -Les fichiers sélectionnés peuvent être obtenus sous la forme d'un objet {{domxref("FileList")}} renvoyé par la propriété `HTMLInputElement.files` de l'élement du DOM. Cet objet est une liste d'objets {{domxref("File")}}. Un objet `FileList` se comporte comme un tableau et on peut donc consulter sa longueur (la propriété `length`) afin de connaître le nombre de fichiers sélectionnés. +Les fichiers sélectionnés peuvent être obtenus sous la forme d'un objet {{domxref("FileList")}} renvoyé par la propriété `HTMLInputElement.files` de l'élement du DOM. Cet objet est une liste d'objets {{domxref("File")}}. Un objet `FileList` se comporte comme un tableau et on peut donc consulter sa longueur (la propriété `length`) afin de connaître le nombre de fichiers sélectionnés. Chaque objet `File` contient les informations suivantes : diff --git a/files/fr/web/html/element/input/image/index.md b/files/fr/web/html/element/input/image/index.md index 03ffa06680..44772647af 100644 --- a/files/fr/web/html/element/input/image/index.md +++ b/files/fr/web/html/element/input/image/index.md @@ -58,7 +58,7 @@ Une chaîne de caractères qui identifie la méthode d'encodage à utiliser pour - `application/x-www-form-urlencoded` - : Les informations sont envoyées sous la forme d'une chaîne de caractères ajoutée à l'URL en utilisant l'algorithme de {{jsxref("encodeURI", "encodeURI()")}}. **Cette valeur est la valeur par défaut.** - `multipart/form-data` - - : Cette valeur utilise l'API {{domxref("FormData")}} pour gérer les données et permet d'*uploader*des fichiers. Cet encodage _doit_ être utilisé s'il y a des éléments {{HTMLElement("input")}} de {{htmlattrxref("type", "input")}} `"file"` ([`<input type="file">`](/fr/docs/Web/HTML/Element/input/file)). + - : Cette valeur utilise l'API {{domxref("FormData")}} pour gérer les données et permet d'*uploader*des fichiers. Cet encodage _doit_ être utilisé s'il y a des éléments {{HTMLElement("input")}} de {{htmlattrxref("type", "input")}} `"file"` ([`<input type="file">`](/fr/docs/Web/HTML/Element/input/file)). - `text/plain` - : Les données sont envoyées comme texte simple. Cette valeur est généralement utile pour déboguer car elle permet de voir facilement les données envoyées. diff --git a/files/fr/web/html/element/input/index.md b/files/fr/web/html/element/input/index.md index ccbdcb79bc..35adc2c7eb 100644 --- a/files/fr/web/html/element/input/index.md +++ b/files/fr/web/html/element/input/index.md @@ -25,7 +25,7 @@ Les types de champs disponibles sont : - `{{HTMLElement("input/button", "button")}}` : un bouton sans comportement défini. - `{{HTMLElement("input/checkbox", "checkbox")}}` : une case à cocher qui permet de sélectionner/déselectionner une valeur - `{{HTMLElement("input/color", "color")}}` : {{HTMLVersionInline("5")}} un contrôle qui permet de définir une couleur. -- `{{HTMLElement("input/date", "date")}}` : {{HTMLVersionInline("5")}} un contrôle qui permet de saisir une date (composé d'un jour, d'un mois et d'une année). +- `{{HTMLElement("input/date", "date")}}` : {{HTMLVersionInline("5")}} un contrôle qui permet de saisir une date (composé d'un jour, d'un mois et d'une année). - `{{HTMLElement("input/datetime-local", "datetime-local")}}` : {{HTMLVersionInline("5")}} un contrôle qui permet de saisir une date et une heure (sans fuseau horaire). - `{{HTMLElement("input/email", "email")}}` : {{HTMLVersionInline("5")}} un champ qui permet de saisir une adresse éléctronique. - `{{HTMLElement("input/file", "file")}}` : un contrôle qui permet de sélectionner un fichier. L'attribut **`accept`** définit les types de fichiers qui peuvent être sélectionnés. @@ -122,7 +122,7 @@ L'attribut `list` n'est pas pris en charge pour les types `hidden`, `password`, Une chaîne de caractères qui définit le nom associé au champ. Ce nom sera envoyé avec la valeur lors de l'envoi du formulaire. -Lorsqu'un champ a un nom, cette valeur devient une propriété de {{domxref("HTMLFormElement.elements")}} qu'on pourra utiliser en JavaScript (ex. si on a un attribut `name` qui vaut `hat-size` : +Lorsqu'un champ a un nom, cette valeur devient une propriété de {{domxref("HTMLFormElement.elements")}} qu'on pourra utiliser en JavaScript (ex. si on a un attribut `name` qui vaut `hat-size` : ```js let form = document.querySelector("form"); diff --git a/files/fr/web/html/element/input/password/index.md b/files/fr/web/html/element/input/password/index.md index 3099a4465e..b4e3a11e68 100644 --- a/files/fr/web/html/element/input/password/index.md +++ b/files/fr/web/html/element/input/password/index.md @@ -252,7 +252,7 @@ L'attribut {{htmlattrxref("inputmode", "input")}} vaut `number`, ce qui incite l <td> {{domxref("HTMLInputElement.select", "select()")}}, {{domxref("HTMLInputElement.setRangeText", "setRangeText()")}} - et + et {{domxref("HTMLInputElement.setSelectionRange", "setSelectionRange()")}} </td> </tr> diff --git a/files/fr/web/html/element/input/range/index.md b/files/fr/web/html/element/input/range/index.md index eb985953b5..377e4c12c2 100644 --- a/files/fr/web/html/element/input/range/index.md +++ b/files/fr/web/html/element/input/range/index.md @@ -18,7 +18,7 @@ Si le navigateur de l'utilisateur ne prend pas en charge le type `range`, il uti ## Valeur -L'attribut {{htmlattrxref("value", "input")}} contient une chaîne de caractères {{domxref("DOMString")}} qui correspond à la représentation textuelle du nombre sélectionnée. La valeur n'est jamais une chaîne vide (`""`). La valeur par défaut est celle médiane entre le minimum et le maximum (sauf si la valeur maximale indiquée est inférieure à la valeur minimale, auquel cas la valeur par défaut est celle de l'attribut `min`). Voici un fragment de code illustrant cet algorithme pour le choix de la valeur par défaut : +L'attribut {{htmlattrxref("value", "input")}} contient une chaîne de caractères {{domxref("DOMString")}} qui correspond à la représentation textuelle du nombre sélectionnée. La valeur n'est jamais une chaîne vide (`""`). La valeur par défaut est celle médiane entre le minimum et le maximum (sauf si la valeur maximale indiquée est inférieure à la valeur minimale, auquel cas la valeur par défaut est celle de l'attribut `min`). Voici un fragment de code illustrant cet algorithme pour le choix de la valeur par défaut : ```js defaultValue = (rangeElem.max < rangeElem.min) ? rangeElem.min @@ -106,7 +106,7 @@ Cet exemple permet à l'utilisateur de choisir une valeur entre 0 et 3.14 sans a ### Ajouter des marques et des étiquettes -La spécification HTML fournit une certaine flexibilité aux navigateurs pour représenter le contrôle de saisie. La spécification indique comment ajouter des informations pour certains niveaux de l'intervalle grâce à l'attribut {{htmlattrxref("list", "input")}} et à un élément {{HTMLElement("datalist")}}. En revanche, il n'y a pas de spécifications précises quant aux marques (tirets) positionnés le long du contrôle. +La spécification HTML fournit une certaine flexibilité aux navigateurs pour représenter le contrôle de saisie. La spécification indique comment ajouter des informations pour certains niveaux de l'intervalle grâce à l'attribut {{htmlattrxref("list", "input")}} et à un élément {{HTMLElement("datalist")}}. En revanche, il n'y a pas de spécifications précises quant aux marques (tirets) positionnés le long du contrôle. #### Aperçus @@ -278,9 +278,9 @@ Ensuite, on applique quelques règles CSS. Voici la règle CSS pour l'élément ```css .slider-wrapper { display: inline-block; - width: 20px; - height: 150px; - padding: 0; + width: 20px; + height: 150px; + padding: 0; } ``` @@ -288,11 +288,11 @@ Ensuite, on applique une transformation sur l'élément `<input>` au sein de l'e ```css .slider-wrapper input { - width: 150px; - height: 20px; - margin: 0; - transform-origin: 75px 75px; - transform: rotate(-90deg); + width: 150px; + height: 20px; + margin: 0; + transform-origin: 75px 75px; + transform: rotate(-90deg); } ``` diff --git a/files/fr/web/html/element/input/reset/index.md b/files/fr/web/html/element/input/reset/index.md index c05051aea7..1e429b0cab 100644 --- a/files/fr/web/html/element/input/reset/index.md +++ b/files/fr/web/html/element/input/reset/index.md @@ -122,7 +122,7 @@ Aucune fonctionnalité de vérification native côté client n'est implémentée <tr> <td><strong>Attributs pris en charge</strong></td> <td> - {{htmlattrxref("type", "input")}} et + {{htmlattrxref("type", "input")}} et {{htmlattrxref("value", "input")}} </td> </tr> diff --git a/files/fr/web/html/element/input/search/index.md b/files/fr/web/html/element/input/search/index.md index a7bfd39ab4..c90ac45edc 100644 --- a/files/fr/web/html/element/input/search/index.md +++ b/files/fr/web/html/element/input/search/index.md @@ -376,7 +376,7 @@ Vous pouvez consulter un exemple de formulaire de recherche dans notre exemple [ {{htmlattrxref("autocomplete", "input")}}, {{htmlattrxref("list", "input")}}, {{htmlattrxref("maxlength", "input")}}, - {{htmlattrxref("minlength", "input")}}, {{htmlattrxref("pattern", "input")}}, {{htmlattrxref("placeholder", "input")}}, {{htmlattrxref("required", "input")}}, {{htmlattrxref("size", "input")}}. + {{htmlattrxref("minlength", "input")}}, {{htmlattrxref("pattern", "input")}}, {{htmlattrxref("placeholder", "input")}}, {{htmlattrxref("required", "input")}}, {{htmlattrxref("size", "input")}}. </td> </tr> <tr> diff --git a/files/fr/web/html/element/input/submit/index.md b/files/fr/web/html/element/input/submit/index.md index 01d495d09b..3899db3da1 100644 --- a/files/fr/web/html/element/input/submit/index.md +++ b/files/fr/web/html/element/input/submit/index.md @@ -60,7 +60,7 @@ Une chaîne de caractères qui identifie la méthode d'encodage à utiliser pour - `application/x-www-form-urlencoded` - : Les informations sont envoyées sous la forme d'une chaîne de caractères ajoutée à l'URL en utilisant l'algorithme de {{jsxref("encodeURI", "encodeURI()")}}. **Cette valeur est la valeur par défaut.** - `multipart/form-data` - - : Cette valeur utilise l'API {{domxref("FormData")}} pour gérer les données et permet d'*uploader*des fichiers. Cet encodage _doit_ être utilisé s'il y a des éléments {{HTMLElement("input")}} de {{htmlattrxref("type", "input")}} `"file"` ([`<input type="file">`](/fr/docs/Web/HTML/Element/input/file)). + - : Cette valeur utilise l'API {{domxref("FormData")}} pour gérer les données et permet d'*uploader*des fichiers. Cet encodage _doit_ être utilisé s'il y a des éléments {{HTMLElement("input")}} de {{htmlattrxref("type", "input")}} `"file"` ([`<input type="file">`](/fr/docs/Web/HTML/Element/input/file)). - `text/plain` - : Les données sont envoyées comme texte simple. Cette valeur est généralement utile pour déboguer car elle permet de voir facilement les données envoyées. diff --git a/files/fr/web/html/element/input/tel/index.md b/files/fr/web/html/element/input/tel/index.md index 5b503a511e..02fdce9c4e 100644 --- a/files/fr/web/html/element/input/tel/index.md +++ b/files/fr/web/html/element/input/tel/index.md @@ -112,7 +112,7 @@ Dans l'exemple suivant, on a un contrôle `"tel"` avec un attribut `placeholder` ```html <input id="telNo" name="telNo" type="tel" -      placeholder="01 23 45 67 89"> + placeholder="01 23 45 67 89"> ``` {{EmbedLiveSample('Textes_indicatifs_-_placeholders', 600, 40)}} @@ -127,7 +127,7 @@ La taille physique de la boîte de saisie peut être contrôlée avec l'attribut ```html <input id="telNo" name="telNo" type="tel" -      size="20"> + size="20"> ``` {{EmbedLiveSample('La_taille_physique', 600, 40)}} @@ -140,7 +140,7 @@ Dans l'exemple qui suit, on crée un contrôle qui mesure 20 caractères de larg ```html <input id="telNo" name="telNo" type="tel" -      size="20" minlength="9" maxlength="14"> + size="20" minlength="9" maxlength="14"> ``` {{EmbedLiveSample("La_longueur_de_la_valeur", 600, 40)}} @@ -153,29 +153,29 @@ Il est possible de fournir une valeur par défaut en renseignant au préalable l ```html <input id="telNo" name="telNo" type="tel" -      value="01 23 45 67 89"> + value="01 23 45 67 89"> ``` {{EmbedLiveSample("Fournir_une_valeur_par_défaut", 600, 40)}} #### Afficher des suggestions -Si on souhaite aller plus loin, on peut fournir une liste de suggestions parmi lesquelles l'utilisateur pourra choisir (il pourra également saisir la valeur de son choix si celle-ci ne fait pas partie de la liste). Pour cela, on utilisera l'attribut {{htmlattrxref("list", "input")}} dont la valeur est l'identifiant d'un élément {{HTMLElement("datalist")}} qui contient autant d'éléments {{HTMLElement("option")}} que de valeurs suggérées. C'est la valeur de l'attribut `value` de chaque élément `<option>` qui sera utilisée comme suggestion. +Si on souhaite aller plus loin, on peut fournir une liste de suggestions parmi lesquelles l'utilisateur pourra choisir (il pourra également saisir la valeur de son choix si celle-ci ne fait pas partie de la liste). Pour cela, on utilisera l'attribut {{htmlattrxref("list", "input")}} dont la valeur est l'identifiant d'un élément {{HTMLElement("datalist")}} qui contient autant d'éléments {{HTMLElement("option")}} que de valeurs suggérées. C'est la valeur de l'attribut `value` de chaque élément `<option>` qui sera utilisée comme suggestion. ```html <input id="telNo" name="telNo" type="tel" list="defaultTels"> <datalist id="defaultTels"> - <option value="01 23 45 67 89"> - <option value="02 45 67 89 01"> - <option value="03 45 67 89 12"> - <option value="04 56 87 98 32"> + <option value="01 23 45 67 89"> + <option value="02 45 67 89 01"> + <option value="03 45 67 89 12"> + <option value="04 56 87 98 32"> </datalist> ``` {{EmbedLiveSample("Afficher_des_suggestions", 600, 40)}} -Avec l'élément {{HTMLElement("datalist")}} contenant ces différentes valeurs {{HTMLElement("option")}}, le navigateur affichera une liste déroulante (ou un autre élément d'interface utilisateur) afin que l'utilisateur puisse éventuellement choisir parmi les suggestions. Lorsque l'utilisateur saisit dans le contrôle, la liste des suggestions est restreinte à celles qui correspondent encore. +Avec l'élément {{HTMLElement("datalist")}} contenant ces différentes valeurs {{HTMLElement("option")}}, le navigateur affichera une liste déroulante (ou un autre élément d'interface utilisateur) afin que l'utilisateur puisse éventuellement choisir parmi les suggestions. Lorsque l'utilisateur saisit dans le contrôle, la liste des suggestions est restreinte à celles qui correspondent encore. ## Validation diff --git a/files/fr/web/html/element/input/text/index.md b/files/fr/web/html/element/input/text/index.md index 1b616957e4..a6f1e700d6 100644 --- a/files/fr/web/html/element/input/text/index.md +++ b/files/fr/web/html/element/input/text/index.md @@ -52,7 +52,7 @@ Le champ [ne sera pas valide](/fr/docs/Web/Guide/HTML/HTML5/Constraint_validatio ### {{htmlattrdef("pattern")}} -L'attribut `pattern` est une expression rationnelle que doit respecter la valeur ({{htmlattrxref("value")}}) du champ afin d'être [valide](/fr/docs/Web/Guide/HTML/HTML5/Constraint_validation). Cette expression rationnelle doit être une expression rationnelle valide pour JavaScript (telle qu'utilisée par {{jsxref("RegExp")}} et telle que documentée dans [ce guide](/fr/docs/Web/JavaScript/Guide/Expressions_régulières)). Le marqueur `'u'` est fourni par le navigateur lors de la compilation de l'expression rationnelle afin que le motif soit traité comme une séquence de points de code Unicode plutôt que comme des caractères ASCII. Aucune barre oblique (/) ne devrait être utilisée autour du motif. +L'attribut `pattern` est une expression rationnelle que doit respecter la valeur ({{htmlattrxref("value")}}) du champ afin d'être [valide](/fr/docs/Web/Guide/HTML/HTML5/Constraint_validation). Cette expression rationnelle doit être une expression rationnelle valide pour JavaScript (telle qu'utilisée par {{jsxref("RegExp")}} et telle que documentée dans [ce guide](/fr/docs/Web/JavaScript/Guide/Expressions_régulières)). Le marqueur `'u'` est fourni par le navigateur lors de la compilation de l'expression rationnelle afin que le motif soit traité comme une séquence de points de code Unicode plutôt que comme des caractères ASCII. Aucune barre oblique (/) ne devrait être utilisée autour du motif. Si l'expression rationnelle est invalide ou que cet attribut n'est pas défini, l'attribut est ignoré. @@ -64,9 +64,9 @@ Voir [la section sur l'utilisation de cet attribut ci-après](#format) pour plus L'attribut `placeholder` est une chaîne de caractères fournissant une courte indication à l'utilisateur quant à l'information attendue dans le champ. Cet attribut devrait être un mot ou une phrase courte qui illustre le type de donnée attendu plutôt qu'un message explicatif. Le texte ne doit pas contenir de saut à la ligne. -Si le contenu du contrôle respecte une directionnalité donnée ({{Glossary("LTR")}} ou {{Glossary("RTL")}}) et que le texte indicatif doit être présenté dans l'autre sens, il est possible d'utiliser l'algorithme de formatage bidirectionnel Unicode (cf. {{SectionOnPage("/en-US/docs/Web/Localization/Unicode_Bidirectional_Text_Algorithm", "Overriding BiDi using Unicode control characters")}}). +Si le contenu du contrôle respecte une directionnalité donnée ({{Glossary("LTR")}} ou {{Glossary("RTL")}}) et que le texte indicatif doit être présenté dans l'autre sens, il est possible d'utiliser l'algorithme de formatage bidirectionnel Unicode (cf. {{SectionOnPage("/en-US/docs/Web/Localization/Unicode_Bidirectional_Text_Algorithm", "Overriding BiDi using Unicode control characters")}}). -> **Note :** On évitera, tant que faire se peut, d'utiliser l'attribut `placeholder` car il n'est pas sémantiquement très utile pour expliquer le formulaire et car il peut causer certains problèmes avec le contenu. Voir {{SectionOnPage("/fr/docs/Web/HTML/Element/input", "Libellés et textes indicatifs")}} pour plus d'informations. +> **Note :** On évitera, tant que faire se peut, d'utiliser l'attribut `placeholder` car il n'est pas sémantiquement très utile pour expliquer le formulaire et car il peut causer certains problèmes avec le contenu. Voir {{SectionOnPage("/fr/docs/Web/HTML/Element/input", "Libellés et textes indicatifs")}} pour plus d'informations. ### {{htmlattrdef("readonly")}} @@ -360,7 +360,7 @@ En plus des exemples précédents, vous pouvez consulter les articles [Un premie {{htmlattrxref("autocomplete", "input")}}, {{htmlattrxref("list", "input")}}, {{htmlattrxref("maxlength", "input")}}, - {{htmlattrxref("minlength", "input")}}, {{htmlattrxref("pattern", "input")}}, {{htmlattrxref("placeholder", "input")}}, {{htmlattrxref("required", "input")}}, {{htmlattrxref("readonly", "input")}}, + {{htmlattrxref("minlength", "input")}}, {{htmlattrxref("pattern", "input")}}, {{htmlattrxref("placeholder", "input")}}, {{htmlattrxref("required", "input")}}, {{htmlattrxref("readonly", "input")}}, {{htmlattrxref("size", "input")}}. </td> </tr> diff --git a/files/fr/web/html/element/input/url/index.md b/files/fr/web/html/element/input/url/index.md index e9f7950ab4..af6b05d62e 100644 --- a/files/fr/web/html/element/input/url/index.md +++ b/files/fr/web/html/element/input/url/index.md @@ -302,7 +302,7 @@ En plus des exemples précédents, vous pouvez consulter [l'exemple de validatio {{htmlattrxref("minlength", "input")}}, {{htmlattrxref("pattern", "input")}}, {{htmlattrxref("placeholder", "input")}}, - {{htmlattrxref("readonly", "input")}}, {{htmlattrxref("required", "input")}} + {{htmlattrxref("readonly", "input")}}, {{htmlattrxref("required", "input")}} et {{htmlattrxref("size", "input")}} </td> </tr> diff --git a/files/fr/web/html/element/ins/index.md b/files/fr/web/html/element/ins/index.md index 146372cb9a..a94a3397e2 100644 --- a/files/fr/web/html/element/ins/index.md +++ b/files/fr/web/html/element/ins/index.md @@ -126,9 +126,9 @@ Certaines personnes qui utilisent des lecteurs d'écran désactivent sciemment c | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------ | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'edits.html#the-ins-element', '<ins>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'edits.html#the-ins-element', '<ins>')}} | {{Spec2('HTML5 W3C')}} |  | -| {{SpecName('HTML4.01', 'struct/text.html#h-9.4', '<ins>')}} | {{Spec2('HTML4.01')}} |  | +| {{SpecName('HTML WHATWG', 'edits.html#the-ins-element', '<ins>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'edits.html#the-ins-element', '<ins>')}} | {{Spec2('HTML5 W3C')}} | | +| {{SpecName('HTML4.01', 'struct/text.html#h-9.4', '<ins>')}} | {{Spec2('HTML4.01')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/kbd/index.md b/files/fr/web/html/element/kbd/index.md index b29e821b08..86cab0a72c 100644 --- a/files/fr/web/html/element/kbd/index.md +++ b/files/fr/web/html/element/kbd/index.md @@ -10,9 +10,9 @@ translation_of: Web/HTML/Element/kbd --- {{HTMLRef}} -L'élément HTML **`<kbd>`** représente une plage de texte en ligne indiquant la saisie de texte par l'utilisateur à partir d'un clavier, d'une saisie vocale ou de tout autre dispositif de saisie de texte. Par convention, le {{Glossary("user agent")}} rend par défaut le contenu d'un élément `<kbd>` en utilisant sa police monospace, bien que cela ne soit pas requis par le standard HTML. +L'élément HTML **`<kbd>`** représente une plage de texte en ligne indiquant la saisie de texte par l'utilisateur à partir d'un clavier, d'une saisie vocale ou de tout autre dispositif de saisie de texte. Par convention, le {{Glossary("user agent")}} rend par défaut le contenu d'un élément `<kbd>` en utilisant sa police monospace, bien que cela ne soit pas requis par le standard HTML. -`<kbd>` peut être imbriqué dans diverses combinaisons avec {{HTMLElement("samp")}} (Sample Output) pour représenter diverses formes d'entrée ou d'entrée basées sur des repères visuels. +`<kbd>` peut être imbriqué dans diverses combinaisons avec {{HTMLElement("samp")}} (Sample Output) pour représenter diverses formes d'entrée ou d'entrée basées sur des repères visuels. {{EmbedInteractiveExample("pages/tabbed/kbd.html", "tabbed-shorter")}} @@ -25,7 +25,7 @@ Cet élément ne contient que [les attributs universels](/fr/docs/Web/HTML/Attri D'autres éléments peuvent être utilisés en association avec `<kbd>` afin de représenter certains scénarios plus spécifiques : - Imbriquer un élément `<kbd>` dans un autre élément `<kbd>` représente une touche ou une unité de saisie au sein d'une saisie plus grande. Cf. {{anch("Représenter les frappes de touches dans une saisie")}} ci-après. -- Imbriquer un élément `<kbd>` dans un élément {{HTMLElement("samp")}} permet d'indiquer que la saisie a été restituée (_echo_) à l'utilisateur. Cf. {{anch("Saisie restituée")}}, ci-après. +- Imbriquer un élément `<kbd>` dans un élément {{HTMLElement("samp")}} permet d'indiquer que la saisie a été restituée (_echo_) à l'utilisateur. Cf. {{anch("Saisie restituée")}}, ci-après. - Imbriquer un élément `<samp>` dans un élément `<kbd>` permet de représenter des saisies basées sur le texte présenté par le système (cela peut être le nom de menus, d'éléments de menu ou le nom de bouttons affichés à l'écran). Cf. {{anch("Représenter les options de saisies à l'écran")}} ci-après.. > **Note :** Il est possible de définir un style pour surcharger la mise en forme par défaut du navigateur pour l'élément `<kbd>`. À ce titre, on gardera à l'esprit que les préférences et feuilles de style de l'utilisateur peuvent surcharger la mise en forme du site. @@ -75,7 +75,7 @@ On peut alors ajouter un peu de CSS : ##### CSS -On ajoute un règle pour les les éléments `<kbd>` avec la classe `"key"` afin de représenter les touches d'un clavier : +On ajoute un règle pour les les éléments `<kbd>` avec la classe `"key"` afin de représenter les touches d'un clavier : ```css kbd.key { @@ -123,7 +123,7 @@ En imbriquant un élément `<kbd>` dans un élément {{HTMLElement("samp")}}, on ### Représenter les options de saisies à l'écran -Imbriquer un élément `<samp>` dans un élément `<kbd>` représente une saisie basée sur du texte affiché par le système (par exemple des noms de menu, d'éléments de menu, des noms de boutons affichés à l'écran, etc.). +Imbriquer un élément `<samp>` dans un élément `<kbd>` représente une saisie basée sur du texte affiché par le système (par exemple des noms de menu, d'éléments de menu, des noms de boutons affichés à l'écran, etc.). #### HTML diff --git a/files/fr/web/html/element/keygen/index.md b/files/fr/web/html/element/keygen/index.md index a74f6f7836..19c963d0c9 100644 --- a/files/fr/web/html/element/keygen/index.md +++ b/files/fr/web/html/element/keygen/index.md @@ -63,7 +63,7 @@ SignedPublicKeyAndChallenge ::= SEQUENCE { } ``` -La clé publique et la requête/réponse sont encodées en DER en tant que PublicKeyAndChallenge, puis signées avec la clé privée pour produire un SignedPublicKeyAndChallenge. Le SignedPublicKeyAndChallenge est encodé en base64 et les données ASCII sont finalement envoyées au serveur sous forme d'une paire nom-valeur du formulaire. Le nom étant la valeur définie par l'attribut `name` de l'élément `keygen`. Si aucune chaîne de requête/réponse n'est fournie, cela sera encodé comme une IA5STRING de longueur nulle. +La clé publique et la requête/réponse sont encodées en DER en tant que PublicKeyAndChallenge, puis signées avec la clé privée pour produire un SignedPublicKeyAndChallenge. Le SignedPublicKeyAndChallenge est encodé en base64 et les données ASCII sont finalement envoyées au serveur sous forme d'une paire nom-valeur du formulaire. Le nom étant la valeur définie par l'attribut `name` de l'élément `keygen`. Si aucune chaîne de requête/réponse n'est fournie, cela sera encodé comme une IA5STRING de longueur nulle. Voici un exemple d'un envoi de formulaire, tel qu'envoyé au programme CGI par le serveur HTTP : diff --git a/files/fr/web/html/element/legend/index.md b/files/fr/web/html/element/legend/index.md index 6d4d6157ea..1821e8e31b 100644 --- a/files/fr/web/html/element/legend/index.md +++ b/files/fr/web/html/element/legend/index.md @@ -91,7 +91,7 @@ Cet élément contient uniquement [les attributs universels](/fr/docs/Web/HTML/A | Spécification | État | Commentaires | | -------------------------------------------------------------------------------------------------------- | -------------------------------- | --------------------------------- | | {{SpecName("HTML WHATWG", "forms.html#the-legend-element", "<legend>")}} | {{Spec2("HTML WHATWG")}} | Définition de l'élément `legend`. | -| {{SpecName("HTML5 W3C", "forms.html#the-legend-element", "<legend>")}} | {{Spec2("HTML5 W3C")}} |  | +| {{SpecName("HTML5 W3C", "forms.html#the-legend-element", "<legend>")}} | {{Spec2("HTML5 W3C")}} | | | {{SpecName("HTML4.01", "interact/forms.html#h-17.10", "<legend>")}} | {{Spec2("HTML4.01")}} | Définition initiale. | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/link/index.md b/files/fr/web/html/element/link/index.md index 10791594c9..30d0b07772 100644 --- a/files/fr/web/html/element/link/index.md +++ b/files/fr/web/html/element/link/index.md @@ -20,7 +20,7 @@ Pour lier une feuille de style externe, on inclut un élément `<link>` de la fo <link href="main.css" rel="stylesheet"> ``` -Dans cet exemple, on indique le chemin vers la feuille de style grâce à l'attribut `href`, l'attribut `rel` possède une valeur `stylesheet` qui indique que c'est une feuille de style. `rel` signifie _relationship_ qui correspond donc à la relation entre la ressource et le document courant. Il existe de [nombreux types de liens possibles](/fr/docs/Web/HTML/Types_de_lien). +Dans cet exemple, on indique le chemin vers la feuille de style grâce à l'attribut `href`, l'attribut `rel` possède une valeur `stylesheet` qui indique que c'est une feuille de style. `rel` signifie _relationship_ qui correspond donc à la relation entre la ressource et le document courant. Il existe de [nombreux types de liens possibles](/fr/docs/Web/HTML/Types_de_lien). Certains types sont assez fréquents. Ainsi, pour l'icône présentant le site dans l'onglet, on trouvera : diff --git a/files/fr/web/html/element/main/index.md b/files/fr/web/html/element/main/index.md index 40023666b2..854ab621f4 100644 --- a/files/fr/web/html/element/main/index.md +++ b/files/fr/web/html/element/main/index.md @@ -142,13 +142,13 @@ Les fonctionnalités « mode lecture » d'un navigateur vérifient la présence <tr> <th scope="row">Rôles ARIA autorisés</th> <td> - Le rôle <code>main</code> est appliqué à  <code><main></code> par - défaut, et le rôle <code + Le rôle <code>main</code> est appliqué à <code><main></code> par + défaut, et le rôle <code ><a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_presentation_role" >presentation</a ></code - > est également autorisé. + > est également autorisé. </td> </tr> <tr> diff --git a/files/fr/web/html/element/map/index.md b/files/fr/web/html/element/map/index.md index 00b11aba9f..f95e7ab3e3 100644 --- a/files/fr/web/html/element/map/index.md +++ b/files/fr/web/html/element/map/index.md @@ -39,9 +39,9 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive ### Résultat attendu -L'exemple précédent devrait faire apparaître des images semblables (en utilisant la touche <kbd>tab</kbd> de votre clavier) : +L'exemple précédent devrait faire apparaître des images semblables (en utilisant la touche <kbd>tab</kbd> de votre clavier) : -_Pour le lien `left.html` :_ +_Pour le lien `left.html` :_  _Pour le lien `right.html` :_ diff --git a/files/fr/web/html/element/mark/index.md b/files/fr/web/html/element/mark/index.md index 73cf9f4c98..49beaed20c 100644 --- a/files/fr/web/html/element/mark/index.md +++ b/files/fr/web/html/element/mark/index.md @@ -20,7 +20,7 @@ Cet élément inclut uniquement [les attributs universels](/fr/docs/Web/HTML/Att ## **Notes d'utilisation** -- Au sein d'une citation ({{HTMLElement("q")}}) ou dans un autre bloc ({{HTMLElement("blockquote")}}), le texte surligné marque généralement du texte référencé en dehors de la citation ou qui est indiqué pour demander une attention particulière bien que l'auteur ne considère pas ce texte comme important. +- Au sein d'une citation ({{HTMLElement("q")}}) ou dans un autre bloc ({{HTMLElement("blockquote")}}), le texte surligné marque généralement du texte référencé en dehors de la citation ou qui est indiqué pour demander une attention particulière bien que l'auteur ne considère pas ce texte comme important. - Au sein du texte principal, le texte surligné marque du texte d'une pertinence partiulière pour l'utilisateur (par exemple lorsqu'il recherche un terme en particulier). - `<mark>` ne doit pas être utilisé pour de la coloration syntaxique, c'est l'élément {{HTMLElement("span")}} qui devra être utilisé. - `<mark>` ne doit pas être confondu avec {{HTMLElement("strong")}}. L'élément {{HTMLElement("strong")}} est utilisé afin d'indiquer des fragments de texte _importants_ alors que `<mark>` est utilisé afin d'indiquer des fragments de texte _pertinents_. @@ -151,8 +151,8 @@ Certaines personnes qui utilisent des lecteurs d'écran désactivent sciemment c | Spécification | État | Commentaires | | -------------------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'text-level-semantics.html#the-mark-element','<mark>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-mark-element', '<mark>')}} | {{Spec2('HTML5 W3C')}} |  | +| {{SpecName('HTML WHATWG', 'text-level-semantics.html#the-mark-element','<mark>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-mark-element', '<mark>')}} | {{Spec2('HTML5 W3C')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/meta/index.md b/files/fr/web/html/element/meta/index.md index b920607777..340b68dda0 100644 --- a/files/fr/web/html/element/meta/index.md +++ b/files/fr/web/html/element/meta/index.md @@ -31,7 +31,7 @@ Comme tous les autres éléments, cet élément inclut [les attributs universels > > - Le jeux de caractères déclaré doit correspondre à celui utilisé dans la page. Il est inutile de déclarer un jeu de caractères incorrect (cela entraînant également une mauvaise expérience utilisateur). > - L'élément {{HTMLElement("meta")}} doit appartenir à l'élément {{HTMLElement("head")}} et doit apparaître parmi les **512 premiers octets de la page**. En effet, certains navigateurs ne consultent seulement ces premiers octets pour déterminer l'encodage utilisé pour la page. - > - L'élément {{HTMLElement("meta")}} ne représente qu'une partie de l'[algorithme déterminant le jeu de caractères](https://www.whatwg.org/specs/web-apps/current-work/multipage/parsing.html#encoding-sniffing-algorithm) à appliquer sur la page par le navigateur. Ainsi, l'en-tête HTTP Content-Type et tous les éléments BOM auront une priorité supérieure à cet élément. + > - L'élément {{HTMLElement("meta")}} ne représente qu'une partie de l'[algorithme déterminant le jeu de caractères](https://www.whatwg.org/specs/web-apps/current-work/multipage/parsing.html#encoding-sniffing-algorithm) à appliquer sur la page par le navigateur. Ainsi, l'en-tête HTTP Content-Type et tous les éléments BOM auront une priorité supérieure à cet élément. > - Définir le jeu de caractères utilisé grâce à cet attribut représente une bonne pratique et est fortement recommandé. Si aucun encodage n'est défini pour la page, plusieurs techniques XSS peuvent porter atteinte à l'utilisateur (voir l'exemple de la [technique XSS de recours à UTF-7](https://code.google.com/p/doctype-mirror/wiki/ArticleUtf7)). Toujours renseigner cet élément meta protégera contre ces dangers. > - L'élément {{HTMLElement("meta")}} est un synonyme de `<meta http-equiv="Content-Type" content="text/html; charset=IANAcharset">` utilisé avant HTML5. Ici *`IANAcharset`* correspond à la valeur de l'attribut {{htmlattrxref("charset", "meta")}} correspondant. Bien qu'elle soit obsolète et qu'elle ne soit plus recommandée, cette syntaxe est toujours autorisée. diff --git a/files/fr/web/html/element/meter/index.md b/files/fr/web/html/element/meter/index.md index 722df5fec1..e35e000567 100644 --- a/files/fr/web/html/element/meter/index.md +++ b/files/fr/web/html/element/meter/index.md @@ -145,7 +145,7 @@ On remarquera ici que l'attribut `min` est absent (ce qui est autorisé), la val | Spécification | État | Commentaires | | ---------------------------------------------------------------------------------------------------- | -------------------------------- | -------------------- | -| {{SpecName('HTML WHATWG', 'forms.html#the-meter-element', '<meter>')}} | {{Spec2('HTML WHATWG')}} |  | +| {{SpecName('HTML WHATWG', 'forms.html#the-meter-element', '<meter>')}} | {{Spec2('HTML WHATWG')}} | | | {{SpecName('HTML5 W3C', 'forms.html#the-meter-element', '<meter>')}} | {{Spec2('HTML5 W3C')}} | Définition initiale. | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/nav/index.md b/files/fr/web/html/element/nav/index.md index e4d7c0b138..dabc4cd901 100644 --- a/files/fr/web/html/element/nav/index.md +++ b/files/fr/web/html/element/nav/index.md @@ -21,7 +21,7 @@ Cet élément ne possède que [les attributs universels](/fr/docs/Web/HTML/Globa ## Notes d'utilisation - Tous les liens d'un document ne doivent pas faire partie d'un élément `<nav>`. Ce dernier est fait pour créer des blocs conséquents contenants des liens de navigations au sein du document. L'élément {{HTMLElement("footer")}} possède souvent différents liens, il n'a pour autant pas besoin d'être dans un élément {{HTMLElement("nav")}}. -- Un document peut avoir plusieurs éléments {{HTMLElement("nav")}}, par exemple un pour la navigation sur le site et un autre pour la navigation au sein de la page. L'attribut [`aria-labelledby`](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-labelledby) pourra être utilisé afin d'améliorer l'accessibilité. +- Un document peut avoir plusieurs éléments {{HTMLElement("nav")}}, par exemple un pour la navigation sur le site et un autre pour la navigation au sein de la page. L'attribut [`aria-labelledby`](/fr/docs/Accessibilité/ARIA/Techniques_ARIA/Utiliser_l_attribut_aria-labelledby) pourra être utilisé afin d'améliorer l'accessibilité. - Les agents utilisateurs, tels que les lecteurs d'écrans assistant les utilisateurs handicapés, peuvent utiliser cet élément pour déterminer s'il faut omettre ou non le rendu initial du contenu relatif uniquement à la navigation. ## Exemples diff --git a/files/fr/web/html/element/noframes/index.md b/files/fr/web/html/element/noframes/index.md index 7ec076390b..1acb550d1d 100644 --- a/files/fr/web/html/element/noframes/index.md +++ b/files/fr/web/html/element/noframes/index.md @@ -48,8 +48,8 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------ | ---------------------------- | ------------ | -| {{SpecName('HTML5 W3C', '#noframes', 'noframes')}} | {{Spec2('HTML5 W3C')}} |  | -| {{SpecName('HTML4.01', 'frames.html#edef-NOFRAMES', '<noframes>')}} | {{Spec2('HTML4.01')}} |  | +| {{SpecName('HTML5 W3C', '#noframes', 'noframes')}} | {{Spec2('HTML5 W3C')}} | | +| {{SpecName('HTML4.01', 'frames.html#edef-NOFRAMES', '<noframes>')}} | {{Spec2('HTML4.01')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/object/index.md b/files/fr/web/html/element/object/index.md index 5176c44c3d..6f6e10cef8 100644 --- a/files/fr/web/html/element/object/index.md +++ b/files/fr/web/html/element/object/index.md @@ -21,13 +21,13 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive - {{htmlattrdef("data")}} - : L'adresse de la ressource, une URL valide. Au moins un attribut **`data`** et un attribut **`type`** doivent être définis. - {{htmlattrdef("form")}} {{HTMLVersionInline(5)}} - - : L'élément de formulaire éventuel auquel l'élément est associé. La valeur de cet attribut doit être l'identifiant d'un élément {{HTMLElement("form")}} du même document. + - : L'élément de formulaire éventuel auquel l'élément est associé. La valeur de cet attribut doit être l'identifiant d'un élément {{HTMLElement("form")}} du même document. - {{htmlattrdef("height")}} - : La hauteur de la ressource à afficher, exprimée en pixels [CSS](/fr/docs/Web/CSS) (uniquement en valeur absolue). - {{htmlattrdef("name")}} - : Le nom du contexte de navigation valide (HTML5) ou du contrôle associé à l'élément (HTML 4). - {{htmlattrdef("type")}} - - : Le type MIME de la ressource définie par **`data`**. Au moins un attribut **`data`** et un attribut **`type`** doivent être définis. + - : Le type MIME de la ressource définie par **`data`**. Au moins un attribut **`data`** et un attribut **`type`** doivent être définis. - {{htmlattrdef("typemustmatch")}} {{HTMLVersionInline(5)}} - : Cet attribut booléen indique si l'attribut `type` doit correspondre [au type MIME](/fr/docs/Glossaire/Type_MIME) de la ressource afin que celle-ci puisse être utilisée. - {{htmlattrdef("usemap")}} @@ -51,7 +51,7 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive <!----> - {{htmlattrdef("declare")}} {{HTMLVersionInline(4)}} seulement ; {{Obsolete_Inline("HTML5")}} - - : Si cet attribut booléen est présent, l'élément sera seulement une déclaration. L'objet devra donc être instancié par un élément `<object>` dans la suite du document. En HTML5, il faut répéter l'élément \<object> complètement chaque fois que la ressource est ré-utilisée. + - : Si cet attribut booléen est présent, l'élément sera seulement une déclaration. L'objet devra donc être instancié par un élément `<object>` dans la suite du document. En HTML5, il faut répéter l'élément \<object> complètement chaque fois que la ressource est ré-utilisée. <!----> @@ -66,14 +66,14 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive ```html <object data="https://www.ecma-international.org/publications/files/ECMA-ST-ARCH/ECMA-262,%201st%20edition,%20June%201997.pdf" type="application/pdf" -       width="500" height="500" typemustmatch> - <p>Vous n'avez pas de plugin PDF mais vous pouvez <a href="https://www.ecma-international.org/publications/files/ECMA-ST-ARCH/ECMA-262,%201st%20edition,%20June%201997.pdf">télécharger le fichier.</a></p> + width="500" height="500" typemustmatch> + <p>Vous n'avez pas de plugin PDF mais vous pouvez <a href="https://www.ecma-international.org/publications/files/ECMA-ST-ARCH/ECMA-262,%201st%20edition,%20June%201997.pdf">télécharger le fichier.</a></p> </object> <!-- Un exemple avec Flash --> <!-- <object data="animation.swf" type="application/x-shockwave-flash"> - <param name="param11" value="valeurConf"> + <param name="param11" value="valeurConf"> </object> --> ``` @@ -124,7 +124,7 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive <th scope="row"><dfn>Contenu autorisé</dfn></th> <td> Zéro ou plusieurs éléments {{HTMLElement("param")}} suivis par - du + du <a href="/fr/docs/Web/HTML/Cat%C3%A9gorie_de_contenu#Mod.C3.A8le_de_contenu_transparent" >contenu transparent.</a @@ -157,9 +157,9 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------------------------------ | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'embedded-content.html#the-object-element', '<object>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'embedded-content-0.html#the-object-element', '<object>')}} | {{Spec2('HTML5 W3C')}} |  | -| {{SpecName('HTML4.01', 'struct/objects.html#h-13.3', '<object>')}} | {{Spec2('HTML4.01')}} |  | +| {{SpecName('HTML WHATWG', 'embedded-content.html#the-object-element', '<object>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'embedded-content-0.html#the-object-element', '<object>')}} | {{Spec2('HTML5 W3C')}} | | +| {{SpecName('HTML4.01', 'struct/objects.html#h-13.3', '<object>')}} | {{Spec2('HTML4.01')}} | | ## Compatibilité des navigateurs @@ -168,5 +168,5 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive ## Voir aussi - {{HTMLElement("param")}} -- {{HTMLElement("applet")}} {{Obsolete_Inline}} +- {{HTMLElement("applet")}} {{Obsolete_Inline}} - {{HTMLElement("embed")}} diff --git a/files/fr/web/html/element/optgroup/index.md b/files/fr/web/html/element/optgroup/index.md index 0556863ec4..aa4086a53f 100644 --- a/files/fr/web/html/element/optgroup/index.md +++ b/files/fr/web/html/element/optgroup/index.md @@ -94,9 +94,9 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------------------ | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'forms.html#the-optgroup-element', '<optgroup>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'forms.html#the-optgroup-element', '<optgroup>')}} | {{Spec2('HTML5 W3C')}} |  | -| {{SpecName('HTML4.01', 'interact/forms.html#h-17.6', '<optgroup>')}} | {{Spec2('HTML4.01')}} |  | +| {{SpecName('HTML WHATWG', 'forms.html#the-optgroup-element', '<optgroup>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'forms.html#the-optgroup-element', '<optgroup>')}} | {{Spec2('HTML5 W3C')}} | | +| {{SpecName('HTML4.01', 'interact/forms.html#h-17.6', '<optgroup>')}} | {{Spec2('HTML4.01')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/output/index.md b/files/fr/web/html/element/output/index.md index dfd6176e9a..6b9329073b 100644 --- a/files/fr/web/html/element/output/index.md +++ b/files/fr/web/html/element/output/index.md @@ -105,8 +105,8 @@ Le formulaire qui suit fournit un curseur dont la valeur peut aller de 0 à 100 | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------------------------------ | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'the-button-element.html#the-output-element', '<output>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'forms.html#the-output-element', '<output>')}} | {{Spec2('HTML5 W3C')}} |  | +| {{SpecName('HTML WHATWG', 'the-button-element.html#the-output-element', '<output>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'forms.html#the-output-element', '<output>')}} | {{Spec2('HTML5 W3C')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/p/index.md b/files/fr/web/html/element/p/index.md index 686f8c678a..b1a54e765a 100644 --- a/files/fr/web/html/element/p/index.md +++ b/files/fr/web/html/element/p/index.md @@ -92,7 +92,7 @@ p { <td> La balise de début est obligatoire. La balise de fin peut être absente si l'élément {{HTMLElement("p")}} est immédiatement suivi d'un - élément {{HTMLElement("address")}}, + élément {{HTMLElement("address")}}, {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("blockquote")}}, {{HTMLElement("div")}}, {{HTMLElement("dl")}}, {{HTMLElement("fieldset")}}, diff --git a/files/fr/web/html/element/param/index.md b/files/fr/web/html/element/param/index.md index b0299e19ad..2ea4a47c1c 100644 --- a/files/fr/web/html/element/param/index.md +++ b/files/fr/web/html/element/param/index.md @@ -88,9 +88,9 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------------------------------ | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'the-iframe-element.html#the-param-element', '<param>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'embedded-content-0.html#the-param-element', '<param>')}} | {{Spec2('HTML5 W3C')}} |  | -| {{SpecName('HTML4.01', 'struct/objects.html#h-13.3.2', '<param>')}} | {{Spec2('HTML4.01')}} |  | +| {{SpecName('HTML WHATWG', 'the-iframe-element.html#the-param-element', '<param>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'embedded-content-0.html#the-param-element', '<param>')}} | {{Spec2('HTML5 W3C')}} | | +| {{SpecName('HTML4.01', 'struct/objects.html#h-13.3.2', '<param>')}} | {{Spec2('HTML4.01')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/picture/index.md b/files/fr/web/html/element/picture/index.md index 99675b83d5..0a23921ab5 100644 --- a/files/fr/web/html/element/picture/index.md +++ b/files/fr/web/html/element/picture/index.md @@ -51,7 +51,7 @@ L'attribut `media` de l'élément {{HTMLElement("source")}} permet de rédiger u L'attribut `type` d'un élément {{HTMLElement("source")}} permet d'indiquer le type MIME du fichier fourni via l'attribut `srcset`. Si l'agent utilisateur ne prend pas en charge ce type de fichier, l'élément {{HTMLElement("source")}} est ignoré. ```html -​<picture> +<picture> <source srcset="mdn-logo.svg" type="image/svg+xml"> <img src="mdn-logo.png" alt="MDN"> </picture> diff --git a/files/fr/web/html/element/pre/index.md b/files/fr/web/html/element/pre/index.md index 882a1245eb..797be4d7c3 100644 --- a/files/fr/web/html/element/pre/index.md +++ b/files/fr/web/html/element/pre/index.md @@ -34,7 +34,7 @@ Cet élément inclut uniquement [les attributs universels](/fr/docs/Web/HTML/Att ```html <pre> body { - color:red; + color:red; } </pre> ``` @@ -129,7 +129,7 @@ Pour légender un tel diagramme, on pourra utiliser une combinaison d'éléments | ------------------------------------------------------------------------------------------------------------ | -------------------------------- | -------------------------------------------------------------------- | | {{SpecName('HTML WHATWG', 'semantics.html#the-pre-element', '<pre>')}} | {{Spec2('HTML WHATWG')}} | Aucune modification majure depuis {{SpecName("HTML5 W3C")}} | | {{SpecName('HTML5 W3C', 'grouping-content.html#the-pre-element', '<pre>')}} | {{Spec2('HTML5 W3C')}} | Aucune modification majeure depuis {{SpecName("HTML4.01")}}. | -| {{SpecName('HTML4.01', 'struct/text.html#h-9.3.4', '<pre>')}} | {{Spec2('HTML4.01')}} | Dépréciation de l'attribut `cols`. | +| {{SpecName('HTML4.01', 'struct/text.html#h-9.3.4', '<pre>')}} | {{Spec2('HTML4.01')}} | Dépréciation de l'attribut `cols`. | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/progress/index.md b/files/fr/web/html/element/progress/index.md index d5335cb80b..54668f27ba 100644 --- a/files/fr/web/html/element/progress/index.md +++ b/files/fr/web/html/element/progress/index.md @@ -21,7 +21,7 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive - {{htmlattrdef("max")}} - : Cet attribut indique la valeur correspondant à la complétion de la tâche. Si l'attribut `max` est présent, sa valeur doit être un nombre décimal supérieur à 0. La valeur par défaut est 1. - {{htmlattrdef("value")}} - - : Cet attribut indique l'état actuel de complétion de la tâche avec une valeur numérique. La valeur de l'attribut doit être un nombre décimal compris entre 0 et `max` (ou entre 0 et 1 si l'attribut `max` est absent). Si l'attribut `value` est absent, la barre de progression traduit un état indéterminé (la tâche est en cours et on ne sait pas la durée qu'elle prendra). + - : Cet attribut indique l'état actuel de complétion de la tâche avec une valeur numérique. La valeur de l'attribut doit être un nombre décimal compris entre 0 et `max` (ou entre 0 et 1 si l'attribut `max` est absent). Si l'attribut `value` est absent, la barre de progression traduit un état indéterminé (la tâche est en cours et on ne sait pas la durée qu'elle prendra). > **Note :** La valeur minimale est toujours 0 et il n'existe pas d'attribut `min` pour l'élément `progress`. La propriété CSS {{cssxref("-moz-orient")}} peut être utilisée afin d'indiquer si barre de progression doit être affichée horizontalement (le comportement par défaut) ou verticalement. > La pseudo-classe CSS {{cssxref(":indeterminate")}} permet quant à elle de cibler les barres de progression indéterminées. Pour qu'une barre d'avancement retrouve un état indéterminé après qu'elle ait eu une valeur, on pourra utiliser `element.removeAttribute("value")`. @@ -101,7 +101,7 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------------------ | -------------------------------- | -------------------- | -| {{SpecName('HTML WHATWG', 'forms.html#the-progress-element', '<progress>')}} | {{Spec2('HTML WHATWG')}} |  | +| {{SpecName('HTML WHATWG', 'forms.html#the-progress-element', '<progress>')}} | {{Spec2('HTML WHATWG')}} | | | {{SpecName('HTML5 W3C', 'forms.html#the-progress-element', '<progress>')}} | {{Spec2('HTML5 W3C')}} | Définition initiale. | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/q/index.md b/files/fr/web/html/element/q/index.md index 93b71f9b99..d134876a3c 100644 --- a/files/fr/web/html/element/q/index.md +++ b/files/fr/web/html/element/q/index.md @@ -102,8 +102,8 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------------------ | -------------------------------- | -------------------- | -| {{SpecName('HTML WHATWG', 'semantics.html#the-q-element', '<q>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-q-element', '<q>')}} | {{Spec2('HTML5 W3C')}} |  | +| {{SpecName('HTML WHATWG', 'semantics.html#the-q-element', '<q>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-q-element', '<q>')}} | {{Spec2('HTML5 W3C')}} | | | {{SpecName('HTML4.01', 'struct/text.html#h-9.2.2', '<q>')}} | {{Spec2('HTML4.01')}} | Définition initiale. | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/rb/index.md b/files/fr/web/html/element/rb/index.md index 983f583aa2..8d07bf9aed 100644 --- a/files/fr/web/html/element/rb/index.md +++ b/files/fr/web/html/element/rb/index.md @@ -126,7 +126,7 @@ body { | Spécification | État | Commentaires | | ---------------------------------------------------------------------------------------------------------------- | ---------------------------- | ------------ | -| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-rb-element', '<rb>')}} | {{Spec2('HTML5 W3C')}} |  | +| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-rb-element', '<rb>')}} | {{Spec2('HTML5 W3C')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/rp/index.md b/files/fr/web/html/element/rp/index.md index f409064ab9..062d1cc092 100644 --- a/files/fr/web/html/element/rp/index.md +++ b/files/fr/web/html/element/rp/index.md @@ -117,8 +117,8 @@ body { | Spécification | État | Commentaires | | ---------------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'text-level-semantics.html#the-rp-element', '<rp>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-rp-element', '<rp>')}} | {{Spec2('HTML5 W3C')}} |  | +| {{SpecName('HTML WHATWG', 'text-level-semantics.html#the-rp-element', '<rp>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-rp-element', '<rp>')}} | {{Spec2('HTML5 W3C')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/rtc/index.md b/files/fr/web/html/element/rtc/index.md index 1dcf28e6d3..59159a4ef1 100644 --- a/files/fr/web/html/element/rtc/index.md +++ b/files/fr/web/html/element/rtc/index.md @@ -96,9 +96,9 @@ Cet élément peut utiliser [les attributs universels](/fr/docs/Web/HTML/Attribu | Spécification | État | Commentaires | | ---------------------------------------------------------------------------------------------------------------- | ---------------------------- | -------------------- | -| {{SpecName('HTML5.3', 'textlevel-semantics.html#the-rtc-element', '<rtc>')}} | {{Spec2('HTML5.3')}} |  | -| {{SpecName('HTML5.2', 'textlevel-semantics.html#the-rtc-element', '<rtc>')}} | {{Spec2('HTML5.2')}} |  | -| {{SpecName('HTML5.1', 'textlevel-semantics.html#the-rtc-element', '<rtc>')}} | {{Spec2('HTML5.1')}} |  | +| {{SpecName('HTML5.3', 'textlevel-semantics.html#the-rtc-element', '<rtc>')}} | {{Spec2('HTML5.3')}} | | +| {{SpecName('HTML5.2', 'textlevel-semantics.html#the-rtc-element', '<rtc>')}} | {{Spec2('HTML5.2')}} | | +| {{SpecName('HTML5.1', 'textlevel-semantics.html#the-rtc-element', '<rtc>')}} | {{Spec2('HTML5.1')}} | | | {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-rtc-element', '<rtc>')}} | {{Spec2('HTML5 W3C')}} | Définition initiale. | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/ruby/index.md b/files/fr/web/html/element/ruby/index.md index a602a5e216..9e1a917fcd 100644 --- a/files/fr/web/html/element/ruby/index.md +++ b/files/fr/web/html/element/ruby/index.md @@ -91,7 +91,7 @@ Cet élément inclut uniquement les [attributs globaux](/fr/docs/Web/HTML/Global <tr> <th scope="row">Parents autorisés</th> <td> - Tout élément qui accepte du <a + Tout élément qui accepte du <a href="/fr/docs/Web/HTML/Cat%C3%A9gorie_de_contenu#Contenu_phras.C3.A9" >contenu de phrasé</a >. diff --git a/files/fr/web/html/element/samp/index.md b/files/fr/web/html/element/samp/index.md index 613be3c1b4..5c0b5eb9c6 100644 --- a/files/fr/web/html/element/samp/index.md +++ b/files/fr/web/html/element/samp/index.md @@ -153,9 +153,9 @@ Cela permet simplement de colorer légèrement l'invite et le curseur. On utilis | Spécification | État | Commentaires | | -------------------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'semantics.html#the-samp-element', '<samp>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-samp-element', '<samp>')}} | {{Spec2('HTML5 W3C')}} |  | -| {{SpecName('HTML4.01', 'struct/text.html#h-9.2.1', '<samp>')}} | {{Spec2('HTML4.01')}} |  | +| {{SpecName('HTML WHATWG', 'semantics.html#the-samp-element', '<samp>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-samp-element', '<samp>')}} | {{Spec2('HTML5 W3C')}} | | +| {{SpecName('HTML4.01', 'struct/text.html#h-9.2.1', '<samp>')}} | {{Spec2('HTML4.01')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/strong/index.md b/files/fr/web/html/element/strong/index.md index 78ffce0b02..203ee65db7 100644 --- a/files/fr/web/html/element/strong/index.md +++ b/files/fr/web/html/element/strong/index.md @@ -36,7 +36,7 @@ Il est important de savoir que `<b></b>` ne doit pas être utilisé, à part dan ### `<em>` ou `<strong>` ? -En HTML 4, `<strong>` indiquait simplement une emphase plus forte. En HTML5, l'élément représente une « importance forte » de son contenu. Il est important de faire la différence. L'emphase (`<em>` étant l'élément HTML équivalent) permet de changer le sens d'une phrase : par exemple : « J'_adore_ les licornes » et « J'adore les _licornes_ ». `<strong>` est utilisé pour augmenter l'importance de certaines portions de phrases : « **Attention !** C'est **très dangereux** ». `<strong>` et `<em>` peuvent être imbriqués pour augmenter relativement l'importance ou l'emphase d'un texte. +En HTML 4, `<strong>` indiquait simplement une emphase plus forte. En HTML5, l'élément représente une « importance forte » de son contenu. Il est important de faire la différence. L'emphase (`<em>` étant l'élément HTML équivalent) permet de changer le sens d'une phrase : par exemple : « J'_adore_ les licornes » et « J'adore les _licornes_ ». `<strong>` est utilisé pour augmenter l'importance de certaines portions de phrases : « **Attention !** C'est **très dangereux** ». `<strong>` et `<em>` peuvent être imbriqués pour augmenter relativement l'importance ou l'emphase d'un texte. ## Exemples @@ -128,9 +128,9 @@ En HTML 4, `<strong>` indiquait simplement une emphase plus forte. En HTML5, l'à | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------------------------------ | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'semantics.html#the-strong-element', '<strong>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-strong-element', '<strong>')}} | {{Spec2('HTML5 W3C')}} |  | -| {{SpecName('HTML4.01', 'struct/text.html#edef-STRONG', '<strong>')}} | {{Spec2('HTML4.01')}} |  | +| {{SpecName('HTML WHATWG', 'semantics.html#the-strong-element', '<strong>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-strong-element', '<strong>')}} | {{Spec2('HTML5 W3C')}} | | +| {{SpecName('HTML4.01', 'struct/text.html#edef-STRONG', '<strong>')}} | {{Spec2('HTML4.01')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/style/index.md b/files/fr/web/html/element/style/index.md index 5c56e54df2..5017a7b4da 100644 --- a/files/fr/web/html/element/style/index.md +++ b/files/fr/web/html/element/style/index.md @@ -187,7 +187,7 @@ Dans cet exemple (basé sur le précédent), on ajoute un attribut `media` sur l | -------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------------------------------ | | {{SpecName('HTML WHATWG', 'semantics.html#the-style-element', 'style')}} | {{Spec2('HTML WHATWG')}} | Ajout de l'attribut `nonce`. | | {{SpecName('HTML5 W3C', 'document-metadata.html#the-style-element', 'style')}} | {{Spec2('HTML5 W3C')}} | L'attribut `type` devient optionnel. | -| {{SpecName('HTML4.01', 'present/styles.html#h-14.2.3', 'style')}} | {{Spec2('HTML4.01')}} |  | +| {{SpecName('HTML4.01', 'present/styles.html#h-14.2.3', 'style')}} | {{Spec2('HTML4.01')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/sub/index.md b/files/fr/web/html/element/sub/index.md index 013da8b555..abed446237 100644 --- a/files/fr/web/html/element/sub/index.md +++ b/files/fr/web/html/element/sub/index.md @@ -140,8 +140,8 @@ Voici certains cas d'utilisation (non exhaustifs) pour `<sub>` : | Spécification | État | Commentaires | | ---------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'semantics.html#the-sub-and-sup-elements', '<sub> and <sup>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-sub-and-sup-elements', '<sub> and <sup>;')}} | {{Spec2('HTML5 W3C')}} |  | +| {{SpecName('HTML WHATWG', 'semantics.html#the-sub-and-sup-elements', '<sub> and <sup>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-sub-and-sup-elements', '<sub> and <sup>;')}} | {{Spec2('HTML5 W3C')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/sup/index.md b/files/fr/web/html/element/sup/index.md index e5479ece4f..92bb36d2e6 100644 --- a/files/fr/web/html/element/sup/index.md +++ b/files/fr/web/html/element/sup/index.md @@ -158,8 +158,8 @@ Bien que, techniquement, le lettrage supérieur ne corresponde pas à la mise en | Spécification | État | Commentaires | | ---------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'semantics.html#the-sub-and-sup-elements', '<sub> and <sup>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-sub-and-sup-elements', '<sub> and <sup>;')}} | {{Spec2('HTML5 W3C')}} |  | +| {{SpecName('HTML WHATWG', 'semantics.html#the-sub-and-sup-elements', '<sub> and <sup>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-sub-and-sup-elements', '<sub> and <sup>;')}} | {{Spec2('HTML5 W3C')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/table/index.md b/files/fr/web/html/element/table/index.md index 1ebc3e3868..b7ba1cf0d7 100644 --- a/files/fr/web/html/element/table/index.md +++ b/files/fr/web/html/element/table/index.md @@ -73,7 +73,7 @@ Cet élément inclut [les attributs universels](/fr/docs/Web/HTML/Attributs_univ - : Cet attribut à valeurs multiples définit la manière dont les traits doivent apparaître au sein du tableau. Il peut avoir les valeurs suivantes : - `none`, les traits ne doivent pas être affichés, c'est la valeur par défaut - - `groups`, les traits sont uniquement affichés entre les groupes de lignes du tableau (définis par les éléments {{HTMLElement("thead")}}, {{HTMLElement("tbody")}} et {{HTMLElement("tfoot")}}) et entre les groupes de colonnes (définis par les éléments {{HTMLElement("col")}} et {{HTMLElement("colgroup")}}) + - `groups`, les traits sont uniquement affichés entre les groupes de lignes du tableau (définis par les éléments {{HTMLElement("thead")}}, {{HTMLElement("tbody")}} et {{HTMLElement("tfoot")}}) et entre les groupes de colonnes (définis par les éléments {{HTMLElement("col")}} et {{HTMLElement("colgroup")}}) - `rows`, les traits seront affichées entre les lignes du tableau - `columns`, les lignes seront affichées entre les colonnes du tableau - `all`, tous les traits seront affichés (entre les lignes et entre les colonnes). @@ -288,7 +288,7 @@ Si le tableau ne peut pas être subdivisé, on pourra utiliser les attributs {{h - [Utiliser les tableaux HTML pour les personnes souffrant de troubles de la vision](/fr/Apprendre/HTML/Tableaux/Advanced#Tableaux_pour_des_utisateurs_malvoyants) - [Les tableaux avec des en-têtes sur plusieurs niveaux • Tutoriels d'accesibilité web W3C WAI (en anglais)](https://www.w3.org/WAI/tutorials/tables/multi-level/) -- [H43 : Utiliser les attributs `id` et `headers` afin d'associer les cellules de données et les cellules d'en-tête dans les tableaux | Techniques W3C pour WCAG 2.0 (en anglais)](https://www.w3.org/TR/WCAG20-TECHS/H43.html) +- [H43 : Utiliser les attributs `id` et `headers` afin d'associer les cellules de données et les cellules d'en-tête dans les tableaux | Techniques W3C pour WCAG 2.0 (en anglais)](https://www.w3.org/TR/WCAG20-TECHS/H43.html) ## Résumé technique @@ -322,7 +322,7 @@ Si le tableau ne peut pas être subdivisé, on pourra utiliser les attributs {{h L'un ou l'autre de ces deux cas de figure : <ul> <li> - zéro ou plusieurs éléments {{HTMLElement("tbody")}} + zéro ou plusieurs éléments {{HTMLElement("tbody")}} </li> <li>un ou plusieurs éléments {{HTMLElement("tr")}}</li> </ul> @@ -354,8 +354,8 @@ Si le tableau ne peut pas être subdivisé, on pourra utiliser les attributs {{h | Spécification | État | Commentaires | | -------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG','tables.html#the-table-element','table element')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C','tabular-data.html#the-table-element','table element')}} | {{Spec2('HTML5 W3C')}} |  | +| {{SpecName('HTML WHATWG','tables.html#the-table-element','table element')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C','tabular-data.html#the-table-element','table element')}} | {{Spec2('HTML5 W3C')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/td/index.md b/files/fr/web/html/element/td/index.md index 51ee3ad3b7..e1503d3a49 100644 --- a/files/fr/web/html/element/td/index.md +++ b/files/fr/web/html/element/td/index.md @@ -21,7 +21,7 @@ Cet élément inclut [les attributs universels](/fr/docs/Web/HTML/Attributs_univ - {{htmlattrdef("colspan")}} - - : Cet attribut contient un entier positif indiquant le nombre de colonnes sur lesquelles s'étend la cellule. La valeur par défaut est 1, si la valeur est 0, la cellule s'étend jusqu'à la fin du {{HTMLElement("colgroup")}} auquel appartient la cellule, même si celui-ci est défini implicitement. Des valeurs supérieures à 1000 peuvent être considérées comme incorrectes et seront interprétées comme valant la valeur par défaut (1). + - : Cet attribut contient un entier positif indiquant le nombre de colonnes sur lesquelles s'étend la cellule. La valeur par défaut est 1, si la valeur est 0, la cellule s'étend jusqu'à la fin du {{HTMLElement("colgroup")}} auquel appartient la cellule, même si celui-ci est défini implicitement. Des valeurs supérieures à 1000 peuvent être considérées comme incorrectes et seront interprétées comme valant la valeur par défaut (1). > **Note :** En {{HTMLVersionInline(5)}} cet attribut ne peut valoir qu'un nombre strictement positif car [il ne doit pas être utilisé pour faire chevaucher des cellules](https://dev.w3.org/html5/spec/single-page.html#attr-tdth-colspan). Par ailleurs, Firefox est le seul navigateur supportant la valeur 0 définie par la spécification {{HTMLVersionInline(4.01)}}. @@ -46,7 +46,7 @@ Cet élément inclut [les attributs universels](/fr/docs/Web/HTML/Attributs_univ - `center` : le contenu de la cellule est centré horizontalement - `right` : le contenu de la cellule est aligné à droite de la cellule - `justify` : insert des espaces dans le contenu textuel afin que le contenu de la cellule soit justifié - - `char` : aligne le contenu textuel de la cellule selon un caractère spécial avec un décalage minimum définis par les attributs {{htmlattrxref("char", "td")}} et {{htmlattrxref("charoff", "td")}} {{unimplemented_inline(2212)}}. + - `char` : aligne le contenu textuel de la cellule selon un caractère spécial avec un décalage minimum définis par les attributs {{htmlattrxref("char", "td")}} et {{htmlattrxref("charoff", "td")}} {{unimplemented_inline(2212)}}. Si cet attribut n'est pas renseigné, la valeur `left` est prise par défaut. @@ -68,51 +68,51 @@ Cet élément inclut [les attributs universels](/fr/docs/Web/HTML/Attributs_univ <table> <tbody> <tr> - <td> </td> + <td></td> <td><code>black</code> = "#000000"</td> - <td> </td> + <td></td> <td><code>green</code> = "#008000"</td> </tr> <tr> - <td> </td> + <td></td> <td><code>silver</code> = "#C0C0C0"</td> - <td> </td> + <td></td> <td><code>lime</code> = "#00FF00"</td> </tr> <tr> - <td> </td> + <td></td> <td><code>gray</code> = "#808080"</td> - <td> </td> + <td></td> <td><code>olive</code> = "#808000"</td> </tr> <tr> - <td> </td> + <td></td> <td><code>white</code> = "#FFFFFF"</td> - <td> </td> + <td></td> <td><code>yellow</code> = "#FFFF00"</td> </tr> <tr> - <td> </td> + <td></td> <td><code>maroon</code> = "#800000"</td> - <td> </td> + <td></td> <td><code>navy</code> = "#000080"</td> </tr> <tr> - <td> </td> + <td></td> <td><code>red</code> = "#FF0000"</td> - <td> </td> + <td></td> <td><code>blue</code> = "#0000FF"</td> </tr> <tr> - <td> </td> + <td></td> <td><code>purple</code> = "#800080"</td> - <td> </td> + <td></td> <td><code>teal</code> = "#008080"</td> </tr> <tr> - <td> </td> + <td></td> <td><code>fuchsia</code> = "#FF00FF"</td> - <td> </td> + <td></td> <td> <p><code>aqua</code> = "#00FFFF"</p> </td> @@ -199,7 +199,7 @@ Cet élément inclut [les attributs universels](/fr/docs/Web/HTML/Attributs_univ <th scope="row">Omission de balises</th> <td> La balise de début est obligatoire. La balise de fin peut être absente - si l'élément est immédiatement suivi par un élément + si l'élément est immédiatement suivi par un élément {{HTMLElement("th")}} ou un élément {{HTMLElement("td")}} ou s'il n'y a plus aucune donnée dans l'élément parent. </td> @@ -223,8 +223,8 @@ Cet élément inclut [les attributs universels](/fr/docs/Web/HTML/Attributs_univ | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------ | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG','tables.html#the-td-element','td element')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C','tabular-data.html#the-td-element','td element')}} | {{Spec2('HTML5 W3C')}} |  | +| {{SpecName('HTML WHATWG','tables.html#the-td-element','td element')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C','tabular-data.html#the-td-element','td element')}} | {{Spec2('HTML5 W3C')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/textarea/index.md b/files/fr/web/html/element/textarea/index.md index 60901cd5ca..8655ce394e 100644 --- a/files/fr/web/html/element/textarea/index.md +++ b/files/fr/web/html/element/textarea/index.md @@ -231,9 +231,9 @@ Cet exemple affiche deux éléments `<textarea>` : le premier est désactivé av | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------------------ | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'forms.html#the-textarea-element', '<textarea>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'forms.html#the-textarea-element', '<textarea>')}} | {{Spec2('HTML5 W3C')}} |  | -| {{SpecName('HTML4.01', 'interact/forms.html#h-17.7', '<textarea>')}} | {{Spec2('HTML4.01')}} |  | +| {{SpecName('HTML WHATWG', 'forms.html#the-textarea-element', '<textarea>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'forms.html#the-textarea-element', '<textarea>')}} | {{Spec2('HTML5 W3C')}} | | +| {{SpecName('HTML4.01', 'interact/forms.html#h-17.7', '<textarea>')}} | {{Spec2('HTML4.01')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/tfoot/index.md b/files/fr/web/html/element/tfoot/index.md index 86fa4aa230..8c3a7e15de 100644 --- a/files/fr/web/html/element/tfoot/index.md +++ b/files/fr/web/html/element/tfoot/index.md @@ -29,7 +29,7 @@ Cet élément inclut [les attributs universels](/fr/docs/Web/HTML/Attributs_univ - `center` : le contenu de la cellule est centré horizontalement - `right` : le contenu de la cellule est aligné à droite de la cellule - `justify` : insert des espaces dans le contenu textuel afin que le contenu de la cellule soit justifié - - `char` : aligne le contenu textuel de la cellule selon un caractère spécial avec un décalage minimum définis par les attributs {{htmlattrxref("char", "tfoot")}} et {{htmlattrxref("charoff", "tfoot")}} {{unimplemented_inline(2212)}}. + - `char` : aligne le contenu textuel de la cellule selon un caractère spécial avec un décalage minimum définis par les attributs {{htmlattrxref("char", "tfoot")}} et {{htmlattrxref("charoff", "tfoot")}} {{unimplemented_inline(2212)}}. Si cet attribut n'est pas renseigné, la valeur `left` est prise par défaut. @@ -79,7 +79,7 @@ Cet élément inclut [les attributs universels](/fr/docs/Web/HTML/Attributs_univ </tbody> </table> - > **Note :** Il est fortement conseillé de ne pas utiliser cet attribut car celui-ci n'est pas un attribut standard et n'a été implémentée que sous certaines versions d'Internet Explorer. L'élément {{HTMLElement("tfoot")}} doit être mis en forme grâce au [CSS](/fr/docs/CSS). Pour fournir un effet semblable à celui achevé par l'attribut **`bgcolor`**, il est possible d'utiliser la propriété CSS {{cssxref("background-color")}} sur les éléments {{HTMLElement("td")}} ou {{HTMLElement("th")}} souhaités. + > **Note :** Il est fortement conseillé de ne pas utiliser cet attribut car celui-ci n'est pas un attribut standard et n'a été implémentée que sous certaines versions d'Internet Explorer. L'élément {{HTMLElement("tfoot")}} doit être mis en forme grâce au [CSS](/fr/docs/CSS). Pour fournir un effet semblable à celui achevé par l'attribut **`bgcolor`**, il est possible d'utiliser la propriété CSS {{cssxref("background-color")}} sur les éléments {{HTMLElement("td")}} ou {{HTMLElement("th")}} souhaités. - {{htmlattrdef("char")}} {{Deprecated_inline}} en {{HTMLVersionInline("4")}}, {{obsolete_inline}} en {{HTMLVersionInline("5")}} @@ -193,8 +193,8 @@ Cet élément inclut [les attributs universels](/fr/docs/Web/HTML/Attributs_univ | Spécification | État | Commentaires | | -------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG','tables.html#the-tfoot-element','tfoot element')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C','tabular-data.html#the-tfoot-element','tfoot element')}} | {{Spec2('HTML5 W3C')}} |  | +| {{SpecName('HTML WHATWG','tables.html#the-tfoot-element','tfoot element')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C','tabular-data.html#the-tfoot-element','tfoot element')}} | {{Spec2('HTML5 W3C')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/th/index.md b/files/fr/web/html/element/th/index.md index 18236440e1..9ca7680711 100644 --- a/files/fr/web/html/element/th/index.md +++ b/files/fr/web/html/element/th/index.md @@ -22,7 +22,7 @@ Cet élément inclut [les attributs universels](/fr/docs/Web/HTML/Attributs_univ - {{htmlattrdef("abbr")}} - : Cet attribut contient une description courte et abrégée du contenu de la cellule. Certains outils utilisateurs, comme la synthèse vocale, peuvent décrire cette information avant le contenu lui-même. - {{htmlattrdef("colspan")}} - - : Cet attribut contient un entier positif indiquant le nombre de colonnes sur lesquelles s'étend la cellule. La valeur par défaut est 1. Si cet attribut vaut 0, la cellule s'étend jusqu'à la fin du {{HTMLElement("colgroup")}} auquel appartient la cellule, même si celui-ci est défini implicitement. Des valeurs supérieures à 1000 peuvent être considérées comme incorrectes et seront écrétées à 1000. + - : Cet attribut contient un entier positif indiquant le nombre de colonnes sur lesquelles s'étend la cellule. La valeur par défaut est 1. Si cet attribut vaut 0, la cellule s'étend jusqu'à la fin du {{HTMLElement("colgroup")}} auquel appartient la cellule, même si celui-ci est défini implicitement. Des valeurs supérieures à 1000 peuvent être considérées comme incorrectes et seront écrétées à 1000. - {{htmlattrdef("headers")}} - : Cet attribut est une liste de chaînes de caractères séparées par des espace. Chacune correspond à l'attribut `id` de l'élément {{HTMLElement("th")}} qui s'applique à cet élément. - {{htmlattrdef("rowspan")}} @@ -47,7 +47,7 @@ Cet élément inclut [les attributs universels](/fr/docs/Web/HTML/Attributs_univ - `center` : le contenu de la cellule est centré horizontalement - `right` : le contenu de la cellule est aligné à droite de la cellule - `justify` : insert des espaces dans le contenu textuel afin que le contenu de la cellule soit justifié - - `char` : aligne le contenu textuel de la cellule selon un caractère spécial avec un décalage minimum définis par les attributs {{htmlattrxref("char", "th")}} et {{htmlattrxref("charoff", "th")}} {{unimplemented_inline(2212)}}. + - `char` : aligne le contenu textuel de la cellule selon un caractère spécial avec un décalage minimum définis par les attributs {{htmlattrxref("char", "th")}} et {{htmlattrxref("charoff", "th")}} {{unimplemented_inline(2212)}}. Si cet attribut n'est pas renseigné, la valeur `left` est prise par défaut. @@ -176,8 +176,8 @@ Cet élément inclut [les attributs universels](/fr/docs/Web/HTML/Attributs_univ | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------ | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG','tables.html#the-th-element','th element')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C','tabular-data.html#the-th-element','th element')}} | {{Spec2('HTML5 W3C')}} |  | +| {{SpecName('HTML WHATWG','tables.html#the-th-element','th element')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C','tabular-data.html#the-th-element','th element')}} | {{Spec2('HTML5 W3C')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/thead/index.md b/files/fr/web/html/element/thead/index.md index e739de828b..9b82ab4240 100644 --- a/files/fr/web/html/element/thead/index.md +++ b/files/fr/web/html/element/thead/index.md @@ -29,7 +29,7 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive - `center` : le contenu de la cellule est centré horizontalement - `right` : le contenu de la cellule est aligné à droite de la cellule - `justify` : insert des espaces dans le contenu textuel afin que le contenu de la cellule soit justifié - - `char` : aligne le contenu textuel de la cellule selon un caractère spécial avec un décalage minimum définis par les attributs {{htmlattrxref("char", "thead")}} et {{htmlattrxref("charoff", "thead")}} {{unimplemented_inline(2212)}}. + - `char` : aligne le contenu textuel de la cellule selon un caractère spécial avec un décalage minimum définis par les attributs {{htmlattrxref("char", "thead")}} et {{htmlattrxref("charoff", "thead")}} {{unimplemented_inline(2212)}}. Si cet attribut n'est pas renseigné, la valeur `left` est prise par défaut. @@ -42,7 +42,7 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive - : Cet attribut définit la couleur d'arrière-plan de toutes les cellules. C'est un code à 6 chiffres hexadécimaux comme défini par le [sRGB](https://www.w3.org/Graphics/Color/sRGB). Il est précédé d'un '#'. Un des [mots-clés préfédinis pour les couleurs](/fr/docs/Web/CSS/color_value#color_keywords) peut également être utilisé. - > **Note :** Il est fortement conseillé de ne pas utiliser cet attribut car celui-ci n'est pas un attribut standard et n'a été implémentée que sous certaines versions d'Internet Explorer. L'élément {{HTMLElement("thead")}} doit être mis en forme grâce au [CSS](/fr/docs/CSS). Pour fournir un effet semblable à celui achevé par l'attribut **bgcolor**, il est possible d'utiliser la propriété CSS {{cssxref("background-color")}} sur les éléments {{HTMLElement("td")}} ou {{HTMLElement("th")}} souhaités. + > **Note :** Il est fortement conseillé de ne pas utiliser cet attribut car celui-ci n'est pas un attribut standard et n'a été implémentée que sous certaines versions d'Internet Explorer. L'élément {{HTMLElement("thead")}} doit être mis en forme grâce au [CSS](/fr/docs/CSS). Pour fournir un effet semblable à celui achevé par l'attribut **bgcolor**, il est possible d'utiliser la propriété CSS {{cssxref("background-color")}} sur les éléments {{HTMLElement("td")}} ou {{HTMLElement("th")}} souhaités. - {{htmlattrdef("char")}} {{Deprecated_inline}} en {{HTMLVersionInline("4")}}, {{obsolete_inline}} en {{HTMLVersionInline("5")}} @@ -152,8 +152,8 @@ Comme tous les autres éléments HTML, cet élément inclut [les attributs unive | Spécification | État | Commentaires | | -------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG','tables.html#the-thead-element','thead element')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C','tabular-data.html#the-thead-element','thead element')}} | {{Spec2('HTML5 W3C')}} |  | +| {{SpecName('HTML WHATWG','tables.html#the-thead-element','thead element')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C','tabular-data.html#the-thead-element','thead element')}} | {{Spec2('HTML5 W3C')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/title/index.md b/files/fr/web/html/element/title/index.md index a8262f98ef..45b4ec4d76 100644 --- a/files/fr/web/html/element/title/index.md +++ b/files/fr/web/html/element/title/index.md @@ -112,9 +112,9 @@ Mettre à jour la valeur de `title` afin de refléter un changement d'état impo | Spécification | État | Commentaires | | -------------------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'semantics.html#the-title-element', '<title>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'document-metadata.html#the-title-element', '<title>')}} | {{Spec2('HTML5 W3C')}} |  | -| {{SpecName('HTML4.01', 'struct/global.html#h-7.4.2', '<title>')}} | {{Spec2('HTML4.01')}} |  | +| {{SpecName('HTML WHATWG', 'semantics.html#the-title-element', '<title>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'document-metadata.html#the-title-element', '<title>')}} | {{Spec2('HTML5 W3C')}} | | +| {{SpecName('HTML4.01', 'struct/global.html#h-7.4.2', '<title>')}} | {{Spec2('HTML4.01')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/element/track/index.md b/files/fr/web/html/element/track/index.md index fabc4ea2a2..8f07ff3429 100644 --- a/files/fr/web/html/element/track/index.md +++ b/files/fr/web/html/element/track/index.md @@ -32,7 +32,7 @@ L'élément HTML **`<track>`** est utilisé comme élément fils d'un élément - `captions` - - La piste est une retransciption voire une traduction de la partie audio du média. + - La piste est une retransciption voire une traduction de la partie audio du média. - La piste peut contenir des informations non-verbales importantes comme des indications musicales ou des effets sonores. La piste peut également indiquer la source du bruit (musique, personnage, etc.). - Ce type de piste est adapté aux utilisateurs malentendants ou lorsque le son est désactivé. diff --git a/files/fr/web/html/element/u/index.md b/files/fr/web/html/element/u/index.md index 1ed27bb44b..31868c50ed 100644 --- a/files/fr/web/html/element/u/index.md +++ b/files/fr/web/html/element/u/index.md @@ -82,7 +82,7 @@ La plupart du temps, ce n'est pas l'élément `<u>` qu'il faut utiliser. Voici q #### Souligner pour la simple mise en forme -Pour souligner du texte sans que cela ait une quelconque portée sémantique, on utilisera un élément {{HTMLElement("span")}} qu'on mettra en forme avec la propriété CSS {{cssxref("text-decoration")}} et la valeur `"underline"` : +Pour souligner du texte sans que cela ait une quelconque portée sémantique, on utilisera un élément {{HTMLElement("span")}} qu'on mettra en forme avec la propriété CSS {{cssxref("text-decoration")}} et la valeur `"underline"` : ##### HTML @@ -189,5 +189,5 @@ Les titres de livres doivent être indiqués avec un élément {{HTMLElement("ci ## Voir aussi -- Les éléments {{HTMLElement("span")}}, {{HTMLElement("i")}}, {{HTMLElement("em")}}, {{HTMLElement("b")}} et {{HTMLElement("cite")}} qui, selon les cas, peuvent être utilisés à la place de `<u>`. +- Les éléments {{HTMLElement("span")}}, {{HTMLElement("i")}}, {{HTMLElement("em")}}, {{HTMLElement("b")}} et {{HTMLElement("cite")}} qui, selon les cas, peuvent être utilisés à la place de `<u>`. - La propriété CSS {{cssxref("text-decoration")}} qui permet d'obtenir un effet stylistique semblable à la mise en forme par défaut d'un élément `<u>`. diff --git a/files/fr/web/html/element/var/index.md b/files/fr/web/html/element/var/index.md index 978481d992..82f3bfd85b 100644 --- a/files/fr/web/html/element/var/index.md +++ b/files/fr/web/html/element/var/index.md @@ -141,8 +141,8 @@ var { | Spécification | État | Commentaires | | -------------------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', 'text-level-semantics.html#the-var-element', '<var>')}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-var-element', '<var>')}} | {{Spec2('HTML5 W3C')}} |  | +| {{SpecName('HTML WHATWG', 'text-level-semantics.html#the-var-element', '<var>')}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', 'text-level-semantics.html#the-var-element', '<var>')}} | {{Spec2('HTML5 W3C')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/global_attributes/autocapitalize/index.md b/files/fr/web/html/global_attributes/autocapitalize/index.md index d562b10ce6..3f5accc1fe 100644 --- a/files/fr/web/html/global_attributes/autocapitalize/index.md +++ b/files/fr/web/html/global_attributes/autocapitalize/index.md @@ -26,7 +26,7 @@ L'attribut `autocapitalize` n'entraînera pas de mise en majuscule automatique p | Spécification | État | Commentaires | | ---------------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', "interaction.html#autocapitalization", "autocapitalize")}} | {{Spec2('HTML WHATWG')}} |  | +| {{SpecName('HTML WHATWG', "interaction.html#autocapitalization", "autocapitalize")}} | {{Spec2('HTML WHATWG')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/global_attributes/class/index.md b/files/fr/web/html/global_attributes/class/index.md index cd398b7af3..35e32de2c6 100644 --- a/files/fr/web/html/global_attributes/class/index.md +++ b/files/fr/web/html/global_attributes/class/index.md @@ -23,7 +23,7 @@ Bien que la spécification ne précise aucune contrainte quant aux noms utilisé | ------------------------------------------------------------------------------------------------ | -------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | {{SpecName('HTML WHATWG', "dom.html#classes", "class")}} | {{Spec2('HTML WHATWG')}} | Aucune modification depuis {{SpecName('HTML5.1')}}. | | {{SpecName('HTML5.1', "dom.html#element-attrdef-global-class", "class")}} | {{Spec2('HTML5.1')}} | État selon {{SpecName('HTML WHATWG')}}. Aucune modification depuis {{SpecName('HTML5 W3C')}} | -| {{SpecName('HTML5 W3C', "dom.html#classes", "class")}} | {{Spec2('HTML5 W3C')}} | État selon {{SpecName('HTML WHATWG')}}. `class` est désormas sun attribut universel depuis {{SpecName('HTML4.01')}},. | +| {{SpecName('HTML5 W3C', "dom.html#classes", "class")}} | {{Spec2('HTML5 W3C')}} | État selon {{SpecName('HTML WHATWG')}}. `class` est désormas sun attribut universel depuis {{SpecName('HTML4.01')}},. | | {{SpecName('HTML4.01', "struct/global.html#h-7.5.2", "class")}} | {{Spec2('HTML4.01')}} | Cet attribut est pris en charge sur tous les éléments à l'exception de {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}} et {{HTMLElement("title")}}. | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/global_attributes/contextmenu/index.md b/files/fr/web/html/global_attributes/contextmenu/index.md index 5dc068c1cf..2e5b1c7415 100644 --- a/files/fr/web/html/global_attributes/contextmenu/index.md +++ b/files/fr/web/html/global_attributes/contextmenu/index.md @@ -32,18 +32,18 @@ Voici quelques exemples de personnalisations de menus. Le code HTML pourra être </menu> </menu> <ol> -   <li> -     Dans cet exemple, vous pouvez partager un lien vers -     cette page sur Facebook et/ou Twitter via le groupe Partager - du menu contextuel -   </li> + <li> + Dans cet exemple, vous pouvez partager un lien vers + cette page sur Facebook et/ou Twitter via le groupe Partager + du menu contextuel + </li> <li>Sur cette ligne : on peut partager la page sur Twitter ou Facebook grâce au menu Partager du menu contextuel.</li> <li><pre contextmenu="changeFont" id="fontSizing">Sur cette ligne : on peut changer la taille de la police en utilisant les options "Augmenter/Réduire la taille de la police" du menu contextuel</pre></li> <menu type="context" id="changeFont"> <menuitem label="Augmenter la taille de la police" onclick="incFont()"></menuitem> <menuitem label="Réduire la taille de la police" onclick="decFont()"></menuitem> </menu> - <li contextmenu="ChangeImage" id="changeImage">Sur cette ligne : on peut utiliser l'option "Changer l'image" du menu.</li><br /> + <li contextmenu="ChangeImage" id="changeImage">Sur cette ligne : on peut utiliser l'option "Changer l'image" du menu.</li><br /> <img src="https://developer.mozilla.org/media/img/promote/promobutton_mdn5.png" contextmenu="ChangeImage" id="promoButton" /> <menu type="context" id="ChangeImage"> <menuitem label="Changer l'image" onclick="changeImage()"></menuitem> diff --git a/files/fr/web/html/global_attributes/dir/index.md b/files/fr/web/html/global_attributes/dir/index.md index 837f86e7da..ea0e2e94e2 100644 --- a/files/fr/web/html/global_attributes/dir/index.md +++ b/files/fr/web/html/global_attributes/dir/index.md @@ -19,7 +19,7 @@ Les valeurs autorisées pour cet attribut sont : - `ltr` : qui signifie _left to right_ (gauche à droite), utilisé pour les langages écrits de gauche à droite (comme le français ou l'anglais par exemple) - `rtl` : qui signifie _right to left_ (droite à gauche), utilisé pour les langages écrits de droite à gauche (comme l'arabe par exemple) -- `auto` : qui délègue la décision à l'agent utilisateur. L'algorithme utilisé est relativement simple : le contenu textuel est analysé et lorsque le premier caractère possédant une direction « forte » est rencontré, cette direction est prise pour l'ensemble de l'élément. +- `auto` : qui délègue la décision à l'agent utilisateur. L'algorithme utilisé est relativement simple : le contenu textuel est analysé et lorsque le premier caractère possédant une direction « forte » est rencontré, cette direction est prise pour l'ensemble de l'élément. > **Note :** Cet attribut est obligatoire pour l'élément {{HTMLElement("bdo")}}, pour lequel l'attribut a une sémantique différente. > diff --git a/files/fr/web/html/global_attributes/draggable/index.md b/files/fr/web/html/global_attributes/draggable/index.md index da6e7cb41a..314eb29c7d 100644 --- a/files/fr/web/html/global_attributes/draggable/index.md +++ b/files/fr/web/html/global_attributes/draggable/index.md @@ -30,7 +30,7 @@ En revanche, on pourra correctement utiliser : <label draggable="true">Label exemple</label> ``` -Par défaut, seules les sélections de texte, les images et les liens peuvent être déplacés à la souris. Pour les autres éléments, il faudra définir le gestionnaire d'événements pour {{domxref('GlobalEventHandlers.ondragstart','ondragstart')}} afin de faire fonctionner le glisser-déposer. Cela est illustré [dans cet exemple](/fr/docs/Glisser_et_déposer/Opérations_de_glissement). +Par défaut, seules les sélections de texte, les images et les liens peuvent être déplacés à la souris. Pour les autres éléments, il faudra définir le gestionnaire d'événements pour {{domxref('GlobalEventHandlers.ondragstart','ondragstart')}} afin de faire fonctionner le glisser-déposer. Cela est illustré [dans cet exemple](/fr/docs/Glisser_et_déposer/Opérations_de_glissement). ## Spécifications diff --git a/files/fr/web/html/global_attributes/enterkeyhint/index.md b/files/fr/web/html/global_attributes/enterkeyhint/index.md index 364247dab8..f01e6ee612 100644 --- a/files/fr/web/html/global_attributes/enterkeyhint/index.md +++ b/files/fr/web/html/global_attributes/enterkeyhint/index.md @@ -25,7 +25,7 @@ ou [`pattern`](/fr/docs/Web/HTML/Element/input#htmlattrdefpattern) pour afficher ### Valeurs -L'attribut `enterkeyhint` est un attribut à valeur contrainte et accepte uniquement les valeurs suivantes : +L'attribut `enterkeyhint` est un attribut à valeur contrainte et accepte uniquement les valeurs suivantes : | Valeur | Description | Libellé de l'exemple (dépend de l'agent utilisateur et de la langue) | | ------------------------- | ------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------- | diff --git a/files/fr/web/html/global_attributes/index.md b/files/fr/web/html/global_attributes/index.md index bc41e64456..94d2fc05ad 100644 --- a/files/fr/web/html/global_attributes/index.md +++ b/files/fr/web/html/global_attributes/index.md @@ -88,7 +88,7 @@ En plus des attributs universels HTML, il existe également les attributs univer - {{htmlattrdef("itemref")}} - : Les propriétés d'un objet qui ne sont pas les éléments descendants de l'élément courant peuvent être associée via l'attribut `itemscope` contenant une référence vers un `itemref`. `itemref` fournit une liste d'identifiants d'éléments qui correspondent aux propriétés supplémentaires définies autre part dans le document. Cet attribut est lié [aux microdonnées](https://html.spec.whatwg.org/multipage/#toc-microdata). - {{htmlattrdef("itemscope")}} - - : `itemscope` fonctionne généralement avec `itemtype` afin d'indiquer que le coded HTML contenu dans un bloc donné concerne un objet en particulier. `itemscope` crée l'objet et définit la portée de l'`itemtype` associée. `itemtype` est une URL valide construite à partir d'un vocabulaire (par exemple [schema.org](https://schema.org/)) qui décrit les objets et leurs propriétés. Cet attribut est lié [aux microdonnées](https://html.spec.whatwg.org/multipage/#toc-microdata). + - : `itemscope` fonctionne généralement avec `itemtype` afin d'indiquer que le coded HTML contenu dans un bloc donné concerne un objet en particulier. `itemscope` crée l'objet et définit la portée de l'`itemtype` associée. `itemtype` est une URL valide construite à partir d'un vocabulaire (par exemple [schema.org](https://schema.org/)) qui décrit les objets et leurs propriétés. Cet attribut est lié [aux microdonnées](https://html.spec.whatwg.org/multipage/#toc-microdata). - {{htmlattrdef("itemtype")}} - : Cet attribut indique l'URL du vocabulaire utilisé pour définir les propriétés d'un objet. Cet attribut est lié [aux microdonnées](https://html.spec.whatwg.org/multipage/#toc-microdata). - {{htmlattrdef("lang")}} diff --git a/files/fr/web/html/global_attributes/is/index.md b/files/fr/web/html/global_attributes/is/index.md index 9df0b63838..dbc061d32b 100644 --- a/files/fr/web/html/global_attributes/is/index.md +++ b/files/fr/web/html/global_attributes/is/index.md @@ -44,7 +44,7 @@ customElements.define('word-count', WordCount, { extends: 'p' }); | Spécification | État | Commentaires | | ---------------------------------------------------------------------------------------- | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', "custom-elements.html#attr-is", "is")}} | {{Spec2('HTML WHATWG')}} |  | +| {{SpecName('HTML WHATWG', "custom-elements.html#attr-is", "is")}} | {{Spec2('HTML WHATWG')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/global_attributes/itemid/index.md b/files/fr/web/html/global_attributes/itemid/index.md index 38c6c95ba4..91bc0411a6 100644 --- a/files/fr/web/html/global_attributes/itemid/index.md +++ b/files/fr/web/html/global_attributes/itemid/index.md @@ -74,8 +74,8 @@ Un élément qui décrit un livre : | Spécification | État | Commentaires | | ---------------------------------------------------------------------------------------- | ------------------------------------ | ------------ | -| {{SpecName('HTML Microdata', "#items", "itemid")}} | {{Spec2('HTML Microdata')}} |  | -| {{SpecName('HTML WHATWG', "microdata.html#attr-itemid", "itemid")}} | {{Spec2('HTML WHATWG')}} |  | +| {{SpecName('HTML Microdata', "#items", "itemid")}} | {{Spec2('HTML Microdata')}} | | +| {{SpecName('HTML WHATWG', "microdata.html#attr-itemid", "itemid")}} | {{Spec2('HTML WHATWG')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/global_attributes/itemprop/index.md b/files/fr/web/html/global_attributes/itemprop/index.md index b42ef9904e..1cfd77892b 100644 --- a/files/fr/web/html/global_attributes/itemprop/index.md +++ b/files/fr/web/html/global_attributes/itemprop/index.md @@ -12,7 +12,7 @@ original_slug: Web/HTML/Attributs_universels/itemprop --- {{HTMLSidebar("Global_attributes")}} -L'[attribut universel](/fr/docs/Web/HTML/Attributs_universels) **`itemprop`** est utilisé afin d'ajouter des propriétés à un objet. C'est un attribut universel et chaque élément HTML peut donc avoir un attribut `itemprop` qui permettra de former un couple de nom (la valeur de l'attribut) et de valeur (la valeur de l'élément). Chacune de ces paires constitue une **propriété** et un groupe de propriété forme un **objet (_item_)**. Les valeurs des propriétés sont généralement des chaînes de caractères ou des URL et peuvent être associées à de nombreux éléments comme {{HTMLElement("audio")}}, {{HTMLElement("embed")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{HTMLElement("link")}}, {{HTMLElement("object")}}, {{HTMLElement("source")}} , {{HTMLElement("track")}} et {{HTMLElement("video")}}. +L'[attribut universel](/fr/docs/Web/HTML/Attributs_universels) **`itemprop`** est utilisé afin d'ajouter des propriétés à un objet. C'est un attribut universel et chaque élément HTML peut donc avoir un attribut `itemprop` qui permettra de former un couple de nom (la valeur de l'attribut) et de valeur (la valeur de l'élément). Chacune de ces paires constitue une **propriété** et un groupe de propriété forme un **objet (_item_)**. Les valeurs des propriétés sont généralement des chaînes de caractères ou des URL et peuvent être associées à de nombreux éléments comme {{HTMLElement("audio")}}, {{HTMLElement("embed")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{HTMLElement("link")}}, {{HTMLElement("object")}}, {{HTMLElement("source")}} , {{HTMLElement("track")}} et {{HTMLElement("video")}}. ### Un exemple simple @@ -36,7 +36,7 @@ L'[attribut universel](/fr/docs/Web/HTML/Attributs_universels) **`itemprop`** es <table class="standard-table"> <tbody> <tr> - <td colspan="1" rowspan="2"> </td> + <td colspan="1" rowspan="2"> </td> <th colspan="2" rowspan="1"><strong>Objet</strong></th> </tr> <tr> @@ -240,7 +240,7 @@ Une propriété est un ensemble non-ordonné de composants uniques sensibles à <table class="standard-table"> <thead> <tr> - <th colspan="1" rowspan="2" scope="col"> </th> + <th colspan="1" rowspan="2" scope="col"> </th> <th colspan="2" rowspan="1" scope="col">Objet</th> </tr> <tr> @@ -408,8 +408,8 @@ Un exemple sur un livre qu'on décrit avec les différents attributs. | Spécification | État | Commentaires | | -------------------------------------------------------------------------------------------------------------------- | ------------------------------------ | ------------ | -| {{SpecName('HTML Microdata', "#dfn-attr-itemprop", "itemprop")}} | {{Spec2('HTML Microdata')}} |  | -| {{SpecName('HTML WHATWG', "microdata.html#names:-the-itemprop-attribute", "itemprop")}} | {{Spec2('HTML WHATWG')}} |  | +| {{SpecName('HTML Microdata', "#dfn-attr-itemprop", "itemprop")}} | {{Spec2('HTML Microdata')}} | | +| {{SpecName('HTML WHATWG', "microdata.html#names:-the-itemprop-attribute", "itemprop")}} | {{Spec2('HTML WHATWG')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/global_attributes/itemref/index.md b/files/fr/web/html/global_attributes/itemref/index.md index acea015ebe..d811b16eff 100644 --- a/files/fr/web/html/global_attributes/itemref/index.md +++ b/files/fr/web/html/global_attributes/itemref/index.md @@ -34,8 +34,8 @@ L'attribut `itemref` peut uniquement être défini sur des éléments pour lesqu <p id="a">Name: <span itemprop="name">Amanda</span> </p> <div id="b" itemprop="band" itemscope itemref="c"></div> <div id="c"> -   <p>Band: <span itemprop="name">Jazz Band</span> </p> -   <p>Size: <span itemprop="size">12</span> players</p> + <p>Band: <span itemprop="name">Jazz Band</span> </p> + <p>Size: <span itemprop="size">12</span> players</p> </div> ``` @@ -59,8 +59,8 @@ Au format [JSON-LD](https://json-ld.org/) : | Spécification | État | Commentaires | | -------------------------------------------------------------------------------------------- | ------------------------------------ | ------------ | -| {{SpecName('HTML Microdata', "#dfn-itemref", "itemref")}} | {{Spec2('HTML Microdata')}} |  | -| {{SpecName('HTML WHATWG', "microdata.html#attr-itemref", "itemref")}} | {{Spec2('HTML WHATWG')}} |  | +| {{SpecName('HTML Microdata', "#dfn-itemref", "itemref")}} | {{Spec2('HTML Microdata')}} | | +| {{SpecName('HTML WHATWG', "microdata.html#attr-itemref", "itemref")}} | {{Spec2('HTML WHATWG')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/global_attributes/itemscope/index.md b/files/fr/web/html/global_attributes/itemscope/index.md index 8b7a7c7bc3..a4f61c8e89 100644 --- a/files/fr/web/html/global_attributes/itemscope/index.md +++ b/files/fr/web/html/global_attributes/itemscope/index.md @@ -189,8 +189,8 @@ Directions: <br> | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------ | ------------------------------------ | ------------ | -| {{SpecName('HTML Microdata', "#dfn-itemscope", "itemscope")}} | {{Spec2('HTML Microdata')}} |  | -| {{SpecName('HTML WHATWG', "microdata.html#attr-itemscope", "itemscope")}} | {{Spec2('HTML WHATWG')}} |  | +| {{SpecName('HTML Microdata', "#dfn-itemscope", "itemscope")}} | {{Spec2('HTML Microdata')}} | | +| {{SpecName('HTML WHATWG', "microdata.html#attr-itemscope", "itemscope")}} | {{Spec2('HTML WHATWG')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/global_attributes/itemtype/index.md b/files/fr/web/html/global_attributes/itemtype/index.md index 4f00351717..4753e6241a 100644 --- a/files/fr/web/html/global_attributes/itemtype/index.md +++ b/files/fr/web/html/global_attributes/itemtype/index.md @@ -15,13 +15,13 @@ original_slug: Web/HTML/Attributs_universels/itemtype L'[attribut universel](/fr/docs/Web/HTML/Attributs_universels) **`itemtype`** définit l'URL du vocabulaire qui sera utilisé pour définir les propriétés des objets dans la structure de données. `itemscope` est utilisé afin de définir la portée, dans le document, où le vocabulaire défini sera actif. -L'attribut `itemtype` doit avoir une valeur qui est un ensemble non ordonné de fragments uniques, sensible à la casse. Chaque fragment doit être une URL absolue valide et tous les fragments participent à la définition du même vocabulaire. La valeur de l'attribut doit avoir au moins un fragment. +L'attribut `itemtype` doit avoir une valeur qui est un ensemble non ordonné de fragments uniques, sensible à la casse. Chaque fragment doit être une URL absolue valide et tous les fragments participent à la définition du même vocabulaire. La valeur de l'attribut doit avoir au moins un fragment. Les types d'objet doivent tous être définis dans des spécifications de vocabulaire (comme [schema.org](http://schema.org/)) et doivent tous être définis avec le même vocabulaire. L'attribut `itemtype` peut uniquement être défini pour les éléments qui ont un attribut `itemscope`. -Google et les autres moteurs de recherche participent au vocabulaire défini par [schema.org](http://schema.org/) pour structurer les données. Ce vocabulaire définit un ensemble standard de types et de noms de propriétés. Par exemple [`MusicEvent`](http://schema.org/MusicEvent) indique un événement musical dont les propriétés [`startDate`](http://schema.org/startDate) et [`location`](http://schema.org/location) utilisées pour définir les détails du concert. Dans ce cas, l'URL [`http://schema.org/MusicEvent`](http://schema.org/MusicEvent) sera l'URL utilisée pour l'attribut `itemtype` et les propriétés `startDate` et `location` seront les propriétés utilisées, définies par [`http://schema.org/MusicEvent`](http://schema.org/MusicEvent). +Google et les autres moteurs de recherche participent au vocabulaire défini par [schema.org](http://schema.org/) pour structurer les données. Ce vocabulaire définit un ensemble standard de types et de noms de propriétés. Par exemple [`MusicEvent`](http://schema.org/MusicEvent) indique un événement musical dont les propriétés [`startDate`](http://schema.org/startDate) et [`location`](http://schema.org/location) utilisées pour définir les détails du concert. Dans ce cas, l'URL [`http://schema.org/MusicEvent`](http://schema.org/MusicEvent) sera l'URL utilisée pour l'attribut `itemtype` et les propriétés `startDate` et `location` seront les propriétés utilisées, définies par [`http://schema.org/MusicEvent`](http://schema.org/MusicEvent). > **Note :** Vous pourrez trouver plus d'informations sur l'attribut itemtype sur <http://schema.org/Thing> @@ -72,8 +72,8 @@ Google et les autres moteurs de recherche participent au vocabulaire défini pa | Spécification | État | Commentaires | | ------------------------------------------------------------------------------------------------ | ------------------------------------ | ------------ | -| {{SpecName('HTML Microdata', "#dfn-itemtype", "itemtype")}} | {{Spec2('HTML Microdata')}} |  | -| {{SpecName('HTML WHATWG', "microdata.html#attr-itemtype", "itemprop")}} | {{Spec2('HTML WHATWG')}} |  | +| {{SpecName('HTML Microdata', "#dfn-itemtype", "itemtype")}} | {{Spec2('HTML Microdata')}} | | +| {{SpecName('HTML WHATWG', "microdata.html#attr-itemtype", "itemprop")}} | {{Spec2('HTML WHATWG')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/global_attributes/lang/index.md b/files/fr/web/html/global_attributes/lang/index.md index 1b3bfd1b3d..5f6bad8889 100644 --- a/files/fr/web/html/global_attributes/lang/index.md +++ b/files/fr/web/html/global_attributes/lang/index.md @@ -11,7 +11,7 @@ original_slug: Web/HTML/Attributs_universels/lang --- {{HTMLSidebar("Global_attributes")}} -L'[attribut universel](/fr/docs/Web/HTML/Attributs_universels) **`lang`** permet de définir la langue utilisée pour l'élément. Pour les éléments non-éditables, c'est la langue dans laquelle ils sont écrits. Pour les éléments éditables, c'est la langue dans laquelle devrait écrire l'utilisateur. La valeur de cet attribut est une « balise de langue » dont le format est défini par le document de l'IETF : [_Les balises d'identification de langues (BCP47)_](https://www.ietf.org/rfc/bcp/bcp47.txt). Si cette balise est la chaîne vide, la langue sera définie comme _inconnue_. Si la balise de langue n'est pas valide selon BCP47, la langue sera définie comme _invalide_. +L'[attribut universel](/fr/docs/Web/HTML/Attributs_universels) **`lang`** permet de définir la langue utilisée pour l'élément. Pour les éléments non-éditables, c'est la langue dans laquelle ils sont écrits. Pour les éléments éditables, c'est la langue dans laquelle devrait écrire l'utilisateur. La valeur de cet attribut est une « balise de langue » dont le format est défini par le document de l'IETF : [_Les balises d'identification de langues (BCP47)_](https://www.ietf.org/rfc/bcp/bcp47.txt). Si cette balise est la chaîne vide, la langue sera définie comme _inconnue_. Si la balise de langue n'est pas valide selon BCP47, la langue sera définie comme _invalide_. {{EmbedInteractiveExample("pages/tabbed/attribute-lang.html","tabbed-shorter")}} @@ -32,7 +32,7 @@ Voici un aperçu de la syntaxe simplifiée. Une balise de langue est composées - Sous-balise régionale - : Ce fragment est optionnel. Il définit un dialecte de la langue de base pour une région donnée. Cette sous-balise est composée de deux lettres en majuscules pour indiquer un pays ou de trois chiffres pour une indiquer une région qui n'est pas un pays. Ainsi, `es-ES` représente l'espagnol parlé en Espagne et `es-013` représente l'espagnol parlé en Amérique centrale ; l'espagnol international serait simplement `es`. -La sous-balise de script doit précéder la sous-balise régionale si les deux sont présentes. Voici un exemple avec les trois fragments : `ru-Cyrl-BY` qui correspond au russe, écrit avec l'alphabet cyrillique, tel que parlé en Biélorussie. +La sous-balise de script doit précéder la sous-balise régionale si les deux sont présentes. Voici un exemple avec les trois fragments : `ru-Cyrl-BY` qui correspond au russe, écrit avec l'alphabet cyrillique, tel que parlé en Biélorussie. ## Spécifications diff --git a/files/fr/web/html/global_attributes/slot/index.md b/files/fr/web/html/global_attributes/slot/index.md index 94dda62360..e47146a5f4 100644 --- a/files/fr/web/html/global_attributes/slot/index.md +++ b/files/fr/web/html/global_attributes/slot/index.md @@ -19,8 +19,8 @@ Pour des exemples d'application, consulter le guide [Utiliser les modèles (_tem | Spécification | État | Commentaires | | ---------------------------------------------------------------------------------------- | -------------------------------- | ------------ | -| {{SpecName('HTML WHATWG', "dom.html#attr-slot", "slot attribute")}} | {{Spec2('HTML WHATWG')}} |  | -| {{SpecName('DOM WHATWG', "#dom-element-slot", "slot attribute")}} | {{Spec2('DOM WHATWG')}} |  | +| {{SpecName('HTML WHATWG', "dom.html#attr-slot", "slot attribute")}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('DOM WHATWG', "#dom-element-slot", "slot attribute")}} | {{Spec2('DOM WHATWG')}} | | ## Compatibilité des navigateurs diff --git a/files/fr/web/html/link_types/preload/index.md b/files/fr/web/html/link_types/preload/index.md index e53e9481e1..bc4c6fa0b9 100644 --- a/files/fr/web/html/link_types/preload/index.md +++ b/files/fr/web/html/link_types/preload/index.md @@ -10,18 +10,18 @@ La valeur `preload` de l'attribut {{htmlattrxref("rel", "link")}} de l'élément ## Les bases -Pour charger un fichier CSS permettant de styler une page, on utilise le plus souvent l'élément `<link>` de la manière suivante : +Pour charger un fichier CSS permettant de styler une page, on utilise le plus souvent l'élément `<link>` de la manière suivante : ```html <link rel="stylesheet" href="styles/main.css"> ``` -Ici, nous allons utiliser la valeur `preload` sur l'attribut `rel`, ce qui transformera l'élément `<link>` en outil de préchargement utilisable pour n'importe quelle ressource. Nous devrons aussi indiquer : +Ici, nous allons utiliser la valeur `preload` sur l'attribut `rel`, ce qui transformera l'élément `<link>` en outil de préchargement utilisable pour n'importe quelle ressource. Nous devrons aussi indiquer : -- le chemin de la ressource dans l'attribut {{htmlattrxref("href", "link")}} ; -- le type de ressource dans l'attribut {{htmlattrxref("as", "link")}} ; +- le chemin de la ressource dans l'attribut {{htmlattrxref("href", "link")}} ; +- le type de ressource dans l'attribut {{htmlattrxref("as", "link")}} ; -Voici un exemple simple (voir nos [fichiers JS et CSS d'exemple](https://github.com/mdn/html-examples/tree/master/link-rel-preload/js-and-css) et le [résultat obtenu](https://mdn.github.io/html-examples/link-rel-preload/js-and-css/)) : +Voici un exemple simple (voir nos [fichiers JS et CSS d'exemple](https://github.com/mdn/html-examples/tree/master/link-rel-preload/js-and-css) et le [résultat obtenu](https://mdn.github.io/html-examples/link-rel-preload/js-and-css/)) : ```html <head> @@ -42,34 +42,34 @@ Voici un exemple simple (voir nos [fichiers JS et CSS d'exemple](https://github. </body> ``` -Dans l'exemple ci-dessus, nous préchargeons nos fichiers CSS et JavaScript afin qu'ils puissent être disponibles dès qu'ils sont nécessaires pour le rendu de la page. Cet exemple est trivial, car le navigateur va probablement découvrir en même temps les balises de préchargement, le `<link rel="stylesheet">` et le `<script>`, mais le bénéfice sera bien plus visible si les ressources sont plus nombreuses, plus lourdes et chargées à différents endroits. Par exemple : +Dans l'exemple ci-dessus, nous préchargeons nos fichiers CSS et JavaScript afin qu'ils puissent être disponibles dès qu'ils sont nécessaires pour le rendu de la page. Cet exemple est trivial, car le navigateur va probablement découvrir en même temps les balises de préchargement, le `<link rel="stylesheet">` et le `<script>`, mais le bénéfice sera bien plus visible si les ressources sont plus nombreuses, plus lourdes et chargées à différents endroits. Par exemple : -- les ressources qui sont chargées depuis un fichier CSS, comme certaines polices et images ; -- les ressources inclues par des fichiers JavaScript, comme des fichiers JSON, d'autres scripts importés ou des services web ; +- les ressources qui sont chargées depuis un fichier CSS, comme certaines polices et images ; +- les ressources inclues par des fichiers JavaScript, comme des fichiers JSON, d'autres scripts importés ou des services web ; - les fichiers image et vidéos plus importants. -`preload` dispose aussi d'autres avantages. L'utilisation de l'attribut `as` pour spécifier le type de contenu à précharger permet au navigateur de : +`preload` dispose aussi d'autres avantages. L'utilisation de l'attribut `as` pour spécifier le type de contenu à précharger permet au navigateur de : -- prioriser les ressources se chargeant avec davantage de précision ; -- les stocker dans le cache pour de futures requêtes, ce qui permet de réutiliser les ressources si c'est pertinent ; -- appliquer la bonne [stratégie de sécurité du contenu](/fr/docs/Web/HTTP/CSP) aux ressources ; +- prioriser les ressources se chargeant avec davantage de précision ; +- les stocker dans le cache pour de futures requêtes, ce qui permet de réutiliser les ressources si c'est pertinent ; +- appliquer la bonne [stratégie de sécurité du contenu](/fr/docs/Web/HTTP/CSP) aux ressources ; - mettre en place les bons en-têtes de requêtes {{HTTPHeader("Accept")}} pour les ressources. -### Quels types de contenu peuvent être préchargés ? +### Quels types de contenu peuvent être préchargés ? -De nombreux différents types de contenu peuvent être préchargés. Les valeurs possibles de l'attribut `as` sont les suivantes : +De nombreux différents types de contenu peuvent être préchargés. Les valeurs possibles de l'attribut `as` sont les suivantes : -- `audio` : fichier audio, typiquement intégré avec l'élément {{htmlelement("audio")}} ; -- `document` : un document HTML destiné à être embarqué dans une {{htmlelement("frame")}} ou dans une {{htmlelement("iframe")}} ; -- `embed` : une ressource à embarquer dans un élément {{htmlelement("embed")}} ; -- `fetch` : une ressource accessible via une requête `fetch` ou `XHR`, comme un `ArrayBuffer` ou un fichier JSON ; -- `font` : un fichier de police ; -- `image` : un fichier image ; -- `object` : une ressource à embarquer à l'intérieur d'un élément {{htmlelement("object")}} ; -- `script` : un fichier JavaScript ; -- `style` : une feuille de styles CSS ; -- `track` : un fichier WebVTT ; -- `worker` : un +- `audio` : fichier audio, typiquement intégré avec l'élément {{htmlelement("audio")}} ; +- `document` : un document HTML destiné à être embarqué dans une {{htmlelement("frame")}} ou dans une {{htmlelement("iframe")}} ; +- `embed` : une ressource à embarquer dans un élément {{htmlelement("embed")}} ; +- `fetch` : une ressource accessible via une requête `fetch` ou `XHR`, comme un `ArrayBuffer` ou un fichier JSON ; +- `font` : un fichier de police ; +- `image` : un fichier image ; +- `object` : une ressource à embarquer à l'intérieur d'un élément {{htmlelement("object")}} ; +- `script` : un fichier JavaScript ; +- `style` : une feuille de styles CSS ; +- `track` : un fichier WebVTT ; +- `worker` : un <i lang="en">web worker</i> @@ -77,9 +77,9 @@ De nombreux différents types de contenu peuvent être préchargés. Les valeurs <i lang="en">worker</i> - partagé ; + partagé ; -- `video` : un fichier vidéo, typiquement intégré avec l'élément {{htmlelement("video")}}. +- `video` : un fichier vidéo, typiquement intégré avec l'élément {{htmlelement("video")}}. > **Note :** le préchargement de l'élément `video` est inclut dans la spécification <i lang="en">Preload</i> mais n'est pas encore implémenté par les navigateurs. @@ -89,7 +89,7 @@ De nombreux différents types de contenu peuvent être préchargés. Les valeurs Les éléments `<link>` peuvent accepter un attribut {{htmlattrxref("type", "link")}}, contenant le type MIME de la ressource vers laquelle pointe le document. Ceci est tout spécialement utile lorsque l'on effectue un préchargement des ressources – le navigateur utilisera alors l'attribut `type` pour vérifier s'il prend en charge la ressource et la télécharger si c'est le cas, ou l'ignorer dans le cas contraire. -Vous pouvez voir un exemple de ce fonctionnement dans notre vidéo d'exemple (voir le [code source complet](https://github.com/mdn/html-examples/tree/master/link-rel-preload/video) ou la [version exécutable en direct](https://mdn.github.io/html-examples/link-rel-preload/video/)), utilisant le bout de code proposé ci-dessous. À noter que si ce code ne lancera pas de préchargement effectif sur aucun navigateur – le préchargement des vidéos n'est encore implémenté sur aucun navigateur – cela permet d'illustrer le fonctionnement général du préchargement. +Vous pouvez voir un exemple de ce fonctionnement dans notre vidéo d'exemple (voir le [code source complet](https://github.com/mdn/html-examples/tree/master/link-rel-preload/video) ou la [version exécutable en direct](https://mdn.github.io/html-examples/link-rel-preload/video/)), utilisant le bout de code proposé ci-dessous. À noter que si ce code ne lancera pas de préchargement effectif sur aucun navigateur – le préchargement des vidéos n'est encore implémenté sur aucun navigateur – cela permet d'illustrer le fonctionnement général du préchargement. ```html <head> @@ -113,15 +113,15 @@ Concernant les personnes disposant d'un navigateur prenant en charge tout aussi En conclusion, il est déconseillé de précharger de multiple formats pour la même ressource. La bonne pratique est plutôt de précharger uniquement le type de média qu'utilise la majorité des personnes qui visitent votre site. C'est pourquoi le code fourni en exemple ne précharge pas la vidéo au format `video/webm`. -Cependant, l'absence de préchargement n'empêche pas la vidéo `video/webm` d'être utilisée par les personnes qui en ont besoin : pour les navigateurs qui ne prennent pas en charge le format `video/mp4` mais qui prennent en charge le format `video/webm` alors le code de l'exemple permettra toujours d'utiliser la vidéo au format `video/webm` — cela évitera simplement de précharger inutilement une ressource pour la plupart des navigateurs. +Cependant, l'absence de préchargement n'empêche pas la vidéo `video/webm` d'être utilisée par les personnes qui en ont besoin : pour les navigateurs qui ne prennent pas en charge le format `video/mp4` mais qui prennent en charge le format `video/webm` alors le code de l'exemple permettra toujours d'utiliser la vidéo au format `video/webm` — cela évitera simplement de précharger inutilement une ressource pour la plupart des navigateurs. ## Récupération de l'activation du <i lang="en">CORS</i> -Lors du préchargement des ressources analysées par des fonctions activant le [CORS](/fr/docs/Web/HTTP/CORS) (partage des ressources entre origines multiples), comme par exemple [`fetch()`](/fr/docs/Web/API/WindowOrWorkerGlobalScope/fetch), [`XMLHttpRequest`](/fr/docs/Web/API/XMLHttpRequest) ou [fonts](/fr/docs/Web/CSS/@font-face)), une attention particulière doit être portée à la mise en place de l'attribut {{htmlattrxref("crossorigin","link")}} sur l'élément [`<link>`](/fr/docs/Web/HTML/Element/link). L'attribut à besoin d'être mis en place pour faire correspondre le <i lang="en">CORS</i> de la ressource et le mode d'identification, même s'il ne s'agit pas d'une ressource ayant une origine différente de celle de la page. +Lors du préchargement des ressources analysées par des fonctions activant le [CORS](/fr/docs/Web/HTTP/CORS) (partage des ressources entre origines multiples), comme par exemple [`fetch()`](/fr/docs/Web/API/WindowOrWorkerGlobalScope/fetch), [`XMLHttpRequest`](/fr/docs/Web/API/XMLHttpRequest) ou [fonts](/fr/docs/Web/CSS/@font-face)), une attention particulière doit être portée à la mise en place de l'attribut {{htmlattrxref("crossorigin","link")}} sur l'élément [`<link>`](/fr/docs/Web/HTML/Element/link). L'attribut à besoin d'être mis en place pour faire correspondre le <i lang="en">CORS</i> de la ressource et le mode d'identification, même s'il ne s'agit pas d'une ressource ayant une origine différente de celle de la page. -Comme mentionné ci-dessus, un cas de figure intéressant est celui qui s'applique aux fichiers de polices. Pour plusieurs raisons, celles-ci doivent être analysées en utilisant le mode anonyme du <i lang="en">CORS</i> (voir cet article en anglais : [<i lang="en">Font fetching requirements</i>](https://drafts.csswg.org/css-fonts/#font-fetching-requirements)). +Comme mentionné ci-dessus, un cas de figure intéressant est celui qui s'applique aux fichiers de polices. Pour plusieurs raisons, celles-ci doivent être analysées en utilisant le mode anonyme du <i lang="en">CORS</i> (voir cet article en anglais : [<i lang="en">Font fetching requirements</i>](https://drafts.csswg.org/css-fonts/#font-fetching-requirements)). -Voici un cas d'utilisation. Vous trouverez [le code source complet sur GitHub](https://github.com/mdn/html-examples/tree/master/link-rel-preload/fonts) ainsi qu'une [démonstration](https://mdn.github.io/html-examples/link-rel-preload/fonts/) : +Voici un cas d'utilisation. Vous trouverez [le code source complet sur GitHub](https://github.com/mdn/html-examples/tree/master/link-rel-preload/fonts) ainsi qu'une [démonstration](https://mdn.github.io/html-examples/link-rel-preload/fonts/) : ```html <head> @@ -142,9 +142,9 @@ En plus de fournir un type MIME avec l'attribut `type`, ce code utilise un attri ## Inclure des médias -Une autre belle fonctionnalité de l'élément `<link>` concerne leur capacité à accepter les attributs {{htmlattrxref("media", "link")}}. Il peut accepter les requêtes de [types de médias](/fr/docs/Web/CSS/@media#media_types) ou encore des [<i lang="en">media queries</i>](/fr/docs/Web/CSS/Media_Queries/Using_media_queries) complètes, ce qui vous permet de faire du préchargement <i lang="en">responsive</i> ! +Une autre belle fonctionnalité de l'élément `<link>` concerne leur capacité à accepter les attributs {{htmlattrxref("media", "link")}}. Il peut accepter les requêtes de [types de médias](/fr/docs/Web/CSS/@media#media_types) ou encore des [<i lang="en">media queries</i>](/fr/docs/Web/CSS/Media_Queries/Using_media_queries) complètes, ce qui vous permet de faire du préchargement <i lang="en">responsive</i> ! -Voici un exemple. Vous pouvez consulter son [code source sur GitHub](https://github.com/mdn/html-examples/tree/master/link-rel-preload/media) ou étudier un [exemple de démonstration](https://mdn.github.io/html-examples/link-rel-preload/media/) : +Voici un exemple. Vous pouvez consulter son [code source sur GitHub](https://github.com/mdn/html-examples/tree/master/link-rel-preload/media) ou étudier un [exemple de démonstration](https://mdn.github.io/html-examples/link-rel-preload/media/) : ```html <head> @@ -176,13 +176,13 @@ Voici un exemple. Vous pouvez consulter son [code source sur GitHub](https://git Dans cet exemple nous incluons les attributs `media` dans notre élément `<link>` pour qu'une image plus fine soit préchargée si la personne visitant le site dispose d'un écran plus petit, et pour qu'une image plus large soit chargée sur les écrans plus larges. Pour cela, nous utilisons {{domxref("Window.matchMedia")}} et {{domxref("MediaQueryList")}} (consultez la page [Tester les requêtes média en JavaScript](/fr/docs/Web/CSS/Media_Queries/Testing_media_queries) pour en savoir plus). -Cela augmente les chances que la police sera disponible lors du rendu de la page, et diminue les risques de <i lang="en">FOUT</i> (pour <i lang="en">flash of unstyled text</i>, soit « flash de texte sans mis en forme » en français). +Cela augmente les chances que la police sera disponible lors du rendu de la page, et diminue les risques de <i lang="en">FOUT</i> (pour <i lang="en">flash of unstyled text</i>, soit « flash de texte sans mis en forme » en français). -Il sera dommage de limiter le préchargement aux images, voyez plus loin ! On pourrait imaginer de précharger l'affichage d'un diagramme SVG si le visiteur se trouve sur un petit écran avec une bande passante ou une disponibilité CPU plus limitée, ou encore de précharger des morceaux de JavaScript complexes utilisés pour faire fonctionner une modélisation 3D interactive uniquement si les ressources du visiteur sont suffisantes. +Il sera dommage de limiter le préchargement aux images, voyez plus loin ! On pourrait imaginer de précharger l'affichage d'un diagramme SVG si le visiteur se trouve sur un petit écran avec une bande passante ou une disponibilité CPU plus limitée, ou encore de précharger des morceaux de JavaScript complexes utilisés pour faire fonctionner une modélisation 3D interactive uniquement si les ressources du visiteur sont suffisantes. ## Scripts et préchargement -Une autre fonctionnalité notable est la possibilité d'exécuter le préchargement à l'aide d'un script. Par exemple, voici la création d'une instance {{domxref("HTMLLinkElement")}} qui est ensuite attachée au <i lang="en">DOM</i> : +Une autre fonctionnalité notable est la possibilité d'exécuter le préchargement à l'aide d'un script. Par exemple, voici la création d'une instance {{domxref("HTMLLinkElement")}} qui est ensuite attachée au <i lang="en">DOM</i> : ```js var preloadLink = document.createElement("link"); @@ -192,7 +192,7 @@ preloadLink.as = "script"; document.head.appendChild(preloadLink); ``` -Cela signifie que le navigateur va précharger le fichier `myscript.js`, mais ne va pas réellement l'utiliser directement. Pour l'utiliser, vous pouvez faire ceci : +Cela signifie que le navigateur va précharger le fichier `myscript.js`, mais ne va pas réellement l'utiliser directement. Pour l'utiliser, vous pouvez faire ceci : ```js var preloadedScript = document.createElement("script"); @@ -204,11 +204,11 @@ C'est utile lorsque vous voulez précharger un script mais repousser son exécut ## Autres ressources concernant les mécanismes de préchargement -D'autres fonctionnalités de préchargement sont disponibles, mais sachez qu'aucune d'entre elle n'est aussi adaptée à l'objectif recherché que `<link rel="preload">`. En voici la liste : +D'autres fonctionnalités de préchargement sont disponibles, mais sachez qu'aucune d'entre elle n'est aussi adaptée à l'objectif recherché que `<link rel="preload">`. En voici la liste : -- `<link rel="prefetch">` est pris en charge depuis quelque temps par les navigateurs, mais est destinée à la récupération préalable des ressources qui vont être utilisées lors de la **_prochaine_** page visitée/chargée (par exemple lorsque vous vous rendrez sur une autre page du site). C'est une bonne chose, mais ce n'est pas utile pour la page en cours de chargement ! Par ailleurs, les navigateurs donnent une priorité plus faible à `prefetch` qu'à `preload` — la page courante est prioritaire par rapport à la page suivante. Consultez la [FAQ sur le préchargement des liens](/fr/docs/Web/HTTP/Link_prefetching_FAQ) pour plus de détails ; -- `<link rel="prerender">` effectue le rendu une page spécifiée en arrière-plan, ce qui permet d'accélerer son chargement si la personne visitant le site se rend sur cette page par la suite. Du fait du gaspillage potentiel de bande passante pour les visiteurs (on charge des éléments sans savoir si on en aura besoin), Chrome traite l'instruction `prerender` comme une instruction [NoState prefetch](https://developers.google.com/web/updates/2018/07/nostate-prefetch) ; -- `<link rel="subresource">` {{non-standard_inline}} était pris en charge par Chrome il y a quelques temps et était destiné à gérer la même chose que `preload`, mais il y avait un problème : il n'y avait aucun moyen de définir une priorité sur les éléments à charger (`as` n'existait pas encore), donc toutes les ressources étaient chargées avec la même priorité (la plus faible) ; +- `<link rel="prefetch">` est pris en charge depuis quelque temps par les navigateurs, mais est destinée à la récupération préalable des ressources qui vont être utilisées lors de la **_prochaine_** page visitée/chargée (par exemple lorsque vous vous rendrez sur une autre page du site). C'est une bonne chose, mais ce n'est pas utile pour la page en cours de chargement ! Par ailleurs, les navigateurs donnent une priorité plus faible à `prefetch` qu'à `preload` — la page courante est prioritaire par rapport à la page suivante. Consultez la [FAQ sur le préchargement des liens](/fr/docs/Web/HTTP/Link_prefetching_FAQ) pour plus de détails ; +- `<link rel="prerender">` effectue le rendu une page spécifiée en arrière-plan, ce qui permet d'accélerer son chargement si la personne visitant le site se rend sur cette page par la suite. Du fait du gaspillage potentiel de bande passante pour les visiteurs (on charge des éléments sans savoir si on en aura besoin), Chrome traite l'instruction `prerender` comme une instruction [NoState prefetch](https://developers.google.com/web/updates/2018/07/nostate-prefetch) ; +- `<link rel="subresource">` {{non-standard_inline}} était pris en charge par Chrome il y a quelques temps et était destiné à gérer la même chose que `preload`, mais il y avait un problème : il n'y avait aucun moyen de définir une priorité sur les éléments à charger (`as` n'existait pas encore), donc toutes les ressources étaient chargées avec la même priorité (la plus faible) ; - Il y a un grand nombre de scripts de chargements de ressources disponibles un peu partout, mais aucun ne peut avoir la puissance d'une file de priorisation gérée directement par le navigateur. De plus, ces scripts sont sujets à des problèmes de performances similaires. ## Spécifications diff --git a/files/fr/web/html/viewport_meta_tag/index.md b/files/fr/web/html/viewport_meta_tag/index.md index db05d1c670..2462aa764c 100644 --- a/files/fr/web/html/viewport_meta_tag/index.md +++ b/files/fr/web/html/viewport_meta_tag/index.md @@ -22,7 +22,7 @@ En effet, de nombreuses pages ne sont pas optimisées pour les mobiles et ne fon Cependant, ce mécanisme n'est pas aussi bon pour les pages qui sont optimisées pour les écrans étroits à l'aide de [_media queries_](/fr/docs/Web/CSS/Media_Queries) - si le viewport virtuel est de 980px par exemple, les media queries qui se déclenchent à 640px, 480px ou moins ne seront jamais utilisées, ce qui limite l'efficacité de ces techniques de _responsive design_. -Pour atténuer ce problème de fenêtre virtuelle sur les appareils à écran étroit, Apple a introduit la « métabalise viewport » dans Safari iOS pour permettre à une page web de contrôler la taille et l'échelle de la fenêtre. De nombreux autres navigateurs mobiles prennent désormais en charge cette balise, bien qu'elle ne fasse partie d'aucune norme web. La [documentation](https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html) (en) d'Apple explique bien comment utiliser cette balise, mais nous avons dû faire un travail de détective pour savoir exactement comment l'implémenter dans Fennec. Par exemple, la documentation de Safari indique que le contenu est une « liste délimitée par des virgules », mais les navigateurs et pages web existants utilisent n'importe quel mélange de virgules, points-virgules et espaces comme séparateurs. +Pour atténuer ce problème de fenêtre virtuelle sur les appareils à écran étroit, Apple a introduit la « métabalise viewport » dans Safari iOS pour permettre à une page web de contrôler la taille et l'échelle de la fenêtre. De nombreux autres navigateurs mobiles prennent désormais en charge cette balise, bien qu'elle ne fasse partie d'aucune norme web. La [documentation](https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html) (en) d'Apple explique bien comment utiliser cette balise, mais nous avons dû faire un travail de détective pour savoir exactement comment l'implémenter dans Fennec. Par exemple, la documentation de Safari indique que le contenu est une « liste délimitée par des virgules », mais les navigateurs et pages web existants utilisent n'importe quel mélange de virgules, points-virgules et espaces comme séparateurs. Pour en savoir plus sur les fenêtres d'affichage dans les différents navigateurs mobiles, consultez [A Tale of Two Viewports](http://www.quirksmode.org/mobile/viewports2.html) sur quirksmode.org. @@ -64,7 +64,7 @@ Pour les pages qui définissent une échelle initiale ou maximale, cela signifie Les autres [attributs](/fr/docs/Web/HTML/Element/meta#attributes) disponibles sont `minimum-scale`, `maximum-scale` et `user-scalable`. Ces propriétés affectent l'échelle et la largeur initiales, ainsi que la limitation des changements de niveau de zoom. -Tous les navigateurs mobiles ne gèrent pas les changements d'orientation de la même manière. Par exemple, Mobile Safari se contente souvent de zoomer la page lors du passage du portrait au paysage, au lieu de la disposer comme elle le ferait si elle était initialement chargée en paysage. Si les développeurs et développeuses Web veulent que leurs paramètres d'échelle restent cohérents lors du changement d'orientation sur l'iPhone, ils/elles doivent ajouter une valeur `maximum-scale` pour empêcher ce zoom, ce qui a l'effet secondaire parfois indésirable d'empêcher les utilisateurs/utilisatrices de faire un zoom avant : +Tous les navigateurs mobiles ne gèrent pas les changements d'orientation de la même manière. Par exemple, Mobile Safari se contente souvent de zoomer la page lors du passage du portrait au paysage, au lieu de la disposer comme elle le ferait si elle était initialement chargée en paysage. Si les développeurs et développeuses Web veulent que leurs paramètres d'échelle restent cohérents lors du changement d'orientation sur l'iPhone, ils/elles doivent ajouter une valeur `maximum-scale` pour empêcher ce zoom, ce qui a l'effet secondaire parfois indésirable d'empêcher les utilisateurs/utilisatrices de faire un zoom avant : ```html <meta name="viewport" content="initial-scale=1, maximum-scale=1"> |