Aller au contenu

Topic-A

La balise <title>

Description

L'élément <title> définit le titre du document (qui est affiché dans la barre de titre du navigateur ou dans l'onglet de la page). Cet élément ne peut contenir que du texte, les balises qu'il contiendrait seraient ignorées.

Utilisation

L'élément <title> est toujours utilisé au sein de l'élément de la page.

Référencement (SEO)
Le titre d'une page fait partie des éléments principaux qui sont scannés lors de l'indexation d'une page. C'est aussi le texte qui est affiché parmi les résultats du moteur de recherche, de façon proéminente et donc visible par les utilisateurs qui trouvent votre site grâce à un moteur de recherche.

Aussi, mieux vaudra avoir des titres descriptifs plutôt que des titres trop courts ou vagues.

Quelques observations :

On pourra éviter les titres sur un ou deux mots. La longueur affichée pour les titres dans les résultats d'un moteur de recherche se situe entre 55 et 60 caractères. Si le titre est plus long, on veillera à ce que les concepts majeurs apparaissent avant cette longueur. Attention aux entités (les chevrons HTML pourront être affichés différemment entre les navigateurs). Le titre doit être intelligible et pas une simple concaténation de mots-clés. Le titre devra être unique pour un même site.

Compatibilité

title-compatibility.png

Exemples

<title>Et voici le titre de ma page !</title>
<h1>Page d'accueil</h1>
<p>Contenu principal de la page.</p>

La balise <meta>

Description

La balise <meta> fournit des métadonnées supplémentaires à propos d'une page web. Ces données sont utilisées par les navigateurs, les moteurs de recherche et d'autres services pour comprendre les propriétés d'une page sans afficher ces informations à l'utilisateur final.

Attributs principaux

  • charset : Définit l'encodage des caractères (ex. UTF-8).
  • name : Indique le type de métadonnées (ex. description, keywords).
  • content : Contenu des métadonnées.
  • http-equiv : Fournit des instructions spécifiques au navigateur.

Utilisation

Voici des exemples concrets d'utilisation de la balise <meta> :

  1. Définir l'encodage de caractères :
    <meta charset="UTF-8" />
    

Compatiblité

meta-1.png

Exemples

<!-- Rediriger la page après 3 secondes -->
<meta http-equiv="refresh" content="3;url=https://www.mozilla.org" />
<!-- Spécifier les mots-clés pour le référencement -->
<meta name="keywords" content="HTML, balises, guide, programmation" />