Open Graph

Open Graph, commonly abbreviated as OG, is a metadata protocol used to define how web pages appear on social media platforms and messaging applications. Introduced by Facebook in 2010, Open Graph allows information such as title, description, image, URL and content type to be passed to platforms in a more structured way when a web page is shared. This structure helps website owners better control how their content appears on Facebook, LinkedIn, WhatsApp, Slack and similar environments.

Before Open Graph, when a link was shared on social media, platforms tried to automatically choose a title, description or image from the page content. This automatic selection did not always produce the right result. Sometimes, instead of the main image of the page, the system could select a logo, icon, banner, ad image or a visual that was not closely related to the content. This could make even a high-quality piece of content look weak in the social feed and receive fewer clicks.

Open Graph tags are used to reduce this problem. The website owner can define in advance which title, description and image will appear when the page is shared on social media. For example, when a blog post is shared on Facebook, a specially prepared cover image can be shown instead of a random image from the page. This helps the content appear more professional, understandable and clickable.

Open Graph mainly works through meta tags added to the <head> section of a page’s HTML code. These tags provide structured information about the page to social media platforms and link preview systems. For example, og:title defines the title that will appear in the share preview, og:description defines the short description, og:image defines the preview image and og:url defines the permanent URL of the page. This structure helps sharing cards appear in a more controlled way.

Open Graph tags and SEO meta tags may look similar, but they are not the same thing. The HTML <title> tag can be used in search engine results and browser tabs, while og:title defines the title used in social media share previews. Similarly, the meta description may be used for search engine snippets, while og:description can affect the description shown on social platforms. Therefore, the SEO title and OG title can be the same, but optimizing them separately for different purposes is often a better approach.

One of the most important Open Graph tags is og:image. In social media feeds, the visual is often the first element that catches the user’s attention. Using a high-quality, relevant and readable image with the right dimensions can improve click-through potential. If the image is blurry, incorrectly cropped, too small or unrelated to the content, share performance may be negatively affected. For this reason, it is useful to define a proper OG image for every important page.

The og:title tag defines the title shown in the share card. This title should be short, clear and compelling enough to encourage clicks. However, it should not be misleading or clickbait. When users click the link, they should find the content promised by the title on the page. A mismatch between the title and the content can harm user trust and brand perception.

The og:description tag represents the short description that appears in the social media preview of the page. This description should quickly explain what the link is about. Instead of a very long, generic or unclear description, a short text that summarizes the value of the content should be preferred. For example, for a blog post, the topic, benefit and reason to click can be explained in a few concise sentences.

The og:url tag defines the preferred permanent URL of the shared content. This tag is especially important for preventing the same content from being shared under different parameterized URLs and for helping platforms reference the correct page. For example, even if UTM parameters or different campaign links are used, the main page address can be clarified with og:url. This can help social sharing data appear more consistent.

The og:type tag defines the type of content on the page. For blog posts or standard pages, types such as article or website are commonly used. Other Open Graph types can be used for videos, music, products or different content formats. Defining the content type correctly can help platforms interpret the share more accurately. However, for most basic web pages, title, description, image and URL tags are the most critical fields at the beginning.

Open Graph should not be considered only for Facebook. Although it was introduced by Facebook, many social media platforms, messaging applications and link preview systems can use OG tags today. Platforms such as LinkedIn, WhatsApp and Slack may use Open Graph data when creating a link preview card. On X, formerly known as Twitter, there are also separate tags called Twitter Cards, but OG tags can still play a supporting role in many cases.

The YouTube example should be handled carefully in this context. YouTube is a major video platform and a place where search behaviour is highly active, but the primary use case of Open Graph is not search engines; it is social sharing previews. Large platforms such as YouTube may use OG-like metadata on their own pages for sharing previews. However, it would not be accurate to describe Open Graph as a system mainly used by search engines.

In content management systems such as WordPress, managing Open Graph tags is usually easy. Plugins such as Yoast SEO, Rank Math and All in One SEO can help define OG titles, descriptions and images for pages and posts. Similarly, Open Graph tags can be edited manually or through admin panels in Shopify, Webflow, Wix or custom-built infrastructures. The important point is to define accurate and consistent sharing data for every important page.

Open Graph tags are especially important for blog posts, product pages, campaign landing pages, news articles, service pages and category pages. When a product page is shared on social media, the correct product name, description and image should appear. When a campaign page is shared, the discount, offer or main message should be clear. When a blog post is shared, the topic and the value offered to the reader should be visible at first glance.

OG tags do not guarantee social media traffic directly, but they can improve the appearance of a share and increase the likelihood of clicks. Before clicking a link in a social media feed, users look at the visual, title and description. When these elements are clear, trustworthy and engaging, the content appears more professional. For this reason, Open Graph is an important technique for social media optimization and content distribution.

Testing should not be ignored when implementing Open Graph. After OG tags are added to a page, the share preview should be checked. Tools such as Facebook Sharing Debugger, LinkedIn Post Inspector and similar preview tools can be used to test whether the title, description and image are being pulled correctly. Some platforms may cache old preview data, so re-scraping may be needed after updates.

One common mistake in Open Graph usage is using the same image, title or description across all pages. This makes shares harder to distinguish from one another and creates a weak user experience. Each page should have unique OG tags that accurately reflect its own content. Especially for product, blog and campaign pages, using a custom title, custom description and relevant image produces healthier results.

In summary, Open Graph is a metadata protocol that helps control how web pages appear on social media and messaging platforms. With tags such as og:title, og:description, og:image, og:url and og:type, the share preview of a page can be made more structured. When used correctly, it helps content appear more professional, allows users to understand links more easily and makes social media sharing more effective.

Discover it in the dictionary

Track the digital heartbeat with Kriko

Subscribe to receive curated insights, news, and ideas shaping the digital landscape.