Como 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.
Também pesquisado como: serp simulator, google snippet preview, title tag preview, meta description preview, serp snippet, pixel width checker, title length checker, google preview.
Ferramentas que combinam com: SERP Preview
- Open Graph Checker — Preview how your link will look when shared on Facebook, LinkedIn, X and Slack.
- Verificador de SEO e Auditoria de Site — Cole uma URL para fazer até 70 verificações de SEO na página, além de uma auditoria completa do site: velocidade do Lighthouse, cabeçalhos de segurança e SSL, dados estruturados, links quebrados, robots.txt e rastreadores de IA, noções básicas de acessibilidade, rastreamento e consentimento, SPF/DKIM/DMARC e validade do domínio — tudo reunido em uma única pontuação do site com correções priorizadas.
- Contador de palavras — Cole ou digite seu texto para contar palavras e caracteres em tempo real — além do tempo de leitura e de fala, da densidade de palavras-chave e da verificação do comprimento para títulos de SEO, meta descrições e postagens nas redes sociais.
- Guia explicativo sobre o robots.txt — As regras do robots.txt são curtas, mas fáceis de interpretar mal.