Cómo usar: SERP Preview
- Type or paste your title tag and meta description. The meters turn green when the text fits Google’s pixel budget.
- Add the page URL and an optional site name — the preview builds the breadcrumb (
example.com › blog › post) from it. - Enter the search query you are targeting to see which words Google would bold, and toggle the date or review stars to see how much space they take.
- Compare the desktop and mobile previews, fix anything marked in Snippet checks, then copy the HTML tags or a share link for your client or team.
What is a SERP preview?
A SERP (search engine results page) preview shows how a page is likely to appear as a blue-link result in Google: the favicon and site name, the breadcrumb-style URL, the clickable title and the gray description snippet. It lets you write and polish your <title> and <meta name="description"> before publishing, instead of discovering a cut-off headline in Search Console weeks later.
Why pixels matter more than characters
Google truncates titles and descriptions by rendered width, not by a character count. A capital “W” is roughly three times wider than a lowercase “i”, so a 60-character title in uppercase can be cut while a 70-character title full of narrow letters fits. This tool measures your text with the same fonts Google uses (Arial 20 px for desktop titles, 14 px for descriptions) via the browser’s canvas API, and truncates at a word boundary with an ellipsis the way Google does.
| Element | Approx. limit | Rough character equivalent |
|---|---|---|
| Desktop title | ~580–600 px | 50–60 characters |
| Desktop description | ~920 px | 150–160 characters |
| Mobile title | two lines | up to ~75 characters |
| Mobile description | ~680 px | ~120 characters |
These limits are observations, not published rules — Google adjusts its layout regularly and may rewrite a title or snippet entirely if it thinks other text on the page matches the query better.
Tips for titles and descriptions that earn clicks
- Front-load the keyword. Put the topic people search for in the first few words, so it survives truncation and gets noticed when users scan.
- Keep the brand short and at the end. Google often shows your site name separately above the URL, so “| Brand Name Inc.” at the end of every title mostly costs space.
- Write descriptions as a promise. Say what the visitor gets — a price, a checklist, a free tool — rather than repeating the title. Google bolds words that match the query, so natural use of the keyword helps the snippet stand out.
- Remember dates and stars eat space. A visible date (“Oct 25, 2026 —”) is shown in front of the description and reduces how much of your text fits. Review stars only appear for eligible schema types such as Product or Recipe — you can generate the markup with the Schema Markup Generator.
Using it on a Webflow site
In Webflow, the title and description live in Page settings › SEO settings. On CMS template pages you can build them from fields (for example Name | Category) — paste a typical item’s values here to check that long CMS names don’t get truncated. To check what a live page actually outputs, run it through the Meta Tag Checker; to write the complete set of head tags, use the Meta Tag Generator.
También se busca como: serp simulator, google snippet preview, title tag preview, meta description preview, serp snippet, pixel width checker, title length checker, google preview.
Herramientas que combinan con: SERP Preview
- Open Graph Checker — Preview how your link will look when shared on Facebook, LinkedIn, X and Slack.
- Verificador SEO y auditoría del sitio web — Pega una URL para realizar hasta 70 comprobaciones de SEO on-page, además de una auditoría completa del sitio web: velocidad de Lighthouse, encabezados de seguridad y SSL, datos estructurados, enlaces rotos, robots.txt y rastreadores de IA, aspectos básicos de accesibilidad, seguimiento y consentimiento, SPF/DKIM/DMARC y caducidad del dominio — todo ello resumido en una puntuación global del sitio web con soluciones priorizadas.
- Contador de palabras — Pega o escribe tu texto para contar palabras y caracteres en tiempo real, además de calcular el tiempo de lectura y de pronunciación, la densidad de palabras clave y comprobar la longitud de los títulos SEO, las metadescripciones y las publicaciones en redes sociales.
- Guía sobre el archivo robots.txt — Las reglas de robots.txt son breves, pero es fácil malinterpretarlas.