Every time someone shares a link to your site on Facebook, LinkedIn, or Slack, the platform tries to generate a preview — a little card with an image, a title, and a description. Whether that card makes someone click or scroll past depends almost entirely on a set of tags most site owners don’t know exist.
Meet Open Graph
Open Graph tags (the ones that look like <meta property="og:..." /> in your HTML) tell social platforms exactly how you want your pages to look when shared. There are four that matter most:
- og:title — the headline that appears at the top of the card
- og:description — a short pitch below the headline
- og:image — the image that dominates the card
- og:url — the canonical URL of the page
Without these, social platforms guess. And their guesses are usually bad.
What happens when they’re missing
You’ve probably seen this: someone shares a link and the preview is a tiny, pixelated logo next to three random words from the page header. Or the image is your favicon blown up to 1200 pixels, now grainy and unrecognizable. Or the title is just “Home Page” because that’s what your site’s <title> tag says.
Each of those is a missed opportunity. The whole point of someone sharing your link is to get other people to click it, and a bad preview kills that impulse stone dead.
What a good OG setup looks like
For the image: a clear 1200×630px image that makes sense at thumbnail size. Not your logo on a white background — something that represents the actual content of the page. For a blog post, that might be a relevant photograph with the post title overlaid. For a product page, the product. For a homepage, a hero shot of your space or your work.
For the title and description: similar to your meta description rules — write it for a human, make it specific to the page, keep it short enough to not get truncated.
A quick way to test
Before publishing a page, paste its URL into Facebook’s Sharing Debugger or LinkedIn’s Post Inspector. Both are free, both show you exactly what the preview will look like, and both will tell you if any tags are missing or malformed.
The common “works for the homepage, broken for everything else” pattern
A lot of sites set up OG tags once, for the homepage, and forget that individual pages need their own. Which means every blog post, product page, and landing page shares the homepage’s generic image and description. If you click through to share any specific post, you get the same card as the homepage — meaningless for the reader.
The fix is either a plugin (Yoast and Rank Math both handle this automatically per-page, using the page’s actual featured image and content), or manual tag templates in your theme’s header. Either works. Having nothing in place is the only bad option.
