SERP preview and citation card simulator

Three renderings of the same two tags. The Google desktop and mobile panels cut the title and description at the pixel widths Google has used for years, measured in the font Google renders. The citation card shows the same tags the way an answer engine lists a source under its answer: site name, title, a sentence, and the Open Graph image when there is one.

• Title: about 600 pixels on desktop, roughly 50 to 60 characters. The preview cuts at a word boundary and adds an ellipsis where Google would.
• Description: about two lines on desktop and three on mobile. The optional query field bolds matching words, as Google does.
• Verdicts next to each field use the same thresholds as our AI readiness checker, so a green pill here means the signal passes there.

Answer engines do not show ten blue links, but they do show sources. When ChatGPT, Perplexity, Gemini or Google's AI Overviews cite a page, the card they render is built from the page's title, its meta description or first sentences, and its Open Graph image. A title that names the question the page answers, and a description that states the answer, make the citation legible and clickable.

The engines also use the meta description as a summary candidate when they describe a page. A description that is a list of keywords gives them nothing to quote; a description that is one clear sentence often gets quoted verbatim.

1. Lead with what the page is: the product, the question, or the comparison. Readers and engines decide in the first four words.
2. Add the qualifier that makes it specific: the year, the audience, the platform, the price point.
3. End with the brand, after a separator. If the title is cut, the brand is what you can afford to lose; the site name line shows it anyway.
4. Match the H1. Google rewrites titles that disagree with the visible heading, and answer engines treat the H1 as the page's name.

Write the answer, not the teaser. If the page explains how long a title tag should be, the description should say how long a title tag should be. One or two sentences, 80 to 160 characters, in the third person, with the main query's words in it so they bold in the snippet. Leave out prices and dates unless you will keep them current; a stale fact in a description gets repeated by engines for months.

Then read it as a citation card: would you click a source described this way? If the sentence only makes sense after reading the page, rewrite it so it stands alone.

og:title, og:description, og:image and og:type are what link previews and many citation cards read. The readiness rubric passes a page only when all four are set. Use Read from URL to see which are present on a live page; the og:image verdict appears next to the image field. The image should be at least 1200 by 630 pixels, show the subject rather than a logo, and be served from a URL that does not require cookies or JavaScript to load.