Open Graph and social meta tags on your company website: how to control link previews and mistakes that kill clicks

You share a link to your site on LinkedIn, WhatsApp or email and the preview shows an incoherent crop, a generic title or an image that has nothing to do with the page. The visitor hesitates, does not click and you lose traffic before your design loads. Almost always Open Graph and social meta tags in the <head> are wrong or missing.

With November campaigns and peak season ahead, every shared link matters. We cover the tags you need, how to test them and which errors to fix in production now.

What Open Graph and social meta tags control

When you paste a URL, the social network or messenger app does not "read" your site like a browser: it downloads a minimal set of metadata. Open Graph (Facebook, LinkedIn, WhatsApp in many cases) and twitter:card define the link title, description and image.

If they are missing or weak, the platform guesses from the first <h1>, any paragraph or the first large image. The result is often ugly, truncated or off-brand.

Essential tags on every template

On key pages — home, services, campaign landings and blog posts — check at least:

• og:title and og:description: copy written for sharing, not only for SEO.
• og:image with absolute HTTPS URL, ~1200×630 px and reasonable weight.
• og:url aligned with the canonical URL.
• og:type (website or article on the blog).
• twitter:card as summary_large_image for a large image on X.

Social image: the mistake that costs the most clicks

The Open Graph image is the visual ad for your link. Frequent errors:

• Relative paths that work in the browser but fail for external crawlers.
• Tiny logos or screenshots with unreadable text.
• Reusing one image on every page.
• Forgetting to update og:image when a seasonal offer changes.

Define one image per important URL, with the same discipline as Schema.org markup: what you promise in the preview must match what visitors find.

How to test before launching a campaign

1. Use Meta Sharing Debugger and LinkedIn Post Inspector to refresh cache.
2. Share the URL in a private WhatsApp or Slack chat and check title and image.
3. Ensure canonical URL and og:url match, especially on multilingual websites.

SEO, cookies and analytics

Google title and meta description do not replace Open Graph: you can tune SERP copy and use more commercial wording on social, as long as both stay honest and aligned with the page.

After your cookie banner, remarketing pixels on shared landings must respect consent. An attractive preview that leads to blocked scripts frustrates users and hurts conversion.

Open Graph vs meta description: not the same job

Many sites paste identical text into meta name="description" and og:description. It works as a shortcut but limits performance: Google needs clarity and keywords; social needs a hook in a few lines.

Example: meta description says "Web development and maintenance in Barcelona"; og:description says "Does your campaign landing look broken when shared? Fix Open Graph before Black Friday". Same page, two intents — neither may lie about the content.

WhatsApp, Telegram and email

On mobile, most company links arrive via WhatsApp or Telegram. Those apps rely on Open Graph. If og:image is huge or slow, the preview fails or shows a broken icon.

Verify the image returns 200 without authentication, does not block Facebook/WhatsApp user-agents and uses a valid SSL chain. After migrations, og:image often still points at the old domain with redirect chains.

Campaign landings: one og:image per offer

Reusing the home image on a "30% off until Sunday" landing hides urgency. Use a real editorial photo per campaign and name files predictably in your CMS.

When the campaign ends, update og:title and og:description or redirect; stale offer previews erode trust like fake stock counters.

Technical implementation without breaking the CMS

In Laravel, WordPress or headless stacks, centralise logic: one helper for title, description, absolute image and canonical. Override on blog posts; use SEO fields on static pages.

Avoid duplicate conflicting tags: two og:image entries make crawlers pick at random. Disable one source or merge into a single layer.

Measure whether the fix paid off

After fixing metadata on a key landing, compare two weeks of social CTR (UTM utm_medium=social) and bounce rate. Coherent previews often lower bounce because expectations match the page.

Quick checklist for your company website

• Each template outputs sensible og:title, og:description, og:image and og:url.
• Social images use absolute HTTPS and at least ~1200 px width.
• Blog posts use og:type article and BlogPosting schema where possible.
• Re-test previews on at least two channels after each deploy.
• Document which image belongs to which landing.

Next step

If your home or seasonal landing preview does not communicate your offer within two seconds, fix Open Graph before spending more on ads.

Request a quote for a social metadata and template review.