Optimisation des Balises Méta en HTML

Les balises de la zone d'en-tête
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Cours HTML5 et CSS3 / Part 1
Revoir le teaser Je m'abonne
5,0
Transcription

39,90€ Je commande

À partir de
27€ /mois
Je m'abonne à Elephorm

Description Programme Avis
5,0
39,90€ Je commande

À partir de
27€ /mois
Je m'abonne à Elephorm

Les objectifs de cette vidéo sont de :

  • Comprendre l'importance des balises méta dans une page HTML
  • Savoir utiliser les balises méta pour optimiser le référencement
  • Identifier les balises méta obligatoires et leurs usages spécifiques

Cette leçon explore les balises méta essentielles dans une page HTML, obligatoires pour un bon référencement et comment les utiliser efficacement.

Cette leçon revient sur les fondamentaux des balises présentes dans la zone d'entête (head) d'un document HTML. Nous abordons les différentes balises méta, leur utilité et leur impact sur le référencement et la lisibilité d'une page web par les moteurs de recherche.

Nous détaillons d'abord la balise title, qui est indispensable, ainsi que la balise méta avec l'attribut charset='utf-8'. Ensuite, nous explorons les différentes balises méta pour les métadonnées telles que description, keywords (obsolète), et content-language. Enfin, nous traitons de la balise meta name='robots', essentielle pour contrôler l'indexation par les moteurs de recherche.

Pour chaque balise, des exemples pratiques d'utilisation sont fournis pour mieux comprendre leur application et leur importance dans la structuration d'une page HTML.

