Open Graph tags missing

What Is This Issue

Open Graph (OG) tags are meta tags that control how your web pages appear when shared on social media platforms like Facebook, LinkedIn, and X (Twitter). They define the title, description, image, and other metadata that social platforms display in link previews.

This issue checks whether your page has the essential Open Graph tags implemented. A passing implementation must include:

og:title - The title of your page
og:description - A brief description
og:image - An image to display
og:url - The canonical URL of the page
og:type - The type of content (e.g., website, article)

Example of passing implementation:


<meta property="og:title" content="My Awesome Page Title" />
<meta
  property="og:description"
  content="A compelling description of my page content"
/>
<meta property="og:image" content="https://example.com/image.jpg" />
<meta property="og:url" content="https://example.com/page" />
<meta property="og:type" content="website" />

Why Is This Important

Open Graph tags are crucial for social media visibility and engagement:

Click-through rates: Pages with proper OG tags get up to 3x higher CTR when shared on social platforms
Brand consistency: Ensures your content appears exactly as intended across all social channels
Crawlability: Social media crawlers rely on these tags to understand and display your content
AI Search / AEO: AI systems use OG tags to understand page context and relationships

Without OG tags, social platforms will attempt to auto-generate previews, often resulting in:

Missing or irrelevant images
Truncated or incorrect titles
Poor descriptions pulled from random page content

Resolving this issue improves your social media presence and contributes to a higher overall SEO health score by ensuring your content is properly represented across all sharing platforms.

How XeoPix Detects This

XeoPix checks for Open Graph tags by:

Fetching the page HTML after following all redirects
Parsing the <head> section to extract meta tags with property attributes starting with og:
Checking for required tags: Verifies that og:title, og:description, og:image, og:url, and og:type are present
Validating content: Ensures tags exist and have non-empty content values
Flagging the issue if any required OG tag is missing or empty

The detection is performed on the raw HTML response without JavaScript execution, matching how social media crawlers see your pages.

How To Fix

Add required OG tags to your HTML <head> section:
- og:title - Keep under 60 characters for optimal display
- og:description - Aim for 150-200 characters
- og:image - Use images at least 1200×630 pixels for best results
- og:url - Use the canonical URL of the page
- og:type - Use “website” for general pages, “article” for blog posts
Test your implementation:
- Use Facebook Sharing Debugger
- Use LinkedIn Post Inspector
- Validate with social media preview tools
Ensure images are accessible:
- Use absolute URLs (starting with https://)
- Host images on a reliable CDN
- Avoid images that require authentication to access
Update dynamically for each page:
- Don’t use the same OG tags across all pages
- Customize per-page titles, descriptions, and images

What We Store

Storage Level

Page Level

Database Table / Prisma Model

SocialOpenGraphData

Stored Fields

Field	Type	Description
ogTitle	String?	Open Graph title tag content
ogDescription	String?	Open Graph description content
ogImage	String?	Open Graph image URL
ogUrl	String?	Open Graph URL property
ogType	String?	Open Graph type property

Detection Dependencies

HTML Document
Meta Tags (og:title, og:description, og:image, og:url, og:type)

Examples

Example 1: Missing Open Graph Tags

Problematic state (what fails):


<html>
  <head>
    <title>My Page</title>
    <!-- No OG tags present -->
  </head>
  <body>
    <h1>Welcome to my page</h1>
  </body>
</html>

Corrected state (what passes):


<html>
  <head>
    <title>My Page</title>
    <meta property="og:title" content="My Page" />
    <meta
      property="og:description"
      content="Welcome to my page with all the details"
    />
    <meta property="og:image" content="https://example.com/image.jpg" />
    <meta property="og:url" content="https://example.com/page" />
    <meta property="og:type" content="website" />
  </head>
  <body>
    <h1>Welcome to my page</h1>
  </body>
</html>

Example 2: Incomplete Open Graph Tags

Problematic state (what fails):


<meta property="og:title" content="My Page" />
<!-- Missing og:description, og:image, og:url, og:type -->

Corrected state (what passes):


<meta property="og:title" content="My Page" />
<meta property="og:description" content="Complete description here" />
<meta property="og:image" content="https://example.com/image.jpg" />
<meta property="og:url" content="https://example.com/page" />
<meta property="og:type" content="website" />

Unit Test

Test File

xeopix-crawling-v2/__tests__/seo-audit-checks/socialOpenGraph/issue-97-open-graph-set.test.js

Purpose

Validates that the crawler correctly detects pages missing required Open Graph meta tags (og:title, og:description, og:image, og:url, og:type).

Tested Function

runSocialOpenGraph()

Issue Information

Issue Number: 97
Issue Code: open_graph_set
Toggle Group: socialOpenGraph

Test Scenarios

Positive Test Cases

All required Open Graph tags (og:title, og:description, og:image, og:url, og:type) are present → no issue detected.

Negative Test Cases

og:title is missing while other OG tags are present → issue detected with message containing og:title.
Multiple Open Graph tags are missing (only og:image present) → issue detected with message listing all missing tags (og:title, og:description, og:url, og:type).

Boundary Cases

No boundary cases exist in the test.

Edge Cases

Empty HTML: The function handles an empty string without throwing.
Malformed HTML: The function handles incomplete HTML markup without throwing.

Expected Outcome

Pass

The issue should not be reported when all five required Open Graph tags (og:title, og:description, og:image, og:url, og:type) are present in the page HTML.

Fail

The issue should be reported when any of the required Open Graph tags are missing. The details message lists which specific tags are absent.

Validation

Correctly detects the absence of required Open Graph tags.
Does not report a false positive when all tags are present.
Handles empty and malformed HTML gracefully without crashing.

xeopix-crawling-v2/toggleGroups/socialOpenGraph.js
xeopix-crawling-v2/issueCodes.js

Coverage Summary

Covers the complete set of required Open Graph tags.
Validates single-tag and multi-tag missing scenarios.
Includes resilience tests for malformed and empty input.

References

Open Graph Protocol — Open Graph Protocol
Facebook Sharing Debugger — Facebook Developers
LinkedIn Post Inspector — LinkedIn