Improve links to your site on Twitter with Twitter Cards

// Announced since last July, Twitter Cards is Twitter’s equivalent (or “answer” if you like tech drama) to the Open Graph. By defining a set of #meta #tags in your #HTML code you can provide instructions to #Twitterin order to display an “expanded” preview of your page, when your page’s URL is included in a tweet.Twitter Cards come in 3 types:
summary: The default card, which includes a title, description, thumbnail image, and Twitter account attribution.
photo: A Tweet sized photo card.
player: A Tweet sized video/audio/media player card.

Basically, you can use the first for article pages (think of blogs), the second for pages where the main content is a photo (e.g. Instagram) and the third one for pages of videos (e.g. YouTube).

The structure of the meta tags are similar to #OpenGraph and you can read about it in the official documentation (http://bit.ly/twittercards). While Twitter re-invented the concept of meta tags for describing a page for social media consumption, they acknowledged that having duplicate meta tags is kind of silly, so if you already have the OG tags of title, image, url and description in your code, they will be recognised for their twitter equivalents (you still need to add a couple of twitter tags though).

The feature is still in development, simply adding the tags on your site will not do anything yet. You need to submit a form (http://bit.ly/t-cards-form) asking to be included in the beta.  Twitter promisses to respond to you in “a few weeks”. Until then, you can try out your page on the preview tool (http://bit.ly/t-cards-preview). If you have a WordPress blog, you can use the Twitter Cards plugin (http://bit.ly/wp-twitter-cards) which does (almost all of) the job for you.

If you have gone through the process and can share some feedback on how this worked for you, post in the comments :)

Tags: , , , ,