Tag HTML Meta expliqué avec des exemples

Tag HTML Meta expliqué avec des exemples
Dans HTML, une étiquette Meta contient les informations sur une page particulière. Le méta-tag est nommé d'après métadonnées Ce sont des données sur les données: par exemple, Linuxhint fournit une vaste gamme de tutoriels et de guides pour les amateurs de calcul. Cependant, les informations / données sur Linuxhint seront fournies par les méta-tags. Ces informations sont pour les utilisateurs et les moteurs de recherche pour les guider sur l'objectif ou les connaissances de base sur cette page.

Les méta-tags sont déclarées à l'intérieur de l'étiquette de tête d'un document HTML et ne sont pas visibles sur la disposition Web de cette page. Cependant, les méta-tags de n'importe quelle page Web peuvent être vérifiées en utilisant le raccourci clavier Ctrl + u ou cliquez avec le bouton droit à n'importe quel endroit sur une page Web et accédez à Afficher la source de la page option.

Voici les résultats d'apprentissage de ce guide:

  • L'importance des méta-tags
  • Types de méta-tags HTML
  • Utilisation de méta-tags dans un document HTML avec des exemples

Pourquoi les méta-tags sont importantes

Certains d'entre vous pourraient explorer le but et l'importance des méta-tags. Cette section donne un aperçu approfondi de l'importance des méta-tags. Les méta-tags sont l'acteur clé de l'optimisation des moteurs de recherche d'une page Web. Les méta-tags sont utilisées par les navigateurs et les moteurs de recherche pour filtrer le contenu en fonction de la recherche effectuée par n'importe quel utilisateur. De plus, les mots clés utilisés dans les méta-tags permettent aux navigateurs Web de classer la page HTML spécifique.

Plusieurs navigateurs bien connus comme Chrome, Firefox, Edge, Safari et Opera prennent en charge les méta-tags. En pratiquant des méta-étiquettes appropriées, on peut obtenir les résultats suivants:

  • Impact positif sur le nombre d'utilisateurs visitant la page Web
  • L'engagement et le trafic d'une page Web peuvent être augmentés

Types de méta-tags

Avant de passer à l'usage, jetons un œil aux différents types de méta-tags qui pourraient être utilisés dans une page Web.

  • Titre: La balise de titre d'une page HTML est utilisée pour afficher le but de cette page en quelques mots.
  • Description: Comme son nom le dirige, il fournit une information courte et précise sur une page HTML. Un moteur de recherche affiche la description de la page Web sous le titre.
  • Révision: Une date de révision d'une page spécifique peut être définie pour montrer que vous mettez à jour le contenu avec le temps.
  • Rafraîchir: Une page peut être rechargée automatiquement en utilisant cette balise Meta.
  • Réorienter: On peut rediriger la page vers d'autres pages.
  • Auteur: Le nom de l'auteur peut être spécifié à l'aide de cette balise.
  • Charset: Le jeu de caractères est requis par le navigateur et cette tag de méta est utilisée pour définir le jeu de caractères utilisé dans un document HTML.
  • fenêtre: Cette balise Meta définit la taille et l'échelle de zoom d'une page HTML.

Comment les méta-tags sont utilisés

De la section ci-dessus, vous auriez parcouru les informations de base des méta-tags HTML. Ici, nous avons fourni quelques exemples qui démontrent l'utilisation des méta-tags indiquées ci-dessus:

Titre: Le titre d'un document HTML donne un aperçu en quelques mots. Le titre d'un document HTML s'affiche en haut du navigateur Web comme indiqué dans l'image ci-dessous:

Une méta-tag de titre peut être créée à l'intérieur de l'étiquette de tête d'un document HTML. Par exemple, nous avons créé un méta-tag de titre comme indiqué dans l'image suivante:

Description: Une description courte et au point d'une page HTML est fournie en utilisant la balise de description. L'image suivante montre l'utilisation des balises de description. Il est recommandé d'écrire une description de jusqu'à 160 caractères.

Révision: Cette méta-tag est utilisée pour indiquer la date de mise à jour de la page. Il est recommandé de mettre à jour votre contenu fréquemment et d'utiliser cette balise pour afficher la date de la mise à jour récente. Cela aiderait à classer votre page HTML. L'image suivante montre que, le 1/1/2022, le contenu de cette page a été mis à jour:

Rafraîchir: Pour un rafraîchissement automatique, cette étiquette de méta peut être utilisée pour spécifier la limite de temps pour un rafraîchissement automatique. Dans l'image suivante, le temps de refroidissement automatique est défini sur 11 secondes:

De plus, la même balise Meta peut être utilisée pour spécifier l'URL dans l'attribut de contenu. Votre page sera redirigée vers cette URL une fois la limite de temps spécifiée atteinte. Par exemple, l'image suivante montre que la page sera redirigée vers www.linuxhint.com après 8 secondes:

Auteur: Un site Web comprend plusieurs pages HTML et ces pages peuvent être construites par plusieurs auteurs. Pour donner des crédits, le nom de l'auteur peut être défini dans la balise Meta. Par exemple, l'image suivante montre que l'auteur de cette page est Mike Anroz:

Charset: La plupart des navigateurs utilisent UTF-8 pour coder les caractères sur une page Web. Cependant, on peut utiliser ASCII, mais il a été remplacé par UTF-8. Chaque fois qu'une méta-tag HTML est démarrée dans un éditeur HTML comme le texte sublime et le code vs, vous verriez qu'il définit automatiquement le jeu de caractères sur UTF-8:

Fenêtre: La fonctionnalité de la fenêtre vous permet d'obtenir votre page HTML compatible avec plusieurs appareils. UN charbon et fenêtre Les méta-tags sont appelées par défaut dans plusieurs éditeurs HTML comme le texte sublime. Le fenêtre est utilisé ici et l'image suivante montre l'échelle de taille et de zoom de l'image HTML:

Conclusion

Les étiquettes Meta aident à obtenir le contenu de manière facile et efficace. Bien que ces étiquettes ne soient pas visibles, cependant, ils agissent comme des joueurs fantômes en référencement. Cet article contient la démonstration de plusieurs méta-tags utilisés dans un document HTML. Après avoir suivi ce guide, vous obtiendrez une compréhension de base de divers types de méta-tags, leur importance et comment les utiliser sur une page HTML.