Share image does not load

Why the tag can be right and the image still missing

Link previews are built by the platform, not by the visitor's browser. When someone pastes the URL into a chat app or a social post, the platform's crawler reads the og:image tag, fetches that address, and caches whatever comes back. If the address answers with an error, a redirect to a page, or an HTML document, the preview has no picture. The page itself looks fine to everyone who visits it, so nobody notices until the launch announcement goes out with grey boxes.

The usual causes are an image URL copied from staging that is now password-protected or deleted, a file renamed during the build, a CMS field that stores a relative path some crawlers will not resolve, an image host that blocks unknown user agents, or a URL that serves a resizing service's HTML error instead of the file.

How Skewcheck detects it

When the page has an og:image tag, Skewcheck resolves it against the page URL and requests it with HEAD, falling back to a GET whose body is never downloaded if HEAD answers with an error. The request follows at most three redirects and passes through the same safety checks as the page fetch. If the final answer is a 2xx status with an image content type, such as image/png or image/jpeg, the check passes and names the type.

An error status, a non-image content type, a failure to connect, or an address no one else can reach, such as localhost or a private network, is a medium-severity warning worth 3 points, with the status and type in the detail line. When the page has no og:image at all, this check passes and leaves the penalty to the Open Graph check, so the same gap is never counted twice. If the request has not finished when the audit's time budget runs out, the check passes as not checked and deducts nothing. Skewcheck checks that the image loads, not its size or what it shows.

curl -sIL https://example.com/og/home-1200x630.png | grep -iE '^(HTTP|content-type)'

Fixing it

Make og:image an absolute https:// URL on a host that serves the file publicly, with no login, no hotlink protection and no bot blocking. PNG or JPEG at 1200 by 630 pixels works across the major platforms, and adding og:image:width and og:image:height lets them lay out the card before the download finishes. In the Next.js App Router, set metadataBase so relative image paths become absolute, or add an opengraph-image file to the route. On site builders, set the social share image in the page or site SEO settings, and publish so the file is on the live domain rather than staging.

Platforms cache previews, sometimes for days, so after fixing the image use each platform's sharing debugger or post inspector where one exists to make it fetch the page again. Re-check with Skewcheck to confirm the new address answers with an image type.

Before and after

HTTP/2 404
content-type: text/html

HTTP/2 200
content-type: image/png