Twitter Card : définition et explications

Une Twitter Card est l’aperçu enrichi que X (anciennement Twitter) affiche quand un post contient un lien. Vous la contrôlez avec des balises meta twitter: dans le <head> de la page. Le changement de nom de la plateforme n’a pas modifié le balisage : les balises commencent toujours par twitter:, et la référence du balisage des Cards de X reste la spécification.

Les types de cartes

• summary : une petite vignette carrée à côté du titre et de la description. Le choix par défaut pour les pages sans image forte.
• summary_large_image : une grande image pleine largeur au-dessus du lien. Le choix habituel pour les articles, les produits et les pages de destination.
• player : vidéo ou audio intégré, qui nécessite l’approbation de X.
• app : une carte de téléchargement d’application mobile.

Balisage minimal

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@examplestore">
<meta name="twitter:title" content="Winter Trail Shoes Tested on Ice">
<meta name="twitter:description" content="We ran 200 km on frozen trails. Here’s what gripped.">
<meta name="twitter:image" content="https://www.example.com/img/ice-test-1200x600.jpg">
<meta name="twitter:image:alt" content="Runner on an icy forest trail">

Notez l’attribut : les balises Twitter utilisent name, tandis que les balises Open Graph utilisent property.

Comment X se rabat sur Open Graph

Si une balise twitter:title, twitter:description ou twitter:image manque, X lit à la place la balise og: correspondante. Une page dotée de balises Open Graph complètes n’a donc besoin que d’une ligne supplémentaire, twitter:card, pour choisir la mise en page à grande image. N’ajoutez des valeurs twitter: distinctes que si vous voulez un titre ou une image différents sur X.

Exigences pour l’image

Pour summary_large_image, X recommande un rapport d’aspect de 2:1, avec un minimum de 300 × 157 pixels, un maximum de 4096 × 4096 pixels et un poids inférieur à 5 Mo ; les formats JPG, PNG, WebP et GIF sont pris en charge. Une image de 1200 × 600 est une cible sûre, et une image Open Graph de 1200 × 630 fonctionne aussi, avec un léger recadrage. X a modifié plusieurs fois la quantité de texte affichée par une carte de lien : laissez donc l’image porter le message.

Erreurs courantes

• Pas de balise twitter:card : X peut se rabattre sur un aperçu petit ou basique alors qu’une excellente grande image existe.
• Des images bloquées par le robots.txt. X récupère les images avec son propre robot ; si le robots.txt le refuse, la carte n’affiche aucune image.
• Des chemins d’image relatifs au lieu d’URL https:// absolues.
• Attendre des mises à jour instantanées. X met en cache les données des cartes : les changements peuvent ne pas apparaître tout de suite sur les posts.

Les Twitter Cards aident-elles le SEO ?

Pas comme facteur de classement. Leur valeur tient à la performance de vos liens quand ils sont partagés : une image et un titre clairs obtiennent plus de clics, plus de visiteurs et plus de chances d’être mentionnés et liés ailleurs. Les moteurs de recherche construisent leurs propres extraits à partir de votre meta description et de votre title.

Comment vérifier

X ne propose plus d’aperçu public des cartes dans son validateur : le test le plus simple est donc l’Vérificateur Open Graph, qui prévisualise votre lien sur X, Facebook, LinkedIn, WhatsApp et Slack, valide chaque balise Open Graph et Twitter et contrôle la taille de l’image, sans rien publier.

Questions fréquentes