What the Open Graph protocol is
Open Graph is a set of meta elements in a page's head that describe the page as an object: its title, its type, a picture and its canonical address. Facebook introduced it in 2010, and most services that unfurl links read it now. Each tag is a meta element with a property attribute and a content attribute, for example property og:title with content How to read a DMARC report.
Twitter Cards are a parallel set that use the name attribute: twitter:card, twitter:title, twitter:description, twitter:image. X reads its own tags first and falls back to the og: equivalents for title, description and image, so a page with good Open Graph tags needs only twitter:card on top.
How the checker reads your page
The page is requested once, redirects are followed, and the head of the HTML is scanned for meta elements. Any element with a property, name or itemprop attribute and a content value is recorded. Keys starting with og: go in one table and keys starting with twitter: in the other. If a key appears twice, the first value wins, which matters on sites where a plugin and a theme both print og:image.
The share image is chosen in this order: og:image:secure_url, og:image, then twitter:image. A relative path is resolved against the page so it can still be measured, but it raises a warning, because some platforms ignore relative image paths. Dimensions are read from PNG, JPEG, GIF and WebP headers. Other formats can load but show no size.
Reading the two previews
The Facebook / LinkedIn preview crops the image to 1.91:1, prints the hostname in capitals without www, then the title on up to two lines and one line of description. The title comes from og:title, then twitter:title, then the title element. The description follows the same order down to the meta description. If no usable image was found, the picture area reads No image.
The X preview draws the small summary layout only when twitter:card is exactly summary. Any other value, or none, is drawn as a large image with the hostname below it. The line beneath it reports the card type, or says that none is set.
Common failures and their fixes
A share with no picture is nearly always an image problem, not a tag problem. The og:image URL must be absolute, public and served with an image content type. Hotlink protection, a login wall, a firewall that blocks unfamiliar user agents or a robots rule can each stop a platform's crawler from fetching it. The checker prints the exact failure, such as HTTP 403 or Not an image (text/html).
A wrong title or an old picture after you fixed the tags is caching. Platforms store the card the first time a URL is shared and reuse it. Facebook and LinkedIn each provide a debugging page that scrapes a URL again on demand. Elsewhere, the practical workaround is a new image filename, since the picture is cached by its URL.
- Title over 70 characters: warned, since cards cut titles at roughly 60 to 70.
- Description over 200 characters: an info line notes that most cards show about 150 to 200.
- Image over 5 MB: warned, because some platforms will not use a file that large.
- Tags added by JavaScript: invisible here and to most platform crawlers, which read the raw HTML.
Limits of the check
Both previews are approximations. Platforms change their card designs, crop differently on phones and cache what they scraped earlier, so treat the mock-ups as a check on content, not on pixels. An image above 1.5 MB is measured and reported but not drawn in the preview.
The checker sees one response to one request. A site that serves different HTML by user agent or country may hand the platforms something else. It verifies that tags exist and that the image loads. It does not judge wording or whether og:url agrees with your canonical link. For the search-result view of the same title and description, use SERP Simulator.