Please note, this is a STATIC archive of website developer.mozilla.org from 03 Nov 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

Revision 1002327 of HTML (HyperText Markup Language)

  • Raccourci de la révision : Web/HTML
  • Titre de la révision : HTML (HyperText Markup Language)
  • ID de la révision : 1002327
  • Créé :
  • Créateur : Aminelahlou
  • Version actuelle ? Non
  • Commentaire
Étiquettes : 

Contenu de la révision

{{HTMLSidebar()}}

HTML, l'acronyme de « HyperText Markup Language » (Langage de Balises pour l'« Hypertexte »), est utilisé pour créer et représenter visuellement une page web. C'est ce qui détermine le contenu et la présentation de base d'une page web mais pas ses fonctionnalités.

HTML ajoute des « balises » au contenu textuel standard. On parle d'« hypertexte » en référence aux liens interconnectant les pages web, mécanique originelle du « World Wide Web » que nous connaissons aujourd'hui. En écrivant et publiant des pages web, vous devenez un acteur du Web dès que votre site est accessible en ligne. HTML permet d'inclure des images et d'autres contenus dans les pages web. Grâce à HTML, chacun peut créer des sites web aussi bien statiques que dynamiques. HTML est le langage qui permet de décrire la structure et le contenu sémantique d'un document web. Ce contenu est balisé par des éléments HTML comme {{ HTMLElement("head") }}, {{ HTMLElement("title") }}, {{ HTMLElement("body") }}, {{ HTMLElement("article") }}, {{ HTMLElement("section") }}, {{ HTMLElement("p") }}, {{ HTMLElement("div") }}, {{ HTMLElement("span") }}, {{ HTMLElement("img") }}, {{ HTMLElement("picture") }} et bien d'autres encore. Ces éléments forment les blocs utilisés pour construire un site web.

Les articles suivants fournissent des éléments de référence utiles au développement web :

  • Référence HTML

    Dans notre référence exhaustive, vous trouverez le détail de chaque élément et attribut constituant HTML.

  • Guide HTML

    Pour plus d'informations sur l'utilisation du HTML, des tutoriaux et des exemples complets, voir le guide de développement HTML.

  • Introduction à HTML

    Premiers pas dans le développement web ? L'introduction explique ce qu'est HTML et comment l'utiliser.

Références

Éléments de bloc
Les éléments de bloc sont une catégorie d'éléments HTML (Hypertext Markup Language), opposés aux éléments en ligne. Leur caractéristique principale réside dans le fait qu'ils sont séparés par un saut de ligne avant et après l'élément (créant ainsi un bloc de contenu). Ce faisant, ils prennent la largeur de leurs conteneurs.
Image avec ressources d'origines multiples (CORS) activées

La spécification HTML introduit un attribut crossorigin pour les images qui, combinées avec l'en-tête CORS (Cross-Origin Resource Sharing) approprié, permet aux images définies via l'élément <img> et provenant d'emplacements étrangers d'être utilisées dans le canevas de la même manière que si elles avaient été chargées depuis l'origine de la page actuelle.

