CrispUtils

Générateur de balises meta et Open Graph

Rédigez les balises qui décident de l'apparence de votre page dans les résultats de recherche et lors d'un partage, avec des compteurs qui préviennent avant que le titre soit tronqué et un aperçu qui se met à jour à la frappe.

1200×630 pixels fonctionne partout.

Aperçu du résultat de recherche
Balises générées
Votre fichier est traité par votre propre navigateur. Rien n'est envoyé, stocké ni journalisé.

Deux courts textes font l'essentiel du travail pour qu'une page soit cliquée : le titre affiché dans les résultats de recherche et la description en dessous. Trop longs, ils sont coupés en plein milieu ; absents, le moteur en invente à partir du contenu de la page, en général mal.

Les balises Open Graph font le même travail pour les liens partagés dans les messageries et sur les réseaux sociaux. Sans elles, un lien partagé n'est qu'une URL nue ; avec elles, il devient une carte avec un titre, un résumé et une image. Cet outil génère les deux jeux de balises, plus les équivalents Twitter Card, et montre le résultat à la frappe.

Comment utiliser cet outil

  1. Rédigez le titre. Visez 30 à 60 caractères — le compteur passe à l'orange en dehors de cette plage, car au-delà de 60 le titre est souvent tronqué.
  2. Rédigez la description. La plage utile va de 70 à 160 caractères ; elle n'influence pas directement le classement, mais beaucoup le taux de clic.
  3. Ajoutez l'URL canonique. Elle indique aux moteurs quelle version de la page fait autorité, ce qui devient important dès que vous utilisez des paramètres UTM.
  4. Ajoutez une image Open Graph. 1200×630 pixels est la taille standard, et les balises la supposent.
  5. Vérifiez l'aperçu, puis copiez le bloc généré dans le <head> de votre page.

Exemple concret

Une fiche produit

Le titre Sac de voyage en cuir — fabriqué à Florence fait 43 caractères, il passe donc entier. La description nomme la matière, l'atelier et le délai de livraison en 140 caractères. L'image Open Graph est la photo du produit : le lien s'affiche en carte quand un client l'envoie à un ami.

Réparer un lien partagé qui s'affiche mal

Un article de blog partagé dans une conversation n'affiche que l'URL. Ajouter og:title, og:description et une image og:image en 1200×630 le transforme en vraie carte. La plupart des plateformes gardent l'ancien rendu en cache : utilisez leur outil de débogage pour forcer une actualisation.

Cas d'usage courants

  • Nouvelles pages d'un site dépourvu de balises meta
  • Pages d'atterrissage créées pour une campagne
  • Articles de blog destinés à être partagés
  • Fiches produits dont la description déclenche le clic
  • Réparer un lien dont l'aperçu est raté dans les messageries
  • Ajouter un noindex à des pages de recette ou de remerciement

Erreurs fréquentes

  • Le même titre sur toutes les pages — Des titres identiques sur tout un site gaspillent le signal on-page le plus fort. Chaque page a besoin du sien.
  • Bourrer le titre de mots-clés — Cela se lit mal pour un humain, ce qui réduit les clics, et les moteurs réécrivent souvent les titres qu'ils jugent peu utiles — vous perdez alors totalement la main.
  • Une image Open Graph au mauvais format — Tout ce qui s'éloigne de 1200×630 est recadré de façon imprévisible. Éloignez les détails importants des bords.
  • Compter sur la balise meta keywords — Aucun grand moteur ne l'utilise depuis bien plus de dix ans. Elle ne sert à rien.

Questions fréquentes

Quelle longueur pour un titre ?

Entre 30 et 60 caractères. Les moteurs mesurent une largeur en pixels plutôt qu'un nombre de caractères, la coupure exacte varie donc, mais 60 reste une limite de travail sûre. Placez les mots distinctifs en premier au cas où il serait tronqué.

La meta description influence-t-elle le classement ?

Pas directement. Elle influence le taux de clic d'un résultat déjà classé, ce qui vaut beaucoup. Rédigez-la comme une accroche publicitaire : dites ce que la page apporte au lecteur.

Pourquoi mon lien s'affiche-t-il encore avec l'ancienne image ?

Les plateformes sociales mettent les données Open Graph en cache de façon agressive. Utilisez leur outil de débogage ou d'inspection de partage pour forcer une nouvelle lecture après modification des balises.

Faut-il à la fois des balises Open Graph et Twitter Card ?

X retombe sur l'Open Graph quand les balises Twitter sont absentes, vous pouvez donc strictement les omettre. Inclure les deux coûte quelques lignes et donne un contrôle explicite, c'est pourquoi ce générateur produit les deux.

À quoi sert la balise canonique ?

Elle désigne l'URL qui fait autorité pour une page. Elle compte dès que le même contenu est accessible à plusieurs adresses : avec et sans barre oblique finale, avec des paramètres UTM, ou avec des paramètres de tri et de filtre.

Quelque chose est-il envoyé à un serveur ?

Non. Tout est généré dans la page, ce qui est pratique quand vous travaillez sur une page non annoncée ou sur le site d'un client qui n'est pas encore en ligne.

Dernière mise à jour 2026-09-15