🖥️ Vista previa do & fragmento SERP

Vista previa do fragmento SERP

Escriba o título da páxina, a metadescrición e o URL para ver unha vista previa en directo, con precisión de píxeles, do fragmento de resultados de Google no escritorio e no móbil, con avisos de truncado antes de que lle custen clics.

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

Como usar a vista previa da SERP

Catro pasos rápidos para un fragmento que se mostra por completo e merece o clic.

1

Indique o título da páxina

Escriba a etiqueta de título que planea empregar. Os contadores de caracteres e píxeles actualízanse en tempo real para que poida ver canto está preto do límite de ~600px do escritorio de Google.

2

Engadir o URL e a meta descrición

Apegue o URL da páxina e escriba a meta descrición. A vista previa mostra a ruta, o título azul e o fragmento gris exactamente como un resultado real.

3

Troque entre o escritorio e o móbil

Conmute as páxinas Escritorio e Móbil para escoller ambas as dúas disposicións, xa que a móbil emprega unha columna máis estreita e divíde os títulos en máis liñas.

4

Corrixir os avisos de truncado

Edite ata que os símbolos de aviso sexan verdes. Corte todo o que se marque como ancho de máis para que Google mostre o título completo e a descrición no canto de puntos suspensivos.

Preguntas do fragmento SERP

Google trunca as ligazóns de título do escritorio en aproximadamente 600 píxeles, non un número fixo de caracteres, porque os caracteres anchos como W e M ocupan máis espazo que os estreitos como i e l. Esta ferramenta mide o ancho real dos píxeles renderizando para que poida ver exactamente onde se cortará o título.
Google normalmente mostra uns 920 píxeles de metadescrición no escritorio (uns 155 a 160 caracteres) e menos nos móbiles. Calquera texto máis longo é truncado cun punto e coma. A vista previa mostra tanto a truncación no escritorio como na móbil en tempo real mentres escribe.
Os resultados móbiles empregan unha columna máis estreita e un tamaño de letra diferente, polo que os títulos se dividen en máis liñas e as descricións son máis curtas. Esta ferramenta mostra ambas as disposicións xuntas para que poida optimizar para cada unha.
Non. A vista previa executase completamente no navegador usando a API de medición de texto do Canvas. Non se envía, rexistra nin garda nada do que escriba, polo que pode probar con seguridade páxinas non publicadas e URLs internos.

Para desenvolventes

Esta vista previa de SERP executase 100% no lado do cliente; a medida dos píxeles faise no navegador, polo que non se envía nada do que escriba.

✓ Privado por deseño, sen ida e volta ao servidor

A truncación mídese da mesma maneira que o navegador debuxa o texto, coa API Canvas measureText. Esta é a idea principal que pode deixar no seu propio encaixe de construción:

// 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 isto a escala — comprobar en lote miles de títulos do seu CMS ou CI? Unha API REST aloxada para as nosas ferramentas SEO está dispoñíbel nos plans de pago. Ver os plans →