SERP Snippet Preview: Title and Meta Description Pixel Checker
Enter a page’s title, description and URL to see how the result may look in Google and whether the title and description get truncated, measured in pixels. Everything is calculated in your browser.
Why pixels, not characters
Google truncates titles and descriptions by display width, not by character count. A W is several times wider than an i, and a Chinese or Japanese character takes about two Latin letters’ width. A “60 characters” rule is a rough guide for plain English at best.
The tool measures text with the browser’s Canvas API in Arial, which Google uses, at 20 px for titles and 14 px for descriptions:
| Item | Desktop | Mobile |
|---|---|---|
| Title | about 600 px | about 600 px (wraps, but long titles are still cut) |
| Description | about 920 px (about two lines) | about 680 px |
These are common industry estimates. Google does not publish official limits and adjusts them when the results page changes.
What it checks
- Title: empty, short (under about 280 px) or wider than the display limit
- Description: empty, short (under about 400 px, less than a line and a half) or wider than the display limit for the selected device
- Keyword: whether the target keyword appears in the title and description, and whether it sits in the first half of the title so it survives truncation
- Style: three or more all-caps words, three or more separators (
|,-,—,·), and a description identical to the title
The preview also shows the site name and a breadcrumb-style URL as Google displays them, and an optional date prefix in front of the description, which takes space from the visible snippet.
How to write titles that survive truncation
- Put the main topic and keyword first. Brand names and qualifiers can go at the end, where truncation does the least harm.
- Write one clear title rather than a list of keywords separated by pipes. Google rewrites titles that look like keyword lists more often.
- Keep the title consistent with the H1. When the two disagree, Google often builds its own title from the H1 or anchor text.
- For CJK titles, plan for roughly 28–30 characters before the 600 px limit; for English, roughly 55–60 characters, depending on letter widths.
For practitioners: how the measurement works
- Width is measured with
CanvasRenderingContext2D.measureTextusing20px Arialfor titles and14px Arialfor descriptions, which match Google’s desktop result styles. If Arial is not installed (some Linux systems), the browser falls back to a metric-compatible font and results can shift by a few pixels. - Truncation is simulated by cutting the text at the last position that fits together with an ellipsis; for Latin text the cut moves back to a word boundary.
- The limits (600 px title; 920 px desktop and 680 px mobile description) are widely used estimates from observing live results, not published values. Google has changed snippet length several times, so treat a few pixels over the limit as a risk, not a certainty.
- When a date is set, its width plus the separator is subtracted from the description budget.
FAQ
Why doesn’t Google show my meta description?
Google picks the snippet based on the query. If your meta description does not match what was searched, Google pulls a passage from the page instead. An accurate description that uses the page’s main terms is more likely to be shown.
Google rewrote my title. What now?
Common reasons are a title that does not match the content, keyword stuffing, duplicate titles across pages, and excessive length. Check that the title accurately describes the page and agrees with the H1.
Does title length affect rankings?
Google has not said that length itself is a ranking factor. Length matters because a truncated title may hide the words that make people click, and because very long titles are more likely to be rewritten.
Should I write different titles for mobile?
No. A page has one title tag. Write it so the important part fits within the first 600 px, and it will read well on both devices.
Is my text sent anywhere?
No. Measuring and rendering happen in your browser. The last values you entered are kept in your browser’s localStorage so they are still there next time.