Définir des titres et des liens dans l'élément HTML

Dans l'élément HTML d'une page que vous construisez pour votre site Web, il y a deux éléments principaux. Le contenu visible de la page est inclus dans la balise, puis tout le reste passe dans l'élément head.

La section de la tête du document HTML est l'endroit où le titre de la page est défini et où sont définis les liens vers les fichiers dont dépend la page HTML. Les éléments HTML de l'élément head communiquent des informations importantes, telles que le nom du site, une description du contenu du site et la feuille de style liée. Cette information est utilisée par le navigateur, les moteurs de recherche et les visiteurs du site.

La section head d'un HTML comprend généralement:

• Le titre de la page

• Liens vers le (s) fichier (s) de feuille de style CSS utilisé pour formater la page

• Mots clés et autres "Métadonnées" utilisées dans les moteurs de recherche

Les titres résument le contenu de la page

Un titre de la page s'affiche dans la barre de titre d'un navigateur ou d'un navigateur. Les titres de pages sont essentiels - ils doivent être succincts, mais résumer le contenu de la page.

Voici un exemple de code pour un titre de page:

Bienvenue sur le Web Collective!

Liens vers les feuilles de style CSS

Les liens vers les feuilles de style appartiennent également à l'élément head d'une page HTML. N'oubliez pas que le formatage est fourni aux pages Web modernes via des fichiers externes, distincts, séparés et liés. Voici à quoi ressemble ce code:

La syntaxe d'une feuille de style liée est un peu déroutante, alors décompressez-la. La balise qui lie une feuille de style à une page HTML est un exemple d'élément non conteneur (parfois appelé élément void). En d'autres termes, il n'y a qu'une étiquette d'ouverture et aucune étiquette de fermeture. Au lieu de cela, cette balise de lien s'ouvre avec.

Éléments, attributs et valeurs

En passant, ou peut-être pas en passant, les éléments HTML ont des attributs, et ces attributs sont définis avec une syntaxe qui suit le modèle d'attribut name = "valeur".

Pour coller l'exemple d'une feuille de style liée, l'élément de lien possédait des attributs rel, href et type. Ces attributs ont à la fois l'attribut noms (comme rel, href ou type) et valeurs (les informations spécifiques entre guillemets qui suivent le nom de l'attribut).

Le rôle (moins, mais toujours important) des balises meta

balises Meta sont des éléments facultatifs dans un élément de tête qui fournissent des informations supplémentaires sur une page, notamment:

• Descriptions et mots clés utilisés par moteurs de recherche.

• Informations supplémentaires sur la page, comme auteur.

Comme tout le reste en HTML, le rôle et la valeur des méta tags évoluent. Dans les époques antérieures, les balises META pour les mots clés ont joué un rôle plus important dans l'optimisation des moteurs de recherche (SEO, affichage important et précis dans les résultats des moteurs de recherche).

Cependant, les moteurs de recherche modernes (et les nouvelles balises supplémentaires en HTML5) fournissent des canaux alternatifs, plus complexes et sophistiqués pour identifier le contenu de la page et indexer ce contenu dans les moteurs de recherche. Pourtant, l'utilisation de balises META pour l'auteur, la description et les mots clés (encore parfois utile pour les moteurs de recherche) peut encore être une partie importante du contenu de la tête HTML.

Jetez un coup d'œil à l'apparence typique d'une page HTML, y compris l'élément head.

Bienvenue dans la révolution Web

Les éléments HTML de l'élément head communiquent des informations importantes, telles que le nom du site, une description du contenu du site et la feuille de style liée. Cette information est utilisée par le navigateur, les moteurs de recherche et les visiteurs du site.

La figure révèle comment les éléments de la tête communiquent des informations au monde. Vous pouvez voir le code source HTML pour la version de Craigslist de New York City. com (en haut à gauche), avec le titre défini, affiché dans la barre de titre d'un navigateur (en haut à droite) et la description définie telle qu'elle apparaît dans le résultat de recherche Google (en bas à droite).