Social media networks can be a significant traffic driver to a website, so it is always in your best interest to optimise your presence on them by adding Open Graph tags to your pages.

So what is Open Graph?

"Open Graph enables any web page to become a rich object in a social graph." - This is how the OGP website explains it anyway! - Don't worry; we were confused, too, initially. In simple terms, Open Graph is a way to define 'things' in a digital space. It allows you to tell social media networks like Facebook, Twitter, Pinterest, LinkedIn and Google+ what information to display whenever you or anyone else shares a link from your site.

The below example shows how a Facebook Share item looks on Facebook when shared... But the HTML on the page has these Meta properties which tell Facebook, YouTube etc., which image to use for the main idea, what the title should be and what the caption text should be...

What are the key Open Graph tags?

og:title - That is the title of your page for the Open Graph. There are no specific recommendations, but you should respect the 65 characters if you do not want your title to be truncated. It works the same as the meta title tag, and if Facebook does not find the og:title, it will just use your title tag. Remember that it must be appealing to optimise your click-through rate.

og:type - This tag specifies your page type (website, article, video, music..) and describes the primary type of subject on your page. The list of possibilities is very long, so that you can check it out here.

og:image - This is your URL image that will be displayed in the Open Graph. It is beneficial as you can choose which thumbnails will be displayed and avoid unrelated photos. It, moreover, helps to increase your conversion rate. Indeed, picture marketing is something you should consider since a great picture is worth 1,000 words.

og:url - That is the canonical URL of your page. Most of the time that is just the URL displayed on your page, but it can be helpful if different dynamic URLs are linked to the same page.

og:description - A snippet of your page should contain between 150 and 200 characters (Facebook can display up to 300 characters) and describe your page content. It works the same as the meta description tag, but it will not affect your SEO, so do not lose time optimising your keywords but try to write something compelling.

To learn more about how structured data and more complex OG parameters could help your website, please read more on the official OG website.