🖥️ Vista preliminar de recorte e SERP

Vista Antevisão de Fragmentos SERP

Digite seu título de página, meta descrição e URL para ver uma visualização ao vivo, com precisão de pixel do seu recorte de resultado do Google no desktop e no celular, com avisos de truncação antes de que custem cliques.

0 caracteres · 0px
0 caracteres · 0px
e
example.com
https://example.com

Como usar a visualização SERP

Quatro passos rápidos para um fragmento que mostra em pleno e ganha o clique.

1

Insira o título da sua página

Digite a etiqueta de título que planeja usar. O personagem e contadores de pixels atualize ao vivo para que você possa ver como você está perto do limite de desktop ~600px do Google.

2

Adicione sua URL e meta descrição

Pegue a URL da página e escreva a meta descrição. A vista preliminar torna o pão, título azul e o snippet cinzento exatamente como um resultado real.

3

Alteração entre desktop e móvel

Alternar as abas Desktop e Móvel para verificar ambos os layouts, uma vez que o móvel usa uma coluna mais estreita e envolve títulos em mais linhas.

4

Corrigir os avisos de truncação

Edite até que as fichas de aviso se tornem verde. Cortar qualquer coisa marcado como demasiado amplo, assim que o Google mostra seu título completo e descrição em vez de uma elípsis.

Questões de fragmento SERP

Google trunca links de título de desktop em aproximadamente 600 pixels, não uma contagem de caracteres fixos, porque caracteres grandes como W e M tomar mais espaço do que os estreitos como i e l. Esta ferramenta mede a largura real de pixel rended para que você pode ver exatamente onde seu título será cortado.
Google geralmente exibe cerca de 920 pixels de meta descrição no desktop (cerca de 155 a 160 caracteres) e menos no celular. Qualquer coisa mais é truncada com uma elipsis. A visualização mostra tanto desktop como truncation móvel ao vivo como você digitar.
Os resultados móveis usam uma coluna mais estreita e um tamanho de fonte diferente, por isso os títulos envolvam mais linhas e descrições são cortados. Esta ferramenta torna ambos os layouts lado a lado para que você possa otimizar para cada um.
Não. A visualização funciona inteiramente no seu navegador usando a API de medida de texto de Canvas. Nada que você digite é carregado, registrado ou armazenado, para que você possa testar com segurança páginas inéditas e URLs internas.

Para desenvolvedores

Esta visualização SERP executa 100% do lado cliente — a medição de pixel acontece no seu navegador, então nada que você digite é sempre carregado.

✓ Privado por design — não há correção de servidores

A truncation é medida da mesma forma que o navegador desenha texto — com a API de medida de texto de Canvas. Aqui está a ideia de núcleo que você pode deduzir em seu próprio pipeline de construção:

// Measure rendered pixel width like Google does
const ctx = document.createElement('canvas').getContext('2d');
function titleWidth(text, font = '20px arial') {
  ctx.font = font;
  return ctx.measureText(text).width; // > 600 => truncated on desktop
}
console.log(titleWidth('Your page title here'));

Precisa disso em escala — verificando milhares de títulos de seu CMS ou CI? Uma API REST hospedada para nossas ferramentas SEO está disponível em planos pagos. Veja os planos →