← Back to glossary

Open Graph tags

SEO

Meta tags controlling how your pages appear when shared on social media platforms like Facebook, LinkedIn, and Twitter.

What Open Graph tags do

When someone shares your page on social media, Open Graph (OG) tags determine what appears: title, description, and image. Without OG tags, platforms guess—pulling random page text, wrong images, or generic placeholders. This makes shares look unprofessional and reduces click-through.

OG tags give you control. Craft social-specific headlines, write compelling descriptions optimised for social context, and choose striking images that catch attention in crowded feeds.

Essential Open Graph tags

og:title: The headline shown in social previews. Can differ from your page title tag—social headlines often benefit from more engaging, less SEO-focused language.

og:description: Supporting text beneath the title. Similar to meta descriptions but optimised for social context. What makes someone want to click when scrolling Facebook or LinkedIn?

og:image: The preview image. Recommended size: 1200x630px. This visual element dramatically impacts click-through—choose images carefully. Faces, contrasting colours, and clear text work well.

og:url: The canonical URL for this content. Ensures social platforms attribute shares correctly even if accessed via different parameters.

Twitter Card tags

Twitter uses its own metadata (twitter:card, twitter:title, etc.) though it falls back to OG tags if Twitter-specific tags aren't present. We typically set both to ensure optimal display across platforms.

Twitter card types include "summary" (small image) and "summary_large_image" (full-width image). Large images attract more attention and get higher engagement.

Testing Open Graph implementation

Facebook's Sharing Debugger and Twitter's Card Validator show exactly how your pages appear when shared. Test before launching to catch missing images, truncated text, or incorrect data.

These tools also refresh social platform caches. If you update OG tags, use the debuggers to force platforms to fetch new data—otherwise old previews may persist for days.

OG tags on every page

We configure Open Graph tags automatically for all pages during builds. Every page gets appropriate social metadata, ensuring shares always look professional and accurately represent content.

Dynamic OG images based on page content take this further—blog posts showing custom graphics, case studies featuring client logos, service pages with relevant visuals. Thoughtful OG implementation multiplies social traffic.

Why it matters

Understanding “Open Graph tags” helps you speak the same language as our design and development team. If you need help applying it to your project, book a Fernside call.