Skip to main content

    Open Graph Preview & Debugging

    Social previews don’t directly rank, but they impact click-through and sharing. This guide covers the OG checklist and the debugging workflow.

    1) Minimum OG checklist

    html
    <meta property="og:type" content="website" />
    <meta property="og:title" content="OG Preview Tool" />
    <meta property="og:description" content="Check how your link looks on social platforms." />
    <meta property="og:url" content="https://example.com/tools/og-preview" />
    <meta property="og:image" content="https://example.com/og-image.png" />
    
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:image" content="https://example.com/og-image.png" />

    2) OG image best practices

    • Size: 1200×630 (1.91:1) is the most compatible
    • Format: PNG/WebP/JPEG—compress and keep it reasonably small
    • Text: keep critical text away from edges (safe area)
    • Caching: rename the file or add a version query parameter

    3) Validate with our OG Preview tool

    1. Open OG Preview and test your URL.
    2. Confirm truncation, cropping and image clarity.
    3. Need tags first? Use Meta Tags Generator.

    4) Cache debugging

    • Facebook: Sharing Debugger
    • LinkedIn: Post Inspector
    • X/Twitter: wait for cache expiry or change image URL

    Related

    FAQ

    Caching and preview troubleshooting.