<head>
<head>
contient les métadonnées de la page : des données sur les données.
Ces métadonnées définissent les informations de la page (langage, description…), son titre, le style css, les scripts javascript…
<head>
est placé avant <body>
.
Cette balise représente une partie non visible du code à l’affichage dans le navigateur.
<head>
est constitué de ces balises :
<title>
: balise du titre du site (visible comme étant le nom de l’onglet)<link>
: import de fichier css ou autre que javascript<style>
: écriture de code css<script>
: écriture de code javascript ou import de fichier javascript<meta>
balises donnant des informations sur la page
<title>
<title>
définit
- le titre de la page, soit le nom de l’onglet
- le nom donné au favori
- le titre du résultat d’un moteur de recherche
<link>
<link>
importe un fichier externe pour être interprété par le navigateur, le plus souvent une feuille de style CSS ou une icône<link>
est une balise orpheline (qui ne se ferme pas) et vide (elle n’est définit que par ses attributs)rel
[][][url]|L’url, le lien pointant vers une ressource, un fichier, un document++En valeur absolu vers une ressource externe++Ou en valeur relative pour un élément interne|*++&++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Attributes/rel#stylesheet}++whatwg{https://html.spec.whatwg.org/multipage/links.html#link-type-stylesheet}href
++S’utilise toujours avec l’attribut href
[][]stylesheet|Indique que le lien est une feuille de style++Recommandé|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Attributes/rel#stylesheet}++whatwg{https://html.spec.whatwg.org/multipage/links.html#link-type-stylesheet}<>icon|Indique que l’url
pointe vers une icône (format .ico) ou une image pour en faire une favicon++Recommandé|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Attributes/rel#icon}++whatwg{https://html.spec.whatwg.org/multipage/links.html#rel-icon}++wiki{https://fr.wikipedia.org/wiki/Favicon}
<>alternate|Indique que l’url
pointe vers une version alternative de la page|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Attributes/rel#alternate}++whatwg{https://html.spec.whatwg.org/multipage/links.html#rel-alternate}
<>author|Indique que l’url
pointe vers le site web de l’auteur du site ou de la page web actuelle|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Attributes/rel#author}++whatwg{https://html.spec.whatwg.org/multipage/links.html#link-type-author}
<>help|Indique que l’url
pointe vers un document d’aide|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Attributes/rel#help}++whatwg{https://html.spec.whatwg.org/multipage/links.html#link-type-help}
<>license|Indique que l’url
pointe vers un document fournissant les termes du copyright|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Attributes/rel#license}++whatwg{https://html.spec.whatwg.org/multipage/links.html#link-type-license}
<>search|Indique que l’url
pointe vers un document utilisé pour rechercher dans le document actuel et ses pages associées.|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Attributes/rel#search}++whatwg{https://html.spec.whatwg.org/multipage/links.html#link-type-search}
<>canonical|Indique que l’url
pointe vers un document canonique|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Attributes/rel#canonical}++whatwg{https://html.spec.whatwg.org/multipage/links.html#link-type-canonical}
<>prefetch|Optimisation du chargement de la page : Spécifie que le navigateur peut télécharger et mettre en cache de manière préventive le fichier mentionné par l’ url
(priorité faible)|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Link_types/prefetch}++whatwg{https://html.spec.whatwg.org/multipage/links.html#link-type-prefetch}++alsa{https://www.alsacreations.com/astuce/lire/1567-prefetch-prerender-dns-prefetch-link.html}++dare{https://blog.dareboost.com/fr/2020/05/preload-prefetch-et-preconnect-resource-hints/}
<>dns-prefetch|Optimisation du chargement de la page : Effectue une résolution des noms de domaine pour l’origine de la ressource spécifiée par l’ url
de manière préventive|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Link_types/dns-prefetch}++whatwg{https://html.spec.whatwg.org/multipage/links.html#link-type-dns-prefetch}++alsa{https://www.alsacreations.com/astuce/lire/1567-prefetch-prerender-dns-prefetch-link.html}++dare{https://blog.dareboost.com/fr/2020/05/preload-prefetch-et-preconnect-resource-hints/}
<>preload|Optimisation du chargement de la page : Indique que le navigateur doit télécharger et mettre en cache le fichier mentionné par l’ url
au plus tôt (priorité haute), le type de la ressource est renseigné par l’attribut as
|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Link_types/preload}++whatwg{https://html.spec.whatwg.org/multipage/links.html#link-type-preload}++dare{https://blog.dareboost.com/fr/2020/05/preload-prefetch-et-preconnect-resource-hints/}
<>next|Indique que la page actuelle fait partie d’une série, et que la page suivante est renseigné par l’ url
|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Attributes/rel#next}++whatwg{https://html.spec.whatwg.org/multipage/links.html#link-type-next}
<>prev|Indique que la page actuelle fait partie d’une série, et que la page précédente est renseigné par l’ url
|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Attributes/rel#prev}++whatwg{https://html.spec.whatwg.org/multipage/links.html#link-type-prev}N’utilisez pas cet attribut si tous vos fichiers se situent sur votre serveur, votre domaine. [][]anonymous|La demande cross-origin est envoyée sans identification et effectue une authentification HTTP de base++Valeur par defaut|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Attributes/crossorigin}++whatwg{https://html.spec.whatwg.org/multipage/urls-and-fetching.html#attr-crossorigin-anonymous}<>use-credentials|demande d’origine croisée sera envoyée avec les informations d’identification, les cookies et le certificat.|*++&|mozilla{https://developer.mozilla.org/fr/docs/Web/HTML/Attributes/crossorigin}++whatwg{https://html.spec.whatwg.org/multipage/urls-and-fetching.html#attr-crossorigin-anonymous}