Open Graph Meta Tags
Open Graph meta tags are special HTML tags added to a webpage to control how content appears when shared on social media platforms like Facebook, LinkedIn, and X (formerly Twitter). They were originally introduced by Facebook through the Open Graph protocol, which is now widely adopted across social networks.
These tags allow you to define the title, description, image, and URL that will show up in a social media post preview. Without Open Graph tags, platforms may pull random or incomplete data, which can lead to unattractive or misleading previews.
Why Open Graph tags matter
Open Graph meta tags help you:
- Control how your content looks on social media
- Make your shared links more engaging and clickable
- Improve click-through rates (CTR) from social traffic
- Ensure brand consistency in link previews
- Reduce the chance of incorrect or missing preview info
They don’t directly affect your SEO rankings, but they improve visibility and engagement, which can indirectly support your SEO goals.
Common Open Graph meta tags
Here are the most commonly used Open Graph tags:
| Tag | Purpose |
|---|---|
og:title | Sets the title shown in the social media preview |
og:description | Short summary of the content |
og:image | URL of the image to display |
og:url | Canonical URL of the page |
og:type | Type of content (e.g., website, article, video) |
og:site_name | Name of your site or brand |
HTML example of Open Graph meta tags
<meta property="og:title" content="10 Simple SEO Tips for Beginners">
<meta property="og:description" content="Learn how to boost your website traffic with these beginner-friendly SEO tips.">
<meta property="og:image" content="https://example.com/images/seo-tips.jpg">
<meta property="og:url" content="https://example.com/seo-tips">
<meta property="og:type" content="article">
<meta property="og:site_name" content="SEO Academy">
These tags ensure your page displays correctly when shared on Facebook, LinkedIn, and other platforms that use Open Graph data.
Best practices for Open Graph tags
- Always use absolute URLs for
og:imageandog:url - Choose a clear, eye-catching image (at least 1200×630 pixels)
- Match the
og:titleandog:descriptionto your page content - Use one set of OG tags per page
- Test how your content appears using the Facebook Sharing Debugger
- Add Twitter Cards as a complement for better sharing on X (Twitter)
In summary, Open Graph meta tags help control how your website content is displayed when shared on social media. They don’t directly impact your SEO rankings, but they play a big role in engagement, visibility, and making sure your content looks polished and professional when shared online.