Advanced Open Graph Tips and Tricks

Use Dynamic OG Tags by Page Type

Different pages need different previews. Blog posts should use article schema, product pages should include price and availability tags, and homepage previews should emphasize brand identity.

Optimize Image Size for Speed

Avoid 5MB PNGs — compress images to under 300KB with WebP format. Use 1200x630px dimensions, which are optimal across platforms and load quickly.

Always Set og:site_name

This ensures your brand name appears consistently in previews, even if the page title is truncated. Example: <meta property="og:site_name" content="YourBrand" />

Test Across Platforms — Don't Assume

LinkedIn and Facebook handle meta tags differently than Twitter/X. Always test using:

Use og:type for Rich Content

For blogs, use article. For products, use product. This unlocks richer rendering like author names, publication dates, or price tags.

Preload OG Images

Add <link rel="preload" as="image" href="/img/og-default.jpg"> to improve load speed and reduce layout shift on social platforms.

Cache-Busting for Updates

If you update an OG image, rename it (e.g., og-v2.jpg) or append a query param like ?v=2026. Social crawlers ignore cache headers on images.

Use JSON-LD for SEO Synergy

Add structured data with <script type="application/ld+json"> to enhance search engine results while keeping OG tags for social sharing. They work together!

← Back to Tool