OG image stands for the Open Graph image. The Open Graph was created to standardize the use of metadata within a webpage to represent the content of a page.
OG image stands for the Open Graph image. The Open Graph was created to standardize the use of metadata within a webpage to represent the content of a page. So we can set for instance
og:description and of course
OG image tag is important because this is a picture which is visible when sharing your website across many social networks (Facebook, Twitter, Linkedin), and apps. Therefore, optimizing its presentation can be crucial for somebody’s interest or even decision to click on the link you shared. Having today’s world in mind, how can you grab someone’s attention in a fraction of a second?
What can you do to grab the reader’s attention?
It’s not an easy task to grab the reader’s attention on social media. That’s why a unique image representing your website is exactly what you need. Sharing your page without an OG image will result in a boring grey box on social media feed or randomly chosen pictures.
Good OG image should not only be eye-catching but should also be relevant to the content of your website. As mentioned before, an OG image should be unique – having the same stock picture that most readers have already seen thousands of times is not what you need to grab someone’s attention.
What is the perfect OG image size and aspect ratio?
As mentioned before, an OG image is used across multiple platforms, however, we cannot select a different picture for each platform. There can only be one OG image assigned to each website. So which is the best size for it?
Recommended OG Image size is 1200 x 630px, which is 1.91:1 aspect ratio. This size will work best not only on Facebook but also on Twitter and LinkedIn. And what about file size? The biggest image you can have varies by platform. Some platforms support images as big as 8MB (Facebook) while others have small max sizes, like 2MB which is the case for LinkedIn or Telegram.
How to add an OG image to your website?
All meta tags should be added inside
<head></head> tag. You can see below an example for
<meta property="og:image" content="https://acclaim.agency/wp-content/uploads/2019/09/Acclaim-OG-Image.png" /> <meta property="og:image:width" content="1200" /> <meta property="og:image:height" content="628" />
Adding OG image on WordPress website
If you’re using WordPress CMS for your website, adding an OG image to your website is super easy. You can do it by using 👉 Yoast SEO plugin 👈
- Choose Yoast Seo Plugin (
SEO) from your left-hand side menu. The
SEOsettings will expand providing you additional options.
- From this menu click on
- Click on
How to check if your OG image works without any problem?
To check if the
og:image we’ve chosen for our website works well, we can use one of the many available OG image testing tools, like 👉 facebook sharing debugger 👈 or 👉 linkedin post inspector 👈. You can just paste your website URL and have a glimpse of how people will see when that link is shared on social media
OG Image is an important element of your social media marketing strategy. A good picture will grab the reader’s attention and will help you to increase your click-through-rates (
CTR). I hope this article will help you to prepare a perfect OG image for Facebook, Twitter or any other platform where you want to share your website.