Social Twitter Card

Do you use meta-tags?

Meta-tags are an essential part of promoting your content on the web, because they can help you boost your search engine rankings and affect the social media traffic on your site. There are Google’s snippet tags, and Facebook and Twitter have their own social media ones, which increase the amount of traffic you are getting.

Twitter Cards

Twitter Cards are great if you want to attach media experiences to tweets which link to your content. They help you richly represent your content within Tweets across the web and on mobile devices.

If you want to stand out from the crowd of tweets, you can use Twitter cards. They function in the same way as Open Graph tags. Apart from the 140-character tweet, they allow you to add some additional content. This adds a “View Summary” button below your tweet and people can click on it.

And when you click it:

There’s a Twitter Card for almost anything:

1. twitter:card

This tag has the same function as the og:type. You can describe the kind of object you are sharing: blog post, video, picture, etc.

There are, however, only 7 options to choose from: summary, photo, video, product, app, gallery, and “large version” summary.

Example:

<meta name=”twitter:card” content=”summary” />

2. twitter:title

It functions like og:title.

This serves the purpose of the meta title tag in your code. It should be appealing, like a good post title. Try not to repeat the same text you have in your tweet in this tag. Use up to 70 characters.

Example:

<meta name=”twitter:title” content=”Your title here” />

3. twitter:description

It functions in the same way as og:description.

This meta data descriptor is very similar to the meta description tag in HTML. Here you describe your content. Unlike a regular meta description tag, it won’t affect your SEO. (So, don’t spend too much time figuring out how to sneak in keywords.) However, it’s a good idea to make it compelling because you want people to click on it. Use about 200 characters.

Example:

<meta name=”twitter:description” content=”Your 200-character description here” />

3. twitter:url

It functions like og:url.

You set the canonical URL for the page you want to share. In other words, you define one page that all your shares will go to. If there is more than one URL for the same content, this comes in handy. .

Example:

<meta name=”twitter:url” content=”http://www.yourdomain.com” />

4. twitter:image

Add a picture to your tweet. You can choose a card with a smaller or a larger picture. If you go for the large option, make sure it has a resolution of at least 280x150px and that the file size is not more than 1MB. You can also add some text to the image to increase its value.

Example:

<meta name=”twitter:image” content=”http://www.yourdomain.com /image-name.jpg” />

How can the Cards be of your benefit?

They are great because they drive traffic and engagement to your site. They’re great for inbound marketing and they can also drive downloads for your apps.