Generador de meta tags
Crea meta tags SEO y etiquetas Open Graph y de tarjetas de X, y mira cómo se ve la página en Google y al compartirla en redes sociales.
Generador de meta tags - etiquetas SEO, Open Graph y tarjetas de X con vista previa en vivo
El título y la descripción del head de una página deciden cómo aparece en Google, y las etiquetas Open Graph y de X deciden cómo se ve un enlace compartido en Facebook, LinkedIn, WhatsApp, Slack y X. Esta herramienta las escribe todas a partir de un formulario breve y muestra las tres vistas previas mientras escribe, para que vea que un título se corta antes de que lo vean sus lectores.
No se envía nada a ningún servidor. La única petición que hace la página es cargar su imagen para compartir desde su propia dirección, para mostrarla en las vistas previas.
Cómo se usa
- Rellene Título de la página, Descripción, Dirección de la página (URL canónica) y URL de la imagen para compartir.
- Observe los contadores y las vistas previas de Google, Facebook y X.
- Elija el Tipo de contenido, el estilo de Tarjeta de X y, si tiene una, la Cuenta de X.
- Pulse Copiar y pegue el código dentro del
<head>de la página.
Para mejorar una página que ya existe, pulse Leer etiquetas del HTML, pegue el código fuente de la página y pulse Rellenar. El HTML pegado solo se lee, nunca se ejecuta.
Qué hace cada etiqueta
| Etiqueta | Quién la usa | Consejo |
|---|---|---|
<title> | Pestaña del navegador, resultado de Google | Unos 50 a 60 caracteres; ponga primero las palabras que la gente busca |
meta description | Fragmento de Google | Unos 120 a 155 caracteres que digan qué ofrece la página al lector |
link rel="canonical" | La única dirección que debe posicionarse cuando varias URL muestran la misma página | |
og:title, og:description | Facebook, LinkedIn, WhatsApp, Slack | Pueden ser más cortos y llamativos que el título para buscadores |
og:image | Todas las vistas previas al compartir | 1200 × 630 píxeles, una dirección https:// completa, de menos de unos 5 MB |
twitter:card | X | summary_large_image para una imagen ancha, summary para un cuadrado pequeño |
meta robots | Buscadores | Solo se añade cuando desactiva la indexación o el seguimiento de enlaces |
Límites de longitud
Google corta los títulos por anchura, hacia los 580 píxeles, lo que equivale a unos 60 caracteres de texto normal; las letras anchas como W y M agotan el espacio antes. Las descripciones suelen cortarse a partir de unos 155 a 160 caracteres en ordenador, y antes en el móvil. Los contadores se ponen naranjas cuando supera la longitud cómoda y rojos cuando el texto casi con seguridad se cortará.
Después de publicar
- Las redes sociales guardan en caché la vista previa de cada enlace. Use el Facebook Sharing Debugger o el LinkedIn Post Inspector para que lean las etiquetas nuevas.
- Google elige su propio fragmento cuando el texto de la página encaja mejor con una búsqueda que su descripción, y puede reescribir los títulos que no describen la página.
- Cada página debe tener su propio título y su propia descripción; repetir los mismos en todo un sitio hace que los resultados se parezcan entre sí.
Herramientas relacionadas
Para crear una imagen para compartir con el formato y el tamaño adecuados, use el conversor de imágenes. Para escapar a mano caracteres especiales en HTML, use el codificador de entidades HTML. Las páginas de tareas abren esta herramienta en una vista previa concreta: generador de Open Graph, generador de Twitter Card y vista previa de Google.