L'importance des balises META, TITLE & H1

La partie BODY comprend tout ce qui est affiché à l'écran alors que la partie HEAD comprend la feuille de style interne, un lien vers une feuille de style externe,un script et/ou un lien vers du script externe mais aussi des informations essentielles pour le navigateur et les moteurs de recherche.
Dans la partie HEAD ont trouve donc les balises LINK, STYLE, SCRIPT, TITLE mais aussi les balise META !

Les balise meta

META Keywords

Syntaxe : meta name ="keywords" content ="liste de mots clés" .
Cette balise est obsolète ; les moteurs de recherche n'utilisent plus le contenu de cette balise pour indexer le site.

META Description

Syntaxe : meta name ="keywords" content ="liste de mots clés" .
Cette balise à pour rôle de fournir une description courte (deux à trois phrases courtes) de la page web.
Cette description est notamment utilisée par les principaux moteurs de recherche pour commenter l'index créé par le moteur.

META refresh

META robots

Inutile de demander aux robots d’indexation d’indexer vos pages: c’est leur comportement par défaut !
Par contre vous pouvez souhaitez pour diverses raisons que certaines pages de votre site ne soient pas indéxées ... Dans ce cas il faut écrire dans la partie HEAD : Meta name ="robots" content ="noindex"

META charset

Il s'agit d'une balise META utilisée par le navigateur.

Si dans une page de votre site les lettres accentuées apparaissent de façon bizarre c'est qu'il y a une incohérence entre le jeu de caractères utilisé pour encoder la page et le jeu de caractères pour lire la page avec le navigateur.
Ainsi meta charset = 'utf-8' signifie au navigateur qu'il doit utiliser le jeu de caractères UTF-8 pour lire la page. Si cette page a été encodée en ANSI alors tous les caractères accentués apparaissent sour form d'un losange noir contenant un point d'interrogation.

META viewport

Souvent dans la partie HEAD d'une page on trouve meta name="viewport" content= "width=device-width, user-scalable=yes"
Cette instruction est indispensable pour l'affichage correct de votre page sur un petit écran (tablette ou smartphone).

Les écrans des mobiles sont beaucoup plus étroits que les écrans de PC (seulement quelques centaines de pixels de large). Pour s'adapter, les navigateurs mobiles affichent le site en "dézoomant" ce qui permet d'avoir un aperçu de l'ensemble de la page mais alors c'est tellement écrit petit que c'est illisible !
Cette zone d'affichage simulée est appelée le viewport.
Attention la valeur du viewport ne dépend pas du terminal mais du navigateur mobile installé sur ce terminal. Ainsi le viewport est compris entre 800 pixels (Android 3) et 980 (Android 4 et Safari).

Prenons un exemple. Votre iphone5 a une largeur utile d'écran de 320 par 568 pixels ; le viewport possible est de 980 pixels grâce au navigateur safari mobile qui est installé.
Mais grâce à l'instruction meta name ="viewport" ... la largeur effective sera de 320 pixels ou (568 selon l'orientation).

Autres balises importantes pour le SEO

D'autres balises sont importantes dans le cadre du SEO (Search Engine Optimization) ou référencement naturel ; il s'agit de la balise TITLE et H1.

La balise TITLE

La balise TITLE est contenue dans la partie HEAD. Elle sert à légender l'onglet dans lequel s'affiche la page mais pas seulement ...
Le contenu de cette balise ne doit pas dépasser 70 caractères espaces compris. Elle doit décrire donc en quelques mots le contenu de votre page.
Il s'agit d'une balise essentielle dans le cadre du référencement naturel ; tous les spécialistes du référencement sont d'accord sur ce point.

La balise H1

Le contenu de la balise H1 doit aussi être soigné puisqu'il s'agit du titre principal de la page mais ce contenu participe également au référencement naturel de celle-ci.

Référencer d'autres types de contenu

La page web n'est pas forcément la réponse la plus pertinente à la recherche d'un internaute. L'url d'une page peut aussi ressortir via une image, une vidéo !
Pour que chaque image de votre site soit référencée dans les résultats "images" il suffit d'utiliser l'attribut ALT dans la balise IMG !

Pour les vidéos et les fichiers audio il est préférable d'intégrer la balise VIDEO / AUDIO dans le conteneur FIGURE avec une légende (balise FIGAPTION).
Retour menu