Voir plus
Questions réponses
Qu'est-ce qu'une balise méta Description et à quoi sert-elle ?
La balise méta Description permet de fournir une brève description du contenu d'une page web, souvent utilisée par les moteurs de recherche pour afficher un extrait sous le lien du site dans les résultats de recherche.
Pourquoi la balise méta Keywords est-elle considérée comme obsolète ?
La balise méta Keywords est considérée comme obsolète car les moteurs de recherche modernes ne l'utilisent plus pour le référencement, rendant son utilisation inutile.
En quoi la balise méta robots est-elle utile lorsqu'un site est en phase de développement ?
La balise méta robots est utile en phase de développement pour empêcher les moteurs de recherche d'indexer des pages incomplètes ou erronées, assurant que seules les pages finales soient référencées.
Nous allons revenir presque sur ce que nous avons vu au début, c'est-à-dire nous allons revenir sur la partie de la zone head, d'entête, pour pouvoir travailler, voir, vérifier, étudier les différentes balises que l'on peut y placer. Alors dans cette zone d'entête, il y a, comme je vous le disais, la balise title, qui est obligatoire, et puis la balise méta, donc avec chart7 égale utf-8. Mais il y a d'autres balises méta, car elles servent à placer des métadonnées dans une page HTML. Les métadonnées sont des renseignements qui appartiennent à la page, mais qui ne se voient pas par l'internaute, tout simplement. Donc ce sont des données supplémentaires. Les métadonnées d'une page web sont précisément utiles pour le référencement, pour le navigateur qui lire à la page, c'est le cas par exemple de utf-8, le navigateur sait que c'était encodé en utf-8, pour les moteurs de recherche, et puis globalement pour tous les outils susceptibles de les utiliser, tout simplement. Alors il y a deux types de métas, les métas avec l'attribut HTTP et Keev, et les métas avec l'attribut Name, et puis celui que l'on a situé ci-dessous. Alors par exemple, il y a un méta relativement utile, qui est le méta même, qui s'appelle Description. Donc méta, Name. Petite parenthèse, le méta avec chart7 utf-8, c'est en fait un méta de type avec l'attribut HTTP et Keev, mais qui n'est plus utile d'écrire aujourd'hui. Nous le reverrons peut-être éventuellement par la suite. Alors méta, Name égal, Description. Donc c'est la description de notre site, et Content, et bien c'est une phrase qui décrit, décrivant, notre site. C'est ce que vous pouvez voir parfois, alors pas toujours, mais ce que vous pouvez voir parfois dans le résultat de la recherche d'un moteur de recherche. Il y a une courte phrase située sous le lien URL, et bien c'est cette phrase généralement. Alors ça peut être autre chose, ça peut être également le début de la page, la première ligne de la page, peut-être un tas d'autres choses, mais il n'est pas inutile d'écrire cette petite méta, Name. Alors il existe un autre méta, Name, dont je vous parle parce que beaucoup l'utilisent, mais qui est devenu totalement obsolète aujourd'hui. Donc je vais l'écrire, mais je vais très vite l'effacer. Donc Meta, Name, égal, Keywords. Donc celui-là, avec un Content, et puis égal, différentes choses. Celui-là aujourd'hui n'est plus utilisé par les moteurs de recherche, il fut très utilisé, donc c'est la raison pour laquelle de nombreux webmasters continuent à l'utiliser, mais en fait il ne sert pratiquement à rien par rapport au référencement. Vous pouvez éventuellement le mettre, ça ne coûte rien, sachez qu'il n'est pas utile pour le référencement. Quelque chose qui peut être utile par rapport à certains moteurs, si votre site est principalement visible sur des pays étrangers, c'est de préciser la langue. Donc c'est un méta. Et cette fois-ci, ce n'est pas un Name, c'est HTTP Equiv. Equiv égale Content-Language et puis Content, on va lui mettre la langue que vous voulez, mais on pourrait mettre nous, fr. Voilà, donc ça c'est un méta qui est relativement intéressant si votre site est souvent regardé dans un pays étranger et que vous l'avez malgré tout laissé en langue française. Globalement, on a fait à peu près le tour des éléments méta intéressants. Il reste notamment une méta, une balise méta, que vous pourriez utiliser, qui s'appelle MetaName égale robots, qui s'adressent aux petits robots des moteurs de recherche. Globalement, les moteurs de recherche ont des logiciels, des programmes qui parcourent le web, qui parcourent les serveurs sans arrêt et qui indexent les différentes nouvelles pages, différents mots, différentes images des nouvelles pages qu'ils rencontrent. Cette MetaName s'adresse à ces différents robots. Par exemple, vous pourriez lui dire qu'il n'indexe pas. Ça ne sert à rien de lui dire de l'indexer puisque, de toute façon, il indexe d'office. Ce qui peut être intéressant, c'est de lui dire, en content, nos index. C'est un choix, vous pourriez très bien décider que cette page-là ou que ces pages-là ne sont pas indexées. Peut-être dans la phase de travail, de création de site, si vous l'avez mis en ligne, vous ne souhaitez pas qu'il indexe des choses qui pourront être erronées dans quelques temps. Donc ça, c'est une possibilité. On peut également lui dire, à partir de là, je ne veux pas que les liens soient poursuivis. Donc, no follow. Ne poursuis pas les liens qui sont dans cette page. Ça peut être intéressant également, vous réalisez une page d'index dans votre site, mais vous n'avez pas terminé le site encore. Seule la page index est terminée. Vous estimez qu'elle est suffisamment belle et suffisamment explicite pour les futurs internautes, qu'elle fait bien comprendre ce que contiendra votre site. Et bien, à ce moment-là, s'il y a un lien, s'il y a des choses, vous pouvez spécifier au robot que ce n'est pas la peine qu'il continue pour l'instant, en tout cas. Voilà, globalement, on a fait à peu près le tour de ces balises. Il y en a bien d'autres. Forcément, vous pouvez aller voir dans les différents codes des sites quelles sont celles utilisées. Nous avons vu globalement les plus intéressantes et les plus utiles.
8 commentaires
5,0
8 votes
5
4
3
2
1
Polyores
Il y a 11 months
Commentaire
Bravo et bravo encore. Belle méthodologie. Hâte de voir la suite de la démystification du Html
ralahoul
Il y a 1 year
Commentaire
Une formation très intéressante et très bien construite.
eric.gk78
Il y a 3 years
Commentaire
excellent, compréhensible pour les débutants
alexwebtv
Il y a 3 years
Commentaire
Très bonne formation .
gabamano85
Il y a 3 years
Commentaire
Très belle présentation et facile à comprendre même pour un novice.
olivier_89
Il y a 3 years
Commentaire
explication très organisée et simple de comprendre pour les débutants
a.platiau_1
Il y a 3 years
Commentaire
Super formation. Très claire et très bien organisée.
ezerrou
Il y a 3 years
Commentaire
est ce la 2éme partie existe sur ce cours?
Nos dernières formations XHTML/CSS
  • Créer un site web avec HTML/CSS
    Découvrir
    Avant d'apprendre à développer et mettre en ligne votre propre site Internet, il est important de bien connaître les bases du HTML et du CSS. Dans cette formation en vidéo et cours en ligne, vous découvrez ce qu'est le HTML et CSS ? Le fonctionnement des sites web ainsi que la structure d'une page HTML.  Vous êtes guider pas à pas pour apprendre à intégrer des images, de l'audio et des vidéo. Vous apprenez à gérer et ajuster les polices en CSS, à comprendre la structure du CSS, les tableaux, boutons et formulaires en CSS.  Vous suivez la méthodologie de mise en page CSS et à styliser une page web avec le CSS. Formation pratique vous créez et stylisez les éléments principaux d'un site web avant de mettre en ligne et indexer un site, d'ajouter des éléments graphiques en CSS et d'animer un site en CSS
    16h20 14 leçons
  • Apprendre CSS 3
    Découvrir
    14h58 172 leçons 4,50 / 5
  • Apprendre HTML 5 - Les fondamentaux
    Découvrir
    Maîtriser les fondamentaux du language HTML5.
    5h11 101 leçons 3,67 / 5
  • Maîtriser Materialize CSS - Le framework pour le Material Design
    Découvrir
    Maîtriser le framework Materialize CSS pour faire du Material Design
    2h22 20 leçons
  • Maîtrisez les Flexbox CSS - La mise en page responsive
    Découvrir
    Maîtriser la mise en page grâce à la flexbox issue du CSS 3
    46min 9 leçons 4,33 / 5