Design
30th June 2015 | By:

An Introduction to Metadata [PART 3]

In part 2 of An Introduction to Metadata, we looked at how we can integrate metadata from web pages with social media. In particular, we looked at how this can be achieved with Facebook, but there’s another social media platform also doing something similar – Twitter.

Twitter calls them “Twitter Cards” and much like Facebook’s Open Graph protocol, it is designed to help drive user engagement with your website through the use of rich media objects and much like the Open Graph protocol, it is relatively easy to implement. All it requires is adding a few lines of HTML code to your website.

example

Twitter has four different types of cards depending on the type of content in question.

Summary Card – This consists of the title, description, thumbnail and twitter account attribution.
Summary Card with a Large Image – This is the same as a summary card although with an accompanying feature image.
App Card – The app card is used to detail mobile applications with a download link.
Player Card – The player card is for any kind of media content such as video or audio.

Fortunately, with it’s similarity to the Open Graph protocol, you can actually share the same meta tag that Open Graph uses, so to avoid creating duplicate/extra meta tags. When Twitter’s card processor checks your web page, it first looks for the relevant “twitter” property. If it can’t find one, it will fall back to the also supported Open Graph property. While Twitter’s parser looks for meta tags declared with “name”, it can fall back to use “property” as well.

full

To find out more about how Twitter Cards are viewed, check out Twitter’s website.

Another feature that both Twitter Cards and the Open Graph protocol share, is the ability to track analytics of your cards, allowing you to monitor and improve key metrics such as URL clicks, retweets and app install attempts, helping you to better promote yourself and maximize your exposure online.

your_snapshot_0

References
https://dev.twitter.com/cards/overview

Tags: , , ,

Leave a reply

Your email address will not be published. Not now, not ever. Required fields are marked *

Comments


You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Name
Email
Website