Generador de Meta Tags
Meta Tags de Open Graph
Meta Tags de Twitter Card
Cómo usar Generador de Meta Tags
- 1
Rellena lo esencial
Introduce el título de tu página, la descripción, las palabras clave, el autor y la directiva robots en la sección Metaetiquetas esenciales.
- 2
Añade etiquetas para compartir en redes
Completa los campos de Open Graph y Twitter Card, incluidos títulos, descripciones y URL de imágenes, para controlar cómo se ve la página al compartirla.
- 3
Revisa las etiquetas generadas
Observa cómo el marcado de las metaetiquetas se construye en vivo en el área de salida mientras escribes en cada campo.
- 4
Cópialas en tu <head>
Haz clic en Copiar metaetiquetas y pega el HTML generado en la sección head de tu página.
La guía completa de las metaetiquetas HTML para SEO
Qué son las metaetiquetas y dónde van
Las metaetiquetas son elementos HTML que residen dentro de la sección head de una página y describen el documento a los navegadores, los buscadores y las redes sociales, no a los visitantes humanos. Nunca se renderizan en la página en sí. El navegador las lee antes de pintar nada, y por eso la ubicación importa: cada etiqueta que produce este generador debería pegarse dentro del elemento head, idealmente bien arriba, antes de cualquier script que bloquee el renderizado. El elemento title y la declaración de charset en particular deberían aparecer lo antes posible, porque los navegadores necesitan conocer la codificación de caracteres antes de analizar el resto del marcado.
Dos de las piezas de metadatos más importantes técnicamente no son metaetiquetas en absoluto. El elemento title (title) y el enlace canónico (link rel="canonical") son elementos aparte, pero pertenecen al mismo bloque head y son fundamentales para cómo se entiende una página. Esta herramienta se centra en las etiquetas de título, descripción, viewport, robots, Open Graph y Twitter Card, que en conjunto cubren los metadatos que de verdad marcan la diferencia para el buscador y para las redes.
La etiqueta title: tu señal en página más importante con diferencia
El elemento title es la señal de SEO en página más potente que controlas. Es lo que Google suele mostrar como el titular azul en el que se hace clic en los resultados de búsqueda y lo que aparece en la pestaña del navegador. Apunta a unos 50 a 60 caracteres, o alrededor de 580 píxeles, para que no quede truncado con puntos suspensivos en la página de resultados. Pon la palabra clave más importante cerca del principio, escribe para una persona que está decidiendo si hacer clic y mantén cada título único en todo tu sitio. El texto repetitivo, como un nombre de marca repetido al principio de cada título, desperdicia el espacio más valioso que tienes.
Un error habitual es tratar la etiqueta title y el encabezado H1 como intercambiables. Sirven a audiencias distintas: el title es para el fragmento de búsqueda y la pestaña, mientras que el H1 es el titular en página. Pueden diferir, y a menudo deberían hacerlo, porque la formulación ideal para conseguir clics en un resultado de búsqueda no siempre es el mejor encabezado para alguien que ya está en la página.
La meta descripción: clics, no posiciones
La meta descripción no influye directamente en las posiciones, pero influye mucho en la tasa de clics, que sí importa. Trátala como un texto publicitario: resume la página, incluye la palabra clave principal para que pueda resaltarse en negrita cuando coincida con la consulta, y añade un motivo para hacer clic. Mantenla en unos 150 a 160 caracteres; las descripciones más largas se cortan, y Google reescribe con frecuencia las descripciones que faltan, están duplicadas o no encajan bien con la consulta, sacando en su lugar un fragmento del cuerpo de la página.
Como Google puede ignorar tu descripción y sintetizar la suya propia, no confíes en ella para información crítica. Aun así, escribe una buena, ya que una descripción atractiva que sobreviva suele rendir mejor que un fragmento autogenerado. Nunca la atiborres de palabras clave; eso provoca una reescritura y a los usuarios les resulta spam.
La metaetiqueta robots y el control del rastreo
La metaetiqueta robots les indica a los buscadores qué hacer una vez que han rastreado una página. Los valores más comunes son index/noindex (si la página puede aparecer en los resultados) y follow/nofollow (si los enlaces que contiene deben transmitir autoridad). Un valor como noindex, follow mantiene una página fuera del índice sin dejar de permitir que los rastreadores recorran sus enlaces, lo cual es útil para páginas de poco contenido como los resultados de búsqueda internos o las variantes optimizadas para imprimir. Otras directivas incluyen noarchive, nosnippet y max-snippet para un control fino de cómo se muestra un resultado.
Una distinción importante: la metaetiqueta robots controla la indexación, mientras que robots.txt controla el rastreo. No son intercambiables. Si bloqueas una URL en robots.txt, puede que Google nunca vea una etiqueta noindex en esa página, porque no puede rastrearla para leerla, y la URL aún puede aparecer en los resultados como un simple enlace. Para eliminar de forma fiable una página de la búsqueda, déjala rastreable y aplícale noindex.
Viewport, charset y los aspectos técnicos esenciales
La etiqueta viewport, width=device-width, initial-scale=1.0, es lo que hace que una página sea adaptable al móvil. Sin ella, los navegadores móviles renderizan la página con un ancho de escritorio y la encogen, produciendo texto diminuto y una mala experiencia móvil. Como Google indexa primero la versión móvil de las páginas, una etiqueta viewport que falte o esté mal configurada es un problema real de posicionamiento y usabilidad, no cosmético. La declaración de charset, casi siempre UTF-8, garantiza que los caracteres especiales y los emoji se rendericen correctamente en lugar de como mojibake.
Estas dos etiquetas son pequeñas pero innegociables. Fija el viewport al ancho del dispositivo, evita desactivar el escalado del usuario con maximum-scale o user-scalable=no (lo que perjudica la accesibilidad) y declara la codificación UTF-8 en cada página.
Open Graph y Twitter Cards para las vistas previas en redes
Las etiquetas de Open Graph (la familia og:) controlan cómo se ve tu enlace cuando se pega en Facebook, LinkedIn, Slack, Discord y muchas otras plataformas. El conjunto básico es og:title, og:description, og:image, og:url y og:type. Las etiquetas de Twitter Card (la familia twitter:) hacen lo mismo para X, con twitter:card fijado en summary_large_image como la opción que más llama la atención. Proporciona una og:image de alrededor de 1200 por 630 píxeles y usa siempre URL absolutas para ella; las rutas de imagen relativas son el motivo más común, con diferencia, de que una vista previa no muestre ninguna miniatura.
Las plataformas sociales almacenan en caché lo que rastrean, así que después de cambiar estas etiquetas a menudo necesitas volver a rastrear la página usando la herramienta de depuración de la plataforma (por ejemplo, el Sharing Debugger de Facebook) para borrar la vista previa antigua. Si falta una etiqueta, la mayoría de las plataformas recurren al título y la descripción estándar, pero el resultado es una tarjeta más sosa y con menos clics.
Etiquetas que ya no ayudan y errores comunes
La metaetiqueta keywords está muerta para el SEO. Google confirmó hace años que ignora por completo las meta keywords y, como anunciaba abiertamente tus términos objetivo a la competencia, rellenarla es en el mejor de los casos inútil y en el peor una pequeña filtración de información. Este generador incluye un campo de palabras clave por completitud y para sistemas heredados, pero no esperes de él ningún beneficio en el posicionamiento. Otras etiquetas heredadas como meta revisit-after y meta author tampoco tienen ningún impacto en las posiciones de Google.
Los errores reales más frecuentes son: títulos y descripciones duplicados en muchas páginas, títulos y descripciones que superan los límites de visualización y quedan truncados, etiquetas canónicas que faltan en páginas accesibles por varias URL, URL relativas en og:image y lanzar por accidente un noindex de todo el sitio que quedó de un entorno de pruebas. Confirma siempre el head final renderizado con la opción de ver el código fuente o las herramientas de desarrollador de tu navegador, ya que los frameworks de JavaScript a veces inyectan o sobrescriben metaetiquetas después de que se carga el HTML inicial.
Preguntas frecuentes
¿Qué metaetiquetas crea este generador?
¿Para qué sirven las etiquetas de Open Graph y Twitter Card?
¿Qué longitud deben tener mi título y mi descripción?
¿Qué tamaño de imagen debo usar para las etiquetas OG?
¿Dónde coloco las etiquetas generadas?
Herramientas relacionadas
Sigue trabajando con estas prácticas herramientas