From a47584de1bd47788cb5aa6178fa88b31977b2a8e Mon Sep 17 00:00:00 2001 From: tristantheb Date: Sat, 19 Jun 2021 10:25:05 +0200 Subject: UPDATE: Update translation of the HTML elements — 🛠 Priority work area (#500) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * UPDATE: Updating pages starting with A * FIX: Update missing KS to html anchor * Review HTML Element a * Review HTML Element abbr * Review HTML Element acronym * Review HTML Element address * Review HTML Element applet * Review HTML Element area * Review HTML Element article * Review HTML Element aside * Review HTML Element audio * UPDATE: Updating pages wtarting with B * Review HTML Element b * Review HTML Element base * Review HTML Element basefont * Review HTML Element bdi * Review HTML Element bdo * Review HTML Element big * Review HTML Element blink * Review HTML Element blockquote * Review HTML Element body * Review HTML Element br * Review HTML Element button * Review HTML Element button - rm HTMLRef * Review HTML Element button - lint link * UPDATE: Updating pages starting with C * UPDATE: Updating pages starting with D * UPDATE: Refresh the reference page * UPDATE: Updating pages starting with E * Review HTML Element canvas * Review HTML Element caption * Review HTML Element center * Review HTML Element cite * UPDATE: Updating pages starting with F * BCD: Update all updated pages with new BCD format * FIX: add missing bracket * Review - HTML element - code * Review - HTML Element - col * Review - HTML Element - colgroup * Review - HTML Element - content * Review - HTML Element - data * Review - HTML Element - datalist * Review - HTML Element - dd * Review - HTML Element - del * Review - HTML Element * Review - HTML Element - dfn * Review - HTML Element - dialog * Review - HTML element - dir * Review - HTML Element div * Review - HTML Element - dl * Review - HTML Element - dt * Review - HTML Element - em * Review - HTML Element - embed * Review - HTML Element - fieldset * Review - HTML Element - figcaption * Review - HTML Element - figure * Review - HTML Element - font * Review - HTML Element - footer * Review - HTML Element - form * Review - HTML Element - frame * Review - HTML Element - frameset * Review updates since PR start - A * Review updates since PR start - B * Review updates since PR start - C * Review updates since PR start - D * Review updates since PR start - F Co-authored-by: julieng --- files/fr/web/html/element/abbr/index.html | 240 ++++++++++++++---------------- 1 file changed, 109 insertions(+), 131 deletions(-) (limited to 'files/fr/web/html/element/abbr') diff --git a/files/fr/web/html/element/abbr/index.html b/files/fr/web/html/element/abbr/index.html index 920bcc3a7e..f92760de19 100644 --- a/files/fr/web/html/element/abbr/index.html +++ b/files/fr/web/html/element/abbr/index.html @@ -1,203 +1,181 @@ --- -title: +title: " : l'élément d'abréviation" slug: Web/HTML/Element/abbr tags: + - Acronym + - Definitions - Element - HTML + - HTML text-level semantics + - HTML:Flow content + - HTML:Palpable Content + - HTML:Phrasing content - Reference - Web + - abbr + - abbreviation + - semantics translation_of: Web/HTML/Element/abbr +browser-compat: html.elements.abbr ---
{{HTMLRef}}
-

L'élément <abbr> représente une abréviation ou un acronyme et permet, de façon optionnelle, d'en fournir une description complète. S'il est présent, l'attribut {{htmlattrxref("title")}} doit contenir cette même description complète et rien d'autre.

+

L'élément HTML <abbr> (abréviation en français) représente une abréviation ou un acronyme ; l'attribut facultatif title peut fournir une explication ou une description de l'abréviation. S'il est présent, title doit contenir cette description complète et rien d'autre.

{{EmbedInteractiveExample("pages/tabbed/abbr.html", "tabbed-shorter")}}
- - -
-

Note : Voir cet article introductif pour la mise en forme du texte en général.

-
- -

Attributs

- -

Cet élément n'a pas d'autres attributs que les attributs universels.

- -

On notera que l'attribut {{htmlattrdef("title")}} possède ici une sémantique spécifique et il représente la description complète de l'abréviation. Souvent, mais pas nécessairement, il s'affiche comme une info-bulle au survol de la souris.

- -

Chaque élément <abbr> est indépendant, rattacher un titre à l'un ne l'associe pas aux abrévations identiques qui suivent.

- -

Notes d'utilisation

- -

Cas d'usage généraux

- -

Il n'est pas obligatoire d'utiliser <abbr> pour toutes les abrévations d'un document mais voici quelques cas où cet élément s'avère pertinent :

+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
Catégories de contenuContenu de flux, contenu phrasé, contenu tangible.
Contenu autoriséContenu phrasé.
Omission de balisesAucune, la balise d'ouverture et la balise de fermeture sont obligatoires.
Parents autorisésTout élément acceptant du contenu phrasé.
Rôles ARIA autorisésTous les rôles sont autorisés.
Interface DOMHTMLElement
+ +

Attributs

+ +

Cet élément n'a pas d'autres attributs que les attributs universels.

+ +

On notera que l'attribut title possède ici une sémantique spécifique et il représente la description complète de l'abréviation. Souvent, mais pas nécessairement, il s'affiche comme une info-bulle au survol de la souris.

+ +

Chaque élément <abbr> est indépendant, rattacher un titre à l'un ne l'associe pas aux abréviations identiques qui suivent.

+ +

Notes d'utilisation

+ +

Cas d'usage généraux

+ +

Il n'est pas obligatoire d'utiliser <abbr> pour toutes les abréviations d'un document mais voici quelques cas où cet élément s'avère pertinent :

    -
  • Lorsqu'une abrĂ©vation est utilisĂ©e et qu'on souhaite fournir une dĂ©finition ou une explication en dehors du contenu du document, on utilisera <abbr> avec un attribut {{htmlattrxref("title")}} adĂ©quat.
    • -
  • Lorsqu'une abrĂ©vation fait partie d'un jargon ou d'un vocabulaire qui risque d'ĂŞtre inconnu du lecteur, un Ă©lĂ©ment <abbr> avec un attribut title explicatif pourra ĂŞtre utilisĂ©.
    • -
  • Lorsqu'on souhaite bĂ©nĂ©ficier de la sĂ©mantique liĂ©e Ă  l'abrĂ©vation (par exemple pour les manipuler en script ou les mettre en forme avec des feuilles de style), on pourra utiliser <abbr> pour identifier ces contenus.
    • -
  • Lorsqu'on souhaite dĂ©finir des termes qui sont des abrĂ©vations, on pourra utiliser une combinaison de <abbr> et de {{HTMLElement("dfn")}}. Voir ci-après pour un exemple.
    • +
  • Lorsqu'une abrĂ©viation est utilisĂ©e et qu'on souhaite fournir une dĂ©finition ou une explication en dehors du contenu du document, on utilisera <abbr> avec un attribut title adĂ©quat.
    • +
  • Lorsqu'une abrĂ©viation fait partie d'un jargon ou d'un vocabulaire qui risque d'ĂŞtre inconnu du lecteur, un Ă©lĂ©ment <abbr> avec un attribut title explicatif pourra ĂŞtre utilisĂ©.
    • +
  • Lorsqu'on souhaite bĂ©nĂ©ficier de la sĂ©mantique liĂ©e Ă  l'abrĂ©viation (par exemple pour les manipuler en script ou les mettre en forme avec des feuilles de style), on pourra utiliser <abbr> pour identifier ces contenus.
    • +
  • Lorsqu'on souhaite dĂ©finir des termes qui sont des abrĂ©viations, on pourra utiliser une combinaison de <abbr> et de <dfn>. Voir ci-après pour un exemple.
-

Grammaire

+

Grammaire

-

Lorsqu'il est présent, le nombre (grammatical) du texte de l'attribut title devrait correspondre à celui du contenu de l'élément abbr. C'est également le cas dans les langues avec plus de deux genres grammaticaux (par exemple, l'Arabe, en plus des catégories pour le singulier et le pluriel, possède également une catégorie double).

+

Lorsqu'il est présent, le nombre (grammatical) du texte de l'attribut title devrait correspondre à celui du contenu de l'élément abbr. C'est également le cas dans les langues avec plus de deux genres grammaticaux (par exemple, l'arabe, en plus des catégories pour le singulier et le pluriel, possède également une catégorie double).

-

Mise en forme par défaut

+

Mise en forme par défaut

-

Le but de cet élément est purement explicatif. Tous les navigateurs l'affichent en ligne ({{cssxref('display')}}: inline) par défaut mais le reste de la mise en forme par défaut peut varier d'un navigateur à l'autre :

+

Le but de cet élément est purement explicatif. Tous les navigateurs l'affichent en ligne (display: inline) par défaut mais le reste de la mise en forme par défaut peut varier d'un navigateur à l'autre :

    -
  • Certains navigateurs tels qu'Internet Explore lui appliquent la mĂŞme mise en forme qu'Ă  un Ă©lĂ©ment {{HTMLElement("span")}}.
    • -
  • Opera, Firefox et d'autres navigateurs souligne l'abrĂ©viation avec une ligne de points.
    • -
  • D'autres navigateurs ne soulignent pas le texte mais l'Ă©crivent en petites majuscules. Pour Ă©viter ce comportement, on pourra utiliser la règle CSS {{cssxref("font-variant")}}: none.
    • +
  • Certains navigateurs tels qu'Internet Explore lui appliquent la mĂŞme mise en forme qu'Ă  un Ă©lĂ©ment <span>.
    • +
  • Opera, Firefox et d'autres navigateurs souligne l'abrĂ©viation avec une ligne de points.
    • +
  • D'autres navigateurs ne soulignent pas le texte mais l'Ă©crivent en petites majuscules. Pour Ă©viter ce comportement, on pourra utiliser la règle CSS font-variant: none.
-

Exemples

+

Exemples

-

Baliser une abrévation pour marquer la sémantique

+

Baliser une abréviation pour marquer la sémantique

-

On peut baliser une abrévation sans fournir de description ou de définition, il suffit d'utiliser <abbr> sans attribut.

+

On peut baliser une abréviation sans fournir de description ou de définition, il suffit d'utiliser <abbr> sans attribut.

-

HTML

+

HTML

-
<p>Nous allons voir le <abbr>HTML</abbr> qui sert Ă  construire des pages web.</p>
+
<p>
+  Nous allons voir le <abbr>HTML</abbr> qui sert Ă  construire
+  des pages web.
+</p>
-

RĂ©sultat

+

RĂ©sultat

-

{{EmbedLiveSample("Baliser_une_abréviation_pour_marquer_la_sémantique")}}

+

{{EmbedLiveSample("marking_up_an_abbreviation_semantically", "100%", 80)}}

-

Mettre en forme des abréviations

+

Mettre en forme des abréviations

CSS peut être utilisé pour appliquer une mise en forme particulière sur les abréviations.

-

HTML

+

HTML

<p>Avec <abbr>CSS</abbr>, on peut mettre en forme les éléments.</p>
-

CSS

+

CSS

abbr {
   font-variant: all-small-caps;
 }
-

RĂ©sultat

+

RĂ©sultat

-

{{EmbedLiveSample("Mettre_en_forme_des_abréviations")}}

+

{{EmbedLiveSample("styling_abbreviations", "100%", 80)}}

-

Fournir une description

+

Fournir une description

-

On peut ajouter un attribut {{htmlattrxref("title")}} afin de fournir une description de l'abréviation ou de l'acronyme.

+

On peut ajouter un attribut title afin de fournir une description de l'abréviation ou de l'acronyme.

-

HTML

+

HTML

<p>Et là je lui ai répondu <abbr title="Laugh Out Loud">LOL</abbr>.</p>
-

RĂ©sultat

+

RĂ©sultat

-

{{EmbedLiveSample("Fournir_une_description")}}

+

{{EmbedLiveSample("providing_an_expansion", "100%", 80)}}

-

Définir une abréviation

+

Définir une abréviation

-

Il est possible d'utiliser l'élément <abbr> avec {{HTMLElement("dfn")}} afin de formellement définir une abréviation.

+

Il est possible d'utiliser l'élément <abbr> avec <dfn> afin de formellement définir une abréviation.

-

HTML

+

HTML

<p><dfn id="html"><abbr title="HyperText Markup Language">HTML</abbr>
-</dfn> est un langage de balise qui permet de créer la structure et d'organiser
-la sémantique d'une page web.</p>
+</dfn> est un langage de balise qui permet de créer la structure
+et d'organiser la sémantique d'une page web.</p>
 
-<p>Une <dfn id="spec">Spécification</dfn>
-(<abbr title="Specification">spec</abbr>) est un document qui décrit, de façon
-détaillée comme une technologie ou une API fonctionne et comment l'utiliser.</p>
+<p>Une <dfn id="spec">spécification</dfn> +(<abbr title="spécification">spec</abbr>) est un document qui décrit, +de façon détaillée comme une technologie ou une API fonctionne et comment +l'utiliser.</p> -

RĂ©sultat

+

RĂ©sultat

-

{{EmbedLiveSample("Définir_une_abréviation", 600, 120)}}

+

{{EmbedLiveSample("defining_an_abbreviation", "100%", 160)}}

-

Accessibilité

+

Accessibilité

C'est une bonne pratique que d'épeler l'acronyme ou l'abréviation lorsqu'elle est utilisée pour la première fois. Cela permet au lecteur de mieux comprendre le terme, notamment si celui-ci est technique ou appartient à un jargon spécifique.

-

Exemple

+

Exemple

-
<p>JavaScript Object Notation (<abbr>JSON</abbr>) est un format léger d'échange de données.</p>
+
<p>JavaScript Object Notation (<abbr>JSON</abbr>) est un format léger
+  d'échange de données.</p>
 

 
 
Cela peut servir aux personnes qui découvrent ces concepts pour la première fois ou pour les personnes souffrant de troubles cognitifs.

 
-
Résumé technique

+
Spécifications

 
-
- 
-  
-   
-   
-  
-  
-   
-   
-  
-  
-   
-   
-  
-  
-   
-   
-  
-  
-   
-   
-  
-  
-   
-   
-  
- 
-
Catégories de contenuContenu de flux, contenu phrasé, contenu tangible.
Contenu autoriséContenu phrasé.
Omission de balises{{no_tag_omission}}
Parents autorisésTout élément acceptant du contenu phrasé.
Rôles ARIA autorisésTous les rôles sont autorisés.
Interface DOM{{domxref("HTMLElement")}}

-
-
Specifications

-
-
- 
-  
-   
-   
-   
-  
- 
- 
-  
-   
-   
-   
-  
-  
-   
-   
-   
-  
-  
-   
-   
-   
-  
- 
-
SpecificationStatusComment
{{SpecName('HTML WHATWG', 'semantics.html#the-abbr-element', '<abbr>')}}{{Spec2('HTML WHATWG')}} 
{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-abbr-element', '<abbr>')}}{{Spec2('HTML5 W3C')}} 
{{SpecName('HTML4.01', 'struct/text.html#edef-ABBR', '<abbr>')}}{{Spec2('HTML4.01')}} 

-
-
Compatibilité des navigateurs

-
-
-
-
{{Compat("html.elements.abbr")}}

-
-
Voir aussi

+
{{Specifications}}

+
+
Compatibilité des navigateurs

+
+
{{Compat}}

+
+
Voir aussi

 
 
    
- 
  • Utiliser l'Ă©lĂ©ment <abbr>
    • 
- 
  • Les autres Ă©lĂ©ments ayant une sĂ©mantique textuelle : {{HTMLElement("a")}}, {{HTMLElement("em")}}, {{HTMLElement("strong")}}, {{HTMLElement("small")}}, {{HTMLElement("cite")}}, {{HTMLElement("q")}}, {{HTMLElement("dfn")}}, {{HTMLElement("time")}}, {{HTMLElement("code")}}, {{HTMLElement("var")}}, {{HTMLElement("samp")}}, {{HTMLElement("kbd")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{HTMLElement("b")}}, {{HTMLElement("i")}}, {{HTMLElement("mark")}}, {{HTMLElement("ruby")}}, {{HTMLElement("rp")}}, {{HTMLElement("rt")}}, {{HTMLElement("bdo")}}, {{HTMLElement("span")}}, {{HTMLElement("br")}}, {{HTMLElement("wbr")}}.
    • 
- 
  • L'Ă©lĂ©ment obsolète {{HTMLElement("acronym")}} dont la sĂ©mantique a Ă©tĂ© « fusionnĂ©e » dans <abbr>
    • 
+  
  • Utiliser l'Ă©lĂ©ment <abbr>
    • 
 

-- 
cgit v1.2.3-54-g00ecf