Attributs de réglage du CORS
En HTML5, certains des éléments HTML supportant le CORS (Cross-Origin Resource Sharing) comme les <img> ou les <video>, ont un attribut crossorigin (propriété crossOrigin), qui permet de configurer les requêtes CORS pour les données de l'élément à renvoyer.
La vérification orthographique dans les formulaires HTML
Firefox 2 a introduit un support pour la vérification orthographique dans les zones de texte et les champs de texte des formulaires HTML. L'utilisateur peut choisir d'activer ou non cette fonctionnalité via l'interface about:config et d'appliquer cette vérification soit aux zones de texte et aux champs de texte soit seulement aux zones de texte.
DASH Adaptive Streaming for HTML 5 Video
Dynamic Adaptive Streaming over HTTP (DASH) est un protocole de streaming adaptatif : il permet de changer le débit de la vidéo en fonction des performances réseau, afin que la vidéo ne soit pas interrompue.
Focus management in HTML
Dans un document de travail en HTML5, l'attribut DOM activeElement et la méthode DOM hasFocus() permet au programmeur d'avoir un meilleur contrôle de l'interactivité d'une page vis à vis des actions de l'utilisateur. Par exemple, ils peuvent tout deux être utilisés pour des statistiques, pour surveiller le nombre de clics sur certains liens d'une page, pour comptabiliser le nombre de fois où l'élement reçoit le focus, etc. De plus, combinés à une technologie AJAX, ils aident à minimiser le nombre de requêtes au serveur, en fonction de l'activité de l'utilisateur  et de l'agencement de la page.
Attributs globaux
Les attributs globaux peuvent être spécifiés dans tous les éléments HTML, même ceux non spécifiés dans le standard. Cela signifie que tout élément  non-standard doit encore permettre ces attributs, bien que l'utilisation de ces éléments signifie que le document n'est plus conforme au HTML5. Par exemple, les navigateurs conformes au HTML5 masquent les contenus marqués comme <foo hidden>...<foo>, bien que <foo> ne soit pas un élément valide HTML.
Référence d'attribut HTML
Les élements HTML5 ont des attributs. Ce sont des valeurs additionnelles permettant de configurer ou d'ajuster le comportement les éléments de manières à répondre aux critères de l'utilisateur.
Référence d'élément HTML
Cette page liste tous les différents éléments HTML.
Référence HTML
HTML est un langage décrivant la structure et le contenu sémantiqe d'un document Web. Il est constitué d'éléments, chacun pouvant être modifié à l'aide de différents attributs.
Inline elements
Les éléments HTML sont habituellement des élements "en ligne" ou des éléments de bloc. Un élement en ligne occupe seulement l'espace associé aux balises.
Les éléments HTML (Hypertext Markup Language) sont habituellement des éléments "en ligne" ou éléments "de bloc". Un élément en ligne occupe seulement un espace limité par les étiquettes qui définissent l'élément en ligne. L'exempe suivant démontre l'influence de l'élément en ligne:
Types de lien
Dans HTML, les types de lien suivants indiquent les relations entre deux documents, dans lesquels un lien se lie à un autre en utilisant un élément <a>, <area>, ou <link>.
Formats de média supportés par les élements audio et vidéo HTML
Les éléments {{ HTMLElement("audio") }} et {{ HTMLElement("video") }} offrent la possibilité de jouer des médias audio et video directement dans le navigateur sans nécessiter l'installation préalable de programme tiers.
Microformats
Microformats (quelques fois abrégés μF) sont de petits modèles d'HTML pour marquer des entités telles les personnes, organisations, évenements, localisations, posts de blog, produits, revues, résumés, recettes, etc.
Ils sont de simples conventions pour embarquer la sémantique dans HTML et fournit rapidement un API pour être utilisé pour la recherche de moteurs, assembleurs, et autres outils.
Optimiser vos pages pour une analyse syntaxique spéculative
Traditionellement dans les navigateurs, l'analyseur syntaxique HTML a fonctionné sur le processus principal (thread) et bloque après une étiquette </script> jusqu'à ce que le  script ait été récupéré depuis le réseau et executé. L'analyse syntaxique HTML dans Firefox 4 et ultérieur supporte l'analyse syntaxique spéculative du processus principal. Il fait l'analyse syntaxique pendant que les scripts sont téléchargés et exécutés. Comme dans Firefox 3.5 et 3.6,l'analyseur syntaxique HTML commence des charges spéculatives pour les scripts,des feuilles de style et des images se trouvent en avant dans le processus. Cependant, dans Firefox 4 et ultérieur, l'analyseur syntaxique HTML exécute aussi l'algorithme de construction d'arbre HTML de manière spéculative. L'avantage est que lorsque une spéculation réussit, il n'est pas nécessaire, d'analyser de nouveau, syntaxiquement la partie du fichier arrivant qui était déjà scanné pour les scripts, des feuilles de style et des images. Le désavantage est qu'il y a plus de travail quand la spécualation échoue.
Utilisation de cache d'application
HTML5 fournit un mécanisme de cache d'application qui laisse les applications basées sur le web fonctionner hors-ligne. Les développeurs peuvent utiliser l'interface d'Application Cache (AppCache) pour spécifier les ressources dont le navigateur rend disponible aux utilisateurs hors-ligne. Les applications qui sont cachées chargent et travaillent correctement même si les utilisateurs cliquent pour raffraîchir le bouton quand ils sont hors-ligne.

Voir tout...

Guides et tutoriaux

Guide de développement HTML
Des articles MDN qui illustrent certaines techniques à utiliser quand vous créez du contenu web avec HTML, ainsi que des tutoriaux et d'autres contenus pertinents pour développer en HTML. Ce guide propose des cours et astuces sur le développement HTML.

{{CommunityBox("Mise en page Web", "dev-tech-layout", "mozilla.dev.tech.layout", "", "Stack Overflow|https://stackoverflow.com/questions/tagged/html|Sujets HTML|Stack Overflow est un site de questions-réponses géré de façon collaborative. Vous pouvez chercher parmi les réponses existantes ou poser votre question.")}}

Source de la révision

<div>{{HTMLSidebar()}}</div>

<p>HTML, l'acronyme de « HyperText Markup Language » (Langage de Balises pour l'« Hypertexte »), est utilisé pour créer et représenter visuellement une page web. C'est ce qui détermine le contenu et la présentation de base d'une page web mais pas ses fonctionnalités.</p>

<p>HTML ajoute des « balises » au contenu textuel standard. On parle d'« hypertexte » en référence aux liens interconnectant les pages web, mécanique originelle du « World Wide Web » que nous connaissons aujourd'hui. En écrivant et publiant des pages web, vous devenez un acteur du Web dès que votre site est accessible en ligne. HTML permet d'inclure des images et d'autres contenus dans les pages web. Grâce à HTML, chacun peut créer des sites web aussi bien statiques que dynamiques. HTML est le langage qui permet de décrire la structure et le contenu sémantique d'un document web. Ce contenu est balisé par des éléments HTML comme {{ HTMLElement("head") }}, {{ HTMLElement("title") }}, {{ HTMLElement("body") }}, {{ HTMLElement("article") }}, {{ HTMLElement("section") }}, {{ HTMLElement("p") }}, {{ HTMLElement("div") }}, {{ HTMLElement("span") }}, {{ HTMLElement("img") }}, {{ HTMLElement("picture") }} et bien d'autres encore. Ces éléments forment les blocs utilisés pour construire un site web.</p>

<p>Les articles suivants fournissent des éléments de référence utiles au développement web&nbsp;:</p>

<ul class="card-grid">
 <li><span>Référence HTML</span>

  <p>Dans notre <a href="/fr/docs/Web/HTML/Reference" title="/fr/docs/Web/HTML/Reference">référence exhaustive</a>, vous trouverez le détail de chaque élément et attribut constituant HTML.</p>
 </li>
 <li><span>Guide HTML</span>
  <p>Pour plus d'informations sur l'utilisation du HTML, des tutoriaux et des exemples complets, voir <a href="/fr/docs/Web/Guide/HTML">le guide de développement HTML</a>.</p>
 </li>
 <li><span>Introduction à HTML</span>
  <p>Premiers pas dans le développement web&nbsp;? L'<a href="/fr/docs/Web/Guide/HTML/Introduction">introduction</a> explique ce qu'est HTML et comment l'utiliser.</p>
 </li>
</ul>

<div class="row topicpage-table">
<div class="section">
<h2 class="Documentation" id="Documentation" name="Documentation">Références</h2>

<dl>
 <dt class="landingPageList"><a href="/fr/docs/Web/HTML/%C3%89l%C3%A9ments_en_bloc">Éléments de bloc</a></dt>
 <dd class="landingPageList">Les éléments de bloc sont une catégorie d'éléments HTML (Hypertext Markup Language), opposés aux <a href="/fr/docs/Web/HTML/Inline_elemente" title="/fr/docs/Web/HTML/Inline_elemente">éléments en ligne</a>. Leur caractéristique principale réside dans le fait qu'ils sont séparés par un saut de ligne avant et après l'élément (créant ainsi un bloc de contenu). Ce faisant, ils prennent la largeur de leurs conteneurs.</dd>
 <dt class="landingPageList"><a href="/fr/docs/Web/HTML/Image_avec_ressources_origines_multiples_CORS_activees">Image avec ressources d'origines multiples (CORS) activées</a></dt>
 <dd class="landingPageList">
 <p>La spécification HTML introduit un attribut <code><a href="/fr/docs/Web/HTML/Element/img#attr-crossorigin">crossorigin</a></code> pour les images qui, combinées avec l'en-tête CORS (Cross-Origin Resource Sharing) approprié, permet aux images définies via l'élément <a href="/fr/docs/Web/HTML/Element/img" title="L'élément &lt;img&gt; HTML (ou HTML Image Element en anglais) représente une image du document."><code>&lt;img&gt;</code></a>&nbsp;et provenant d'emplacements étrangers d'être utilisées dans le canevas de la même manière que si elles avaient été chargées depuis l'origine de la page actuelle.</p>
 </dd>
 <dt class="landingPageList"><a href="fr/docs/Web/HTML/Reglages_des_attributs_CORS">Attributs de réglage du CORS</a></dt>
 <dd class="landingPageList">En HTML5, certains des éléments HTML supportant le <a href="/fr/docs/HTTP/Access_control_CORS">CORS</a> (Cross-Origin Resource Sharing) comme les <a href="/fr/docs/Web/HTML/Element/img" title="L'élément &lt;img&gt; HTML (ou HTML Image Element en anglais) représente une image du document.">&lt;img&gt;</a> ou les <a href="/fr/docs/Web/HTML/Element/video" title="L'élément HTML &lt;video&gt; est utilisé pour intégrer des vidéo dans un document HTML ou XHTML."><code>&lt;video&gt;</code></a>, ont un attribut <code><a href="/fr/docs/Web/HTML/Element/img#attr-crossorigin">crossorigin</a></code> (propriété <code>crossOrigin</code>), qui permet de configurer les requêtes CORS pour les données de l'élément à renvoyer.</dd>
 <dt class="landingPageList"><a href="/fr/docs/Web/HTML/La_vérification_orthographique_dans_les_formulaires">La vérification orthographique dans les formulaires HTML</a></dt>
 <dd class="landingPageList">Firefox 2 a introduit un support pour la vérification orthographique dans les zones de texte et les champs de texte des formulaires HTML. L'utilisateur peut choisir d'activer ou non cette fonctionnalité via l'interface <code>about:config</code> et d'appliquer cette vérification soit aux zones de texte et aux champs de texte soit seulement aux zones de texte.</dd>
 <dt class="landingPageList"><a href="/fr/docs/Web/HTML/DASH_Adaptive_Streaming_for_HTML_5_Video">DASH Adaptive Streaming for HTML 5 Video</a></dt>
 <dd class="landingPageList"><strong>Dynamic Adaptive Streaming over HTTP (DASH)</strong> est un protocole de <em>streaming</em> adaptatif : il permet de changer le débit de la vidéo en fonction des performances réseau, afin que la vidéo ne soit pas interrompue.</dd>
 <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Focus_management_in_HTML">Focus management in HTML</a></dt>
 <dd class="landingPageList">Dans un document de travail en HTML5, l'attribut DOM <code><a href="/fr/docs/Web/API/Document/activeElement" title="en/DOM/document.activeElement">activeElement</a></code> et la méthode DOM <code><a href="/fr/docs/Web/API/Document/hasFocus" title="en/DOM/document.hasFocus">hasFocus()</a></code> permet au programmeur d'avoir un meilleur contrôle de l'interactivité&nbsp;d'une page vis à vis des actions de l'utilisateur. Par exemple, ils peuvent tout deux être utilisés pour des statistiques, pour surveiller le nombre de clics sur certains liens d'une page, pour comptabiliser le nombre de fois où l'élement reçoit le focus, etc. De plus, combinés à une technologie AJAX, ils aident à minimiser le nombre de requêtes au serveur, en fonction de l'activité de l'utilisateur&nbsp; et de l'agencement de la page.</dd>
 <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes">Attributs globaux</a></dt>
 <dd class="landingPageList">Les attributs globaux peuvent être spécifiés dans tous les <a href="/fr/docs/Web/HTML/Element">éléments HTML</a>, <em>même ceux non spécifiés dans le standard</em>. Cela signifie que tout élément&nbsp; non-standard doit encore permettre ces attributs, bien que l'utilisation de ces éléments signifie que le document n'est plus conforme au HTML5. Par exemple, les navigateurs conformes au HTML5 masquent&nbsp;les contenus marqués comme <code>&lt;foo hidden&gt;...&lt;foo&gt;</code><code>, bien que&nbsp;</code><code>&lt;foo&gt;</code> ne soit pas un élément valide HTML.</dd>
 <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes">Référence d'attribut HTML</a></dt>
 <dd class="landingPageList">Les élements HTML5 ont des attributs. Ce sont des valeurs additionnelles permettant de configurer ou d'ajuster le comportement&nbsp;les éléments de manières à répondre aux critères de l'utilisateur.</dd>
 <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element">Référence d'élément HTML</a></dt>
 <dd class="landingPageList">Cette page liste tous les différents <a class="glossaryLink" href="https://developer.mozilla.org/en-US/docs/Glossary/Element" title="éléments: Un élément est une parte d'une page web.">éléments</a> <a class="glossaryLink" href="https://developer.mozilla.org/en-US/docs/Glossary/HTML" title="HTML: HTML (HyperText Markup Language) est le langage descriptif spécifiant la structure d'une page web.">HTML</a>.</dd>
 <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Reference">Référence HTML</a></dt>
 <dd class="landingPageList">HTML&nbsp;est un langage décrivant la structure et le contenu sémantiqe d'un document Web. Il est constitué d'éléments, chacun pouvant être modifié à l'aide de différents attributs.</dd>
 <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Inline_elemente">Inline elements</a></dt>
 <dd class="landingPageList">Les éléments HTML&nbsp;sont habituellement des élements "en ligne" ou des éléments de bloc. Un élement en ligne occupe seulement l'espace associé aux balises.</dd>
 <dd class="landingPageList">Les éléments HTML (Hypertext Markup Language) sont habituellement des éléments "en ligne" ou <a href="/fr/docs/Web/HTML/%C3%89l%C3%A9ments_en_bloc" title="Elements de bloc">éléments "de bloc"</a>. Un élément en ligne occupe seulement un espace limité par les étiquettes qui définissent l'élément en ligne. L'exempe suivant démontre l'influence de l'élément en ligne:</dd>
 <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types">Types de lien</a></dt>
 <dd class="landingPageList">Dans HTML, les types de lien suivants indiquent les relations entre deux documents, dans lesquels un lien se lie à un autre en utilisant un élément <a href="/fr/docs/Web/HTML/Element/a" title="The HTML &lt;a&gt; Element (or the HTML Anchor Element) defines a hyperlink, the named target destination for a hyperlink, or both."><code>&lt;a&gt;</code></a>, <a href="/fr/docs/Web/HTML/Element/area" title="The HTML &lt;area&gt; element defines a hot-spot region on an image, and optionally associates it with a hypertext link. This element is used only within a &lt;map&gt; element."><code>&lt;area&gt;</code></a>, ou <a href="https://developer.mozilla.org/fr/docs/Web/HTML/Element/link" title="The HTML Link Element (&lt;link&gt;) specifies relationships between the current document and an external resource. Possible uses for this element include defining a relational framework for navigation. This Element is most used to link to style sheets."><code>&lt;link&gt;</code></a>.</dd>
 <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Supported_media_formats">Formats de média supportés par les élements audio et vidéo HTML</a></dt>
 <dd class="landingPageList">Les éléments {{ HTMLElement("audio") }} et {{ HTMLElement("video") }} offrent la possibilité de jouer des médias audio et video directement dans le navigateur sans nécessiter l'installation préalable de programme tiers.</dd>
 <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/microformats">Microformats</a></dt>
 <dd class="landingPageList"><span class="p-summary"><a class="external external-icon" href="https://microformats.org"><dfn>Microformats</dfn></a> (quelques fois abrégés <strong>μF</strong>) sont de petits modèles d'HTML pour marquer des entités telles les personnes, organisations, évenements, localisations, posts de blog, produits, revues, résumés, recettes, etc.</span><br />
 Ils sont de simples conventions pour embarquer la sémantique dans HTML et fournit rapidement un API pour être utilisé pour la recherche de moteurs, assembleurs, et autres outils.</dd>
 <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Optimizing_your_pages_for_speculative_parsing">Optimiser vos pages pour une analyse syntaxique spéculative</a></dt>
 <dd class="landingPageList">Traditionellement dans les navigateurs, l'analyseur syntaxique HTML a fonctionné sur le processus principal (<em>thread)</em> et bloque après une étiquette <code>&lt;/script&gt;</code> jusqu'à ce que le&nbsp; script ait été récupéré depuis le réseau et executé. L'analyse syntaxique HTML dans Firefox 4 et ultérieur supporte l'analyse syntaxique spéculative du processus principal. Il fait l'analyse syntaxique pendant que les scripts sont téléchargés et exécutés. Comme dans Firefox 3.5 et 3.6,l'analyseur syntaxique HTML commence des charges spéculatives pour les scripts,des feuilles de style et des images se trouvent en avant dans le processus. Cependant, dans Firefox 4 et ultérieur, l'analyseur syntaxique HTML exécute aussi l'algorithme de construction d'arbre HTML de manière spéculative. L'avantage est que lorsque une spéculation réussit, il n'est pas nécessaire, d'analyser de nouveau,&nbsp;syntaxiquement la partie du fichier arrivant qui était déjà scanné pour les scripts, des feuilles de style et des images. Le désavantage est qu'il y a plus de travail quand la spécualation échoue.</dd>
 <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Using_the_application_cache">Utilisation de cache d'application</a></dt>
 <dd class="landingPageList"><a href="/fr/docs/Web/Guide/HTML/HTML5" title="HTML/HTML5">HTML5</a> fournit un mécanisme de <em>cache d'application </em>qui laisse les applications basées sur le web fonctionner hors-ligne. Les développeurs peuvent utiliser l'interface d'<strong>Application Cache</strong> (<em>AppCache</em>) pour spécifier les ressources dont le navigateur rend disponible aux utilisateurs hors-ligne. Les applications qui sont cachées chargent et travaillent correctement même si les utilisateurs cliquent pour raffraîchir le bouton quand ils sont hors-ligne.</dd>
</dl>

<p><span class="alllinks"><a href="/fr/docs/tag/HTML" title="Articles taggés: HTML">Voir tout...</a></span></p>
</div>

<div class="section">
<h2 class="Tools" id="Tools" name="Tools">Guides et tutoriaux</h2>

<dl>
 <dt><a href="/fr/docs/Web/Guide/HTML">Guide de développement HTML</a></dt>
 <dd>Des articles MDN qui illustrent certaines techniques à utiliser quand vous créez du contenu web avec HTML, ainsi que des tutoriaux et d'autres contenus pertinents pour développer en HTML. Ce guide propose des cours et astuces sur le développement HTML.</dd>
</dl>
</div>
</div>

<p>{{CommunityBox("Mise en page Web", "dev-tech-layout", "mozilla.dev.tech.layout", "", "Stack Overflow|https://stackoverflow.com/questions/tagged/html|Sujets HTML|Stack Overflow est un site de questions-réponses géré de façon collaborative. Vous pouvez chercher parmi les réponses existantes ou poser votre question.")}}</p>
Revenir à cette révision