Published on 13/01/17 by Kieran Stott
Control how your content looks on Social Media
Have you ever posted a link as a status update on a social network and found the associated image has nothing to do with the content on the page, or the description is for a totally different product? (Like the below screenshot).
You would probably think twice about sharing it – this limits the small percent of website users who share content on social media even further.
By adding social meta tags to your website or blog, you can improve how your content is displayed on social networks like Instagram, Facebook, Twitter, Google+ and LinkedIn. This will improve social visibility and in turn, traffic to your webpage by making your updates more appealing to users.
For instance, if someone copies a product link from the Sound Travels website to post as their Facebook update, they will see the following:
Example 1: poor/no implementation of social meta tags
This post has major room for improvement in compelling a viewer to click. The main issues with the above post is the lack of image and the headline and description haven’t been optimised to generate clicks. It’s highly likely a user may even hesitate posting this link as there is no defining information about where the link might lead.
We can use the following social meta tags to control exactly what is shown when pasting one of your URLs into the status or sponsored update bars on social media:
- The Title
- The Description
- The Image
Example 2: good use of social meta tags
As you can see below, there is a huge difference between the first and second example. Firstly, we have the correct image for the page posted. We also have the product name and brand in the headline title, as well as a tailored description to the product. This will help attract more shares, click throughs and engagement with the post in general.
Status updates (on Facebook or Twitter for example) which feature an image receive an engagement rate 35% higher than those of just text and no image. Find more research/stats here
Here is a full list of all social meta tags which are recommended implementing, that are sourced from two web protocols:
Open Graph for Facebook:
- og:locale – Optional. Defaults to en_US which is suitable for most English language websites.
- op:type – Optional. If specified, defaults to website. How you describe the kind of object you are sharing: picture, video, blog post etc.
- og:title – How to define your contents title.
- og:description – This is where you describe your content. It’s very similar to the meta description tag in HTML. It’s best to use around 200 characters as Facebook limits length.
- og:url – How you set the URL for the page you are sharing. URL provided is not shown on Facebook, only domain is visible.
- og:image – The full URL for the image you want to display. This is important as a picture always helps content stand out.
- og:site_name – To be used if the page you are sharing is part of a larger network.
Twitter have their own specific card tags:
- Twitter:card – This required tag works similar to og:type; it describes the type of content you are sharing. Options are; Summary, Photo, Video, Product, App, Gallery.
- Twitter:title – Similar to og:title this is the specified title for your article that will appear in bold.
- Twitter:description – This tag is used to write a descriptive lead to the page you are sharing. Create compelling copy that complements your tweet.
- Twitter:url – Exactly the same as of:url this is how you set the URL for the page your sharing.
- Twitter:image – This is how you set the picture to go alongside your Tweet.
The point to using social meta tags is to control the way your content is displayed in feeds, rather than letting the social networks generate the headline, description and image or you. These are our top tips for implementing and using Social Meta Tags, then sharing your page/content on Social Media accounts:
- Tweak the image and content based on the network. Display images and text that will appeal to the interests of each networks audience.
- You can use Open Graph and Twitter Card tags to test different versions of an image.
- Title, Description and Image are the most important meta tags and should be in place as a minimum. These should describe your content as appealing as possible.
This is what social meta tags look like in HTML, once you have implemented them on your website:
Do these tags impact SEO and Organic/Natural Website Traffic?
There is no direct benefit to SEO from using social meta tags, but there is an indirect advantage. If your content is being shared and clicked on more as a result of using these tags you are more likely to generate natural backlinks from other sites to your content. Which in turn is a stronger ranking signal to search engines.
So in conclusion, Meta tags aren’t just for search engines and adding this code to your website won’t improve sales directly. Social media sites are also using them just like you would optimise meta data for Google rankings, you need to do the same for Facebook and Twitter to get the most benefit from your content. You should now have everything you need to take full advantage of social meta tags and start optimising shares and click-throughs from social media to your website.
Not sure of where to start with implementing or optimising social media meta tags? Click here to drop us an email.