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”>
3888 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
843 vues
Utilisation de gradients, ombres et transitions pour des effets visuels
Utilisation de Gradients, Ombres et Transitions pour des Effets VisuelsEn CSS, vous pouvez utiliser des gradients, des ombres et des transitions pour ajouter des effets visuels attrayants à vos...
CSS
16 238 vues
Connexion PHP
Après avoir créé notre formulaire d'inscription il nous faut créer un formulaire de connexion afin que nos futurs utilisateurs puissent se connecter au site une fois...
Créer son site
20 280 vues
Créer un profil PHP
Après avoir créé notre page de connexion et notre page d'inscription il est temps de créer un profil pour votre utilisateur !La page profil permettra plusieurs choses ! D'éditer ses informations...
Créer son site
5 222 vues
Qu'est-ce que HTML ?
Cours sur HTML : Qu'est-ce que HTML ?HTML, ou HyperText Markup Language, est le langage de balisage standard utilisé pour créer des pages Web. Il fournit une structure de base pour organiser le...
HTML
3 713 vues
Créer des listes ordonnées <ol> et non ordonnées <ul>
Créer des listes ordonnées avec <ol> et non ordonnées avec <ul>Les balises <ol> et <ul> sont utilisées pour créer respectivement des listes ordonnées et non ordonnées...
HTML
2 601 vues
Envoyer un message sans recharger la page (2/2)
Comme nous avons mis en place notre système en JavaScript / Ajax pour envoyer un message sans recharger notre page en cours nous allons maintenant enregistrer le message + afficher ce dernier dans...
Créer son site de rencontres
2 399 vues
Création de tables avec PhpMyAdmin
1. Accéder à PhpMyAdmin :Ouvrez un navigateur web et accédez à l'URL où vous avez installé PhpMyAdmin sur votre serveur.2. Authentification :Connectez-vous à PhpMyAdmin en utilisant vos...
SQL
18 264 vues
Se connecter à une base de données en PHP
La première étape avant de se lancer dans la conception de son site et de créer une connexion directe avec sa base de données si vous avez besoin de stocker des données par la suite.Nous allons...
Créer son site
Publicité
Cette pub permet au site de vivre ...