SERP Preview Tool
See how your title and meta description will look in Google on desktop and mobile, with pixel-width checks, truncation warnings and copy-ready HTML tags.
Estimate only. Widths are measured with Arial at Google's sizes, and Google may rewrite titles and snippets.
<title>Best Running Shoes for Flat Feet (2026): 14 Pairs Tested</title> <meta name="description" content="We ran 300 miles in 14 pairs of stability and motion-control shoes to find the best running shoes for flat feet, from budget picks to marathon racers, with sizing advice.">
- βLead with the words people search for, then add what makes your page different: a year, a number or a result.
- βWrite a unique title and description for every page. Repeated boilerplate is a common reason Google rewrites them.
- βKeep your brand name short and at the end, or drop it on long titles. Google often shows the site name separately.
- βMake the description a reason to click: what the reader gets, in plain language, with one clear promise.
- βMatch the title to the H1 and to what the page delivers. Mismatches are the top trigger for title rewrites.
This tool is for informational purposes only. Always verify results with a qualified professional.
What is the SERP Preview Tool?
The SERP Preview Tool shows how a page is likely to look in Google's search results before you publish it. Type a title, meta description and URL, and you get a live desktop and mobile snippet that updates as you type. Google truncates by pixel width, not character count, so the tool measures your text in your browser using the same font sizes Google uses: 20px for the title and 14px for the description. A title of wide letters like W and M runs out of room much sooner than one full of i's and l's.
Ideal lengths are approximate because Google doesn't publish exact limits, but the widely used guides are consistent. Titles show in full up to roughly 580β600 pixels on desktop, usually 50β60 characters. Meta descriptions get about 920 pixels on desktop (around 150β160 characters) and about 680 pixels on mobile (around 120 characters). When text is cut, Google ends it with an ellipsis, usually at a word boundary. Put the most important words first, so the visible part still carries your message.
Google doesn't always use the title you write. Its title link documentation explains that it may build a different title from the page's main heading, anchor text pointing to the page, or other prominent text. It does this most often when your title is missing, much longer than the space available, stuffed with repeated keywords, identical across many pages, or doesn't match what the page is about. Descriptions get rewritten even more often: Google picks whichever passage best answers the search, and treats your meta description as one candidate among them. A concise, accurate, unique title and description give you the best chance of keeping your own wording.
Worked example: the title "Best Running Shoes for Flat Feet in 2026: 14 Pairs Tested and Ranked by Podiatrists" is 83 characters and measures about 755 px. That is well past the ~600 px limit, so the snippet would end at "Tested and β¦" and lose the "Ranked by Podiatrists" trust signal. Trimmed to "Best Running Shoes for Flat Feet (2026): 14 Pairs Tested" (56 characters, about 508 px), it fits, with the focus keyword near the start. The matching description is 170 characters (about 1,022 px). It gets cut after "marathon" on desktop and after "flat" on mobile, but its key promise (300 miles, 14 pairs) comes first, so it still reads well.
Use the warnings as a checklist, not hard rules. The tool flags titles that are too short to compete, text likely to be cut off on desktop or mobile, a focus keyword missing from the title or description, a keyword buried at the end of the title, and words repeated in the title, which can look spammy. When you're happy with it, copy the ready-made <title> and <meta name="description"> tags straight into your CMS or page template.
How to Use This Calculator
- 1Enter the page title you plan to use. The preview and pixel meter update as you type.
- 2Add the meta description, the one- or two-sentence summary shown under the title.
- 3Paste the page URL to see how Google turns it into a site name and breadcrumb.
- 4Optionally enter a focus keyword. The tool checks it's in both fields and bolds it like Google does.
- 5Switch between the desktop and mobile previews and fix every red or amber warning.
- 6Copy the finished HTML tags and paste them into your page's <head> or your SEO plugin.