Encoders & Utilities

Generador de meta tags

Genera meta tags Open Graph, Twitter Card y SEO con previa Google, Facebook, Twitter y LinkedIn en vivo.

Page basics Page title Aim for 50–60 characters. Browser tab + Google SERP. / 60 Meta description Aim for 120–160 characters. Drives SERP click-through. / 160 Canonical URL

Open Graph / Facebook OG image URL Recommended 1200×630px. Used by FB / LinkedIn / Twitter (large card).

og:type og:locale

Site name Author

Twitter / X

twitter:card Twitter @site (optional)

Copy-paste into your <head>

Live preview

Google SERP

Facebook / LinkedIn

Twitter / X

Sobre esta herramienta

Meta Tag Generator construye los metadatos a nivel de head que los buscadores y las redes sociales leen de su página. Rellene el título de la página, descripción, URL canónica, idioma, directivas para robots, campos Open Graph (imagen, tipo, locale, nombre del sitio) y la variante Twitter Card — la herramienta emite un bloque listo para pegar de etiquetas HTML <meta> con todo correctamente escapado. Una vista previa en vivo muestra cómo se verá el resultado en las previsualizaciones de Google, Facebook, Twitter/X y LinkedIn para que pueda afinar el copy antes del despliegue.

La herramienta sigue las especificaciones actuales: protocolo Open Graph (el estándar de facto para previsualizaciones de Facebook/LinkedIn/iMessage), Twitter Cards (summary, summary_large_image, player, app), marcadores oEmbed para contenido embebible y las etiquetas SEO esenciales (title, description, canonical, robots). Para sitios multilingües también genera etiquetas hreflang de URL alternativas a partir de una tabla simple idioma → URL.

Cuándo utilizar esta herramienta

Revisión SEO previa al lanzamiento. Verifique que cada página tiene un título y descripción únicos dentro de su presupuesto de longitud (≈ 60 / 155 caracteres respectivamente).
Afinado de previsualización social. La misma página puede tener copy OG vs Twitter distinto si quiere optimizar por plataforma.
Dimensionado de imágenes Open Graph. El previsualizador marca imágenes que caen fuera del ratio recomendado 1200×630.
Sitios multilingües. Genere el conjunto hreflang para cada versión idiomática de una página de una sola vez.

Sobre los presupuestos de longitud

Google trunca los títulos en torno a 60 caracteres y las descripciones en torno a 155 — son guías basadas en observación, no contratos. Móvil corta antes que escritorio. Los títulos Open Graph renderizan hasta ~88 caracteres en la mayoría de apps; las descripciones hasta ~200. El previsualizador avisa cuando excede cada límite para que no acabe con un «...» en producción. Pruebe en las plataformas reales (Facebook Sharing Debugger, Twitter Card Validator) antes del despliegue.

Preguntas frecuentes

¿Necesito tanto las etiquetas Open Graph como las Twitter Card?

Normalmente sí. Twitter recurre a Open Graph si faltan etiquetas Twitter Card, pero el resultado suele ser subóptimo — recorte de imagen incorrecto, sin enlace «Leer más». Definir ambas lleva 30 segundos y produce previsualizaciones consistentes en todas las grandes plataformas sociales. LinkedIn, iMessage, Discord, Slack y Telegram usan Open Graph; solo Twitter/X usa Twitter Cards.

¿Qué tamaño debería tener mi imagen Open Graph?

1200×630 píxeles es el tamaño recomendado universalmente — funciona para Facebook, LinkedIn, Twitter (con summary_large_image) y Discord. Mínimo 600×315; por debajo, la imagen se muestra como miniatura pequeña o no se muestra en absoluto. Mantenga el contenido crítico dentro del área segura central de 1200×600 — Facebook recorta los bordes superior e inferior en algunos contextos.

¿Es realmente importante la URL canónica?

Sí, especialmente para cualquier página accesible por varias URL (parámetros UTM, rutas A/B, variantes de idioma, http vs https, www vs apex). Sin una canónica, los buscadores eligen una canónica por su cuenta — a veces la equivocada — y dividen sus señales de posicionamiento entre los duplicados. Una etiqueta <link rel="canonical"> correcta canaliza todas las señales hacia una URL.

¿Cómo funcionan las etiquetas hreflang?

Cada página traducida lista cada otra versión idiomática con una etiqueta <link rel="alternate" hreflang="...">, además de un x-default para el fallback. Los códigos son idioma ISO 639-1 (en, de, uk) opcionalmente seguido de una región ISO 3166-1 (en-US, en-GB). Todas las páginas de una familia idiomática deben referenciarse mutuamente — Google ignora hreflang unilaterales.