Les Twitter Cards sont des protocoles qui vous permettent d’attacher des photos, des vidéos et autres médias interactifs à vos tweets afin d’amener du trafic vers votre site.


Twitter fournit une large gamme de cartes. De plus, les Twitter Cards peuvent être intégrées à votre page web avec quelques lignes d’HTML. Les utilisateurs renvoyant vers votre contenu avec un tweet auront une carte ajoutée à celui-ci, qui sera visible par tous leurs followers.


Les Twitter Cards représentent un bon partenaire dans votre stratégie SEO car elles permettent d’améliorer votre engagement, d’augmenter votre taux de clic et vos conversions. Les Twitter Cards peuvent ainsi accélérer la portée de votre contenu sur les réseaux sociaux et développer votre image et votre SEO.


Il y 5 différents types de Twitter Cards :

  • Summary Card,
  • Summary Card with large image,
  • Player Card,
  • App Card,
  • Lead Generation Card.


Mais les plus importantes sont Summary CardSummary Card with large image et App Card.


Mis en place des Twitter Cards sur votre site


Summary Card

La Summary Card peut être utilisée pour les publications de blog, les actualités, les pages produit ou tout autre actualité d’entreprise. Ce genre de carte a pour but d’offrir un aperçu de votre contenu en affichant votre titre, description et votre miniature d’image.


Les exigences :

  • Titre : 70 caractères
  • Description : 200 caractères
  • Image : au moins 120×120 pixels et pas plus de 1MB


Pour l’ajouter à votre site, vous devez coller ce code dans l’HTML de votre page web :

<meta name=”twitter:card” content=”summary” />
<meta name=”twitter:site” content=”@tonsite” />
<meta name=”twitter:title” content=”Ton Titre” />
<meta name=”twitter:description” content=”Description.” />
<meta name=”twitter:image” content=”https://domaine.com/name_image.jpg” />


Summary Card with large image

Ces cartes fonctionnent exactement de la même manière que la Summary Card excepté au niveau de la taille de l’image. Elles permettent de faire figurer une image plus captivante dans toute sa largeur afin de mieux attirer les utilisateurs sur votre site.


Exigences :

  • Titre : 70 caractères
  • Description : 200 caractères
  • Image : au moins 280 x 150 pixels et pas plus de 1MB


Ajoutez ce code HTML pour mettre en place cette Twitter Card :

<meta name=”twitter:card” content=”summary_large_image”>
<meta name=”twitter:site” content=”@tonsite”>
<meta name=”twitter:creator” content=”@yourtwitterhandle”>
<meta name=”twitter:title” content=”Ton titre”>
<meta name=”twitter:description” content=”Description.”>
<meta name=”twitter:image” content=”https://domain.com/name_image.jpg“>


App Card

Les App Cards peuvent être utilisées pour promouvoir des applications mobiles et augmenter ainsi leur installation. Cette carte souligne le nom, la description, l’icône, le classement et le prix. Twitter peut utiliser les identifiants de votre application pour obtenir ces informations.


Exigences :

  • Titre : prise de l’identifiant de l’application
  • Description : 200 caractères
  • Image : le logo de l’application prise via l’identifiant – l’image devrait être au moins de 800×320 pixels et peut être en format JPG, JPEG, PNG ou GIF. Les images en dessous de 1MB sont préférées.


Ajoutez ce code HTML pour mettre en place cette Twitter Card :

<meta name=”twitter:card” content=”app”>
<meta name=”twitter:site” content=”@tonsite”>
<meta name=”twitter:description” content=”Description”>
<meta name=”twitter:app:country” content=”Ton Pays”>
<meta name=”twitter:app:name:iphone” content=”Nom de l'app iphone”>
<meta name=”twitter:app:id:iphone” content=”ID de l'app iphone”>
<meta name=”twitter:app:url:iphone” content=”URL de l'app iphone”>
<meta name=”twitter:app:name:ipad” content=”Nom de l'app ipad”>
<meta name=”twitter:app:id:ipad” content=”ID de l'app ipad”>
<meta name=”twitter:app:url:ipad” content=”URL de l'app ipad”>
<meta name=”twitter:app:name:googleplay” content=”Nom de l'app dans google play”>
<meta name=”twitter:app:id:googleplay” content=”ID de l'app dans google play”>
3643 vues
Modifié le 05 novembre 2019
Publicité Sitedudev
Cette pub permet au site de vivre ...
Publicité
Cette pub permet au site de vivre ...
Voir d'autres articles
2 898 vues
Personnaliser sa bare de menu avec du CSS
Après avoir modifié notre barre de menu nous allons maintenant personnaliser notre barre de menu avec du CSS afin de la rendre plus agréable à regarder.Nous allons pour ça ajouter un nouveau...
Créer son site de rencontres
3 192 vues
Comment faire connaitre son site ?
L'un des derniers points qui n'est pas sans conséquence est la promotion de son site après l'avoir mis en ligne sur un hébergeur (OVH, 1and1, Hostinger, etc.).L'une des questions que...
Créer son site
1 131 vues
Propriétés CSS : comprendre les différentes propriétés et leurs valeurs
Propriétés CSS : Comprendre les différentes propriétés et leurs valeursLes propriétés CSS sont des instructions qui contrôlent l'apparence et le comportement des éléments HTML sur une page...
CSS
2 308 vues
Installer SASS sur votre système
Installation de SASS sur votre système1. Installer Node.js :SASS nécessite Node.js pour fonctionner. Si vous ne l'avez pas déjà installé, téléchargez et installez Node.js à partir du site...
Sass
4 677 vues
Le langage CSS
Le CSS permet de concevoir le design de votre site web. Le CSS agit sur des éléments HTML.On peut intégrer le CSS de deux façons :Directement sur les éléments de votre HTML,Mettre le...
Créer son site
5 388 vues
Le langage HTML
Avant de commencer cet article nous allons commencer par un rappel.Rappel : Pour développer en HTML, il faut utiliser n'importe quel éditeur de texte et enregistrer le fichier au format .html afin...
Créer son site
967 vues
Comprendre le rôle de JavaScript dans le développement web
Le rôle de JavaScript dans le développement webJavaScript est un langage de programmation qui joue un rôle crucial dans le développement web moderne. Il est largement utilisé pour rendre les...
JS
3 805 vues
Afficher les commentaires
Nous allons reprendre notre page topic.php. Sur cette page nous allons afficher les commentaires postés de vos utilisateur.Dans notre page topic.php nous allons donc afficher les...
Créer son site
Publicité
Cette pub permet au site de vivre ...