aboutsummaryrefslogtreecommitdiff
path: root/files/fr/web/guide/html/html5
diff options
context:
space:
mode:
authorFlorian Merz <me@fiji-flo.de>2021-02-11 12:36:08 +0100
committerFlorian Merz <me@fiji-flo.de>2021-02-11 12:36:08 +0100
commit39f2114f9797eb51994966c6bb8ff1814c9a4da8 (patch)
tree66dbd9c921f56e440f8816ed29ac23682a1ac4ef /files/fr/web/guide/html/html5
parent8260a606c143e6b55a467edf017a56bdcd6cba7e (diff)
downloadtranslated-content-39f2114f9797eb51994966c6bb8ff1814c9a4da8.tar.gz
translated-content-39f2114f9797eb51994966c6bb8ff1814c9a4da8.tar.bz2
translated-content-39f2114f9797eb51994966c6bb8ff1814c9a4da8.zip
unslug fr: move
Diffstat (limited to 'files/fr/web/guide/html/html5')
-rw-r--r--files/fr/web/guide/html/html5/introduction_to_html5/index.html40
-rw-r--r--files/fr/web/guide/html/html5/liste_des_éléments_html5/index.html580
2 files changed, 40 insertions, 580 deletions
diff --git a/files/fr/web/guide/html/html5/introduction_to_html5/index.html b/files/fr/web/guide/html/html5/introduction_to_html5/index.html
new file mode 100644
index 0000000000..51eaf4850e
--- /dev/null
+++ b/files/fr/web/guide/html/html5/introduction_to_html5/index.html
@@ -0,0 +1,40 @@
+---
+title: Introduction à HTML5
+slug: Web/HTML/Introduction_to_HTML5
+tags:
+ - HTML
+ - HTML5
+translation_of: Web/Guide/HTML/HTML5/Introduction_to_HTML5
+---
+<p><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/" title="http://www.whatwg.org/specs/web-apps/current-work/">HTML5</a> est la nouvelle version du standard HTML. Il apporte non seulement l'utilisation de média riches (vidéo, audio, SVG, etc.) mais aussi des fonctionnalités permettant le développement d'applications web bien plus attractives et interactives.</p>
+
+<p>Étant donné que HTML5 est encore en cours d'évolution, certains navigateurs ne supportent pas encore toutes les fonctionnalités offertes par ce nouveau standard. Ceci dit Gecko (et donc Firefox) supporte déjà dans sa version 1.8.1 une majorité des possibilités de HTML5. Vous trouverez ce que Gecko supporte déjà en visitant cette page : <a href="/fr/HTML/HTML5" title="fr/HTML/HTML5">HTML5</a>. Pour obtenir davantage d'informations sur le support de HTML5 par de multiples navigateurs, jetez un coup d'œil sur le site<a class="external" href="http://caniuse.com/#cats=HTML5" title="http://caniuse.com/#cats=HTML5"> CanIUse</a> .</p>
+
+<h2 id="Indiquer_que_le_document_contient_du_HTML5_grâce_au_doctype_HTML5">Indiquer que le document contient du HTML5 grâce au doctype HTML5</h2>
+
+<p>La doctype HTML5 est très simple, il s'agit simplement de ceci :</p>
+
+<pre class="brush: html">&lt;!DOCTYPE html&gt;
+</pre>
+
+<p>Cela permet au navigateur ne supportant pas encore le HTML5 de passer en mode standard et ainsi d'ignorer les balises inconnues.</p>
+
+<p>Il est beaucoup plus simple que les précédents doctypes, et plus court. Il est ainsi plus facile à retenir et réduit le nombre d'octets devant être téléchargés.</p>
+
+<h2 id="Déclarer_l'encodage_de_caractères_avec_&lt;meta_charset>">Déclarer l'encodage de caractères avec <code>&lt;meta charset&gt;</code></h2>
+
+<p>La première chose que l'on fait d'habitude sur une page web c'est déclarer l'encodage de caractère utilisé. Dans les versions précédentes de HTML, ceci était fait en utilisant le très complexe élément {{HTMLElement("meta")}}. Avec HTML5, c'est beaucoup plus simple :</p>
+
+<pre class="brush:html;">&lt;meta charset="UTF-8"&gt;</pre>
+
+<p>Placez ceci au tout début de votre élément {{HTMLElement("head") }}, car certains navigateurs recommencent leur interprétation des documents HTML, si l'encodage de caractère déclaré est différent de ce qu'ils avaient anticipé. De plus, il est recommandé d'utiliser UTF-8, car il simplifie la gestion des caractères dans les documents utilisant plusieurs graphies.</p>
+
+<p>Notez que HTML5 limite les encodages autorisés à ceux qui sont compatibles avec ASCII et utilisant au moins 8 bits. Ceci pour améliorer la sécurité et éviter certains types d'attaques.</p>
+
+<h2 id="Utiliser_le_nouveau_parser_HTML5">Utiliser le nouveau parser HTML5</h2>
+
+<p>Les nouvelles règles d'analyse du HTML5, celles qui s'occupent de la sémantique du code, ont été renforcées. Jusqu'à l'arrivée du HTML5, seules les règles pour un code valide avaient été définies. À la moindre erreur dans le code (la plupart des sites Web en comportent au moins une), le comportement à adopter était laissé à la libre interprétation des navigateurs, qui ne choisissaient pas toujours le même. Maintenant, lorsque des erreurs sont rencontrées dans le code, tous les navigateurs implémentant HTML5 doivent se comporter de la même façon.</p>
+
+<p>Cette obligation aide les développeurs Web. Bien que tous les nouveaux navigateurs utilisent maintenant les règles d'analyse d'HTML5, des navigateurs ne respectant pas HTML5 sont encore utilisés. Il est toujours fortement recommandé d'écrire un code valide, car il est plus facile à lire et à maintenir, et diminue les risques d'incompatibilité avec les vieux navigateurs.</p>
+
+<p>Ne vous inquiétez pas, vous n'avez rien à changer sur votre site Web, les développeurs des navigateurs ont déjà fait le nécessaire !</p>
diff --git a/files/fr/web/guide/html/html5/liste_des_éléments_html5/index.html b/files/fr/web/guide/html/html5/liste_des_éléments_html5/index.html
deleted file mode 100644
index 42f2df0c51..0000000000
--- a/files/fr/web/guide/html/html5/liste_des_éléments_html5/index.html
+++ /dev/null
@@ -1,580 +0,0 @@
----
-title: Liste des éléments HTML5
-slug: Web/Guide/HTML/HTML5/Liste_des_éléments_HTML5
-tags:
- - Débutant
- - Guide
- - HTML
- - HTML5
- - Web
-translation_of: Web/HTML/Element
-translation_of_original: Web/Guide/HTML/HTML5/HTML5_element_list
----
-<p>Cette Page n'est pas encore complète.</p>
-
-<p>Travail progressif basé sur document de travail en court à <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/" rel="external" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/">http://www.whatwg.org/specs/web-apps/current-work/multipage/</a>.</p>
-
-<h3 id="Élément_racine" style="">Élément racine</h3>
-
-<p>Les éléments racines définissent la structure d'un document HTML. Ils sont présents dans chacune des pages web et se situent à la suite de la déclaration doctype à la première ligne du document HTML. Les éléments de page sont placés à l'intérieur des balises ouvrante &lt;html&gt; et fermante &lt;/html&gt;.</p>
-
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Balise</th>
- <th scope="col">Description</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>{{ HTMLElement("html") }}</td>
- <td>L'<em>élément HTML racine</em> (<strong><code>&lt;html&gt;</code></strong>) représente la racine du document HTML. Tout autre élément est un descendant de cet élément racine.</td>
- </tr>
- </tbody>
-</table>
-
-<h3 id="Métadonnées_du_document">Métadonnées du document</h3>
-
-<p>Les méta-données contiennent les informations liées à la page telles que les styles de présentation et les scripts. Les méta-données de style et de scripts peuvent être définies au sein de la page web ou via un lien pointant vers un fichier.</p>
-
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Balise</th>
- <th scope="col">Description</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>{{ HTMLElement("head") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("title") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("base") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("link") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("meta") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("style") }}</td>
- <td> </td>
- </tr>
- </tbody>
-</table>
-
-<h3 id="Gestion_des_scripts">Gestion des scripts</h3>
-
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Balise</th>
- <th scope="col">Description</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>{{ HTMLElement("script") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("noscript") }}</td>
- <td> </td>
- </tr>
- </tbody>
-</table>
-
-<h3 id="Sections">Sections</h3>
-
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Balise</th>
- <th scope="col">Description</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>{{ HTMLElement("body") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("section") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("nav") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("article") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("aside") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td><a href="/fr/HTML/Element/Heading_Elements" title="Elementy blokowe"><code>&lt;h1&gt;,&lt;h2&gt;,&lt;h3&gt;,&lt;h4&gt;,&lt;h5&gt;,&lt;h6&gt;</code></a></td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("hgroup") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("header") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("footer") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("address") }}</td>
- <td> </td>
- </tr>
- </tbody>
-</table>
-
-<h3 id="Contenu_de_type_bloc">Contenu de type bloc</h3>
-
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Balise</th>
- <th scope="col">Description</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>{{ HTMLElement("p") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("hr") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("pre") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("blockquote") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("ol") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("ul") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("li") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("dl") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("dt") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("dd") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("figure") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("figcaption") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("div") }}</td>
- <td> </td>
- </tr>
- </tbody>
-</table>
-
-<h3 id="Les_sémantiques_à_un_niveau_textuel">Les sémantiques à un niveau textuel</h3>
-
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Balise</th>
- <th scope="col">Description</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>{{ HTMLElement("a") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("em") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("strong") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("small") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("s") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("cite") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("q") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("dfn") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("abbr") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("data") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("time") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("code") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("var") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("samp") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("kbd") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("sub") }},{{ HTMLElement("sup") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("i") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("b") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("u") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("mark") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("ruby") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("rt") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("rp") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("bdi") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("bdo") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("span") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("br") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("wbr") }}</td>
- <td> </td>
- </tr>
- </tbody>
-</table>
-
-<h3 id="Les_éléments_d'édition">Les éléments d'édition</h3>
-
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Balise</th>
- <th scope="col"> </th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>{{ HTMLElement("ins") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("del") }}</td>
- <td> </td>
- </tr>
- </tbody>
-</table>
-
-<h3 id="Le_contenu_inclus">Le contenu inclus</h3>
-
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Balise</th>
- <th scope="col"> </th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>{{ HTMLElement("img") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("iframe") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("object") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("param") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("video") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("audio") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("source") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("track") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("canvas") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("map") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("area") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("svg") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("math") }}</td>
- <td> </td>
- </tr>
- </tbody>
-</table>
-
-<h3 id="Les_données_tabulaire">Les données tabulaire</h3>
-
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Balise</th>
- <th scope="col"> </th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>{{ HTMLElement("table") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("caption") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("colgroup") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("col") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("tbody") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("thead") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("tfoot") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("tr") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("td") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("th") }}</td>
- <td> </td>
- </tr>
- </tbody>
-</table>
-
-<h3 id="Les_formulaires">Les formulaires</h3>
-
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Balise</th>
- <th scope="col"> </th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>{{ HTMLElement("form") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("fieldset") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("legend") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("label") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("input") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("button") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("select") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("datalist") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("optgroup") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("option") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("textarea") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("keygen") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("output") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("progress") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("meter") }}</td>
- <td> </td>
- </tr>
- </tbody>
-</table>
-
-<h3 id="Les_éléments_pour_l'interactivité">Les éléments pour l'interactivité</h3>
-
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Balise</th>
- <th scope="col"> </th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>{{ HTMLElement("details") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("summary") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("command") }}</td>
- <td> </td>
- </tr>
- <tr>
- <td>{{ HTMLElement("menu") }}</td>
- <td> </td>
- </tr>
- </tbody>
-</table>
-
-<p> </p>