Generador de meta tags
Completa los datos de tu página y copia el HTML listo para pegar en el head: etiquetas de título, descripción, canonical, robots, Open Graph y tarjeta de Twitter.
Funciona completamente en tu navegador
Los campos vacíos se omiten en el resultado. Las vistas previas son simulaciones hechas con tu texto; nunca cargan la dirección de tu imagen, y los buscadores y las redes sociales reales mostrarán todo a su manera.
Cómo generar meta tags
- Escribe el título y la descripción de la página. Los contadores dan una idea aproximada de cuánto de cada uno se suele mostrar.
- Agrega una dirección canonical, las opciones de robots y los campos de Open Graph y Twitter que necesites. Las advertencias señalan las direcciones que no son URL completas con
https://. - Revisa las simulaciones de búsqueda y de redes sociales, luego presiona Copiar HTML y pega las etiquetas dentro del
<head>de tu página.
Para qué sirve cada etiqueta
Un generador de meta tags te ahorra escribir a mano las etiquetas del head. El <title> y la meta description son la base con la que normalmente se arma un resultado de búsqueda. El enlace canonical les dice a los buscadores cuál es la dirección principal cuando se puede llegar a la misma página de varias formas, por ejemplo con parámetros de seguimiento. La etiqueta robots solo hace falta cuando quieres cambiar el comportamiento predeterminado de indexar la página y seguir sus enlaces.
Las etiquetas Open Graph se crearon para las vistas previas de enlaces y hoy las leen la mayoría de las apps de mensajería y redes sociales. El título, la descripción, la imagen y la URL son las cuatro que más importan; og:image:alt le da a la imagen una descripción en texto, y og:type suele ser website o article. La etiqueta de tarjeta de X elige entre una miniatura cuadrada pequeña (summary) y una imagen ancha (summary_large_image).
El texto se escapa a medida que se escribe, así que un ampersand se convierte en & y una comilla doble en ". Así la página sigue siendo válida y unas comillas sueltas no pueden cerrar un atributo antes de tiempo. Revisa la página terminada con una vista previa real al compartir antes de darla por buena, porque cada sitio guarda en caché la vista previa que obtuvo la primera vez.
Consejos
- Cuenta caracteres con más precisión con el Contador de caracteres.
- Crea una dirección limpia para la URL canonical con el Generador de slugs.
- Ordena el head donde vas a pegarlas con Formatear y embellecer HTML.
Preguntas frecuentes
¿Qué longitud debe tener un título o una descripción?
No hay un límite fijo. Los buscadores cortan el texto por su ancho en píxeles, no por caracteres, y pueden reescribirlo. Como guía aproximada, los títulos de unos 50 a 60 caracteres y las descripciones de unos 150 a 160 caracteres suelen mostrarse completos. Los contadores de aquí son una orientación, no reglas.
¿Necesito etiquetas de Open Graph y de Twitter?
A menudo basta con Open Graph. X (Twitter) lee el título, la descripción y la imagen de Open Graph cuando faltan sus propias etiquetas, pero igual necesita twitter:card para elegir el diseño de la tarjeta. Agrega twitter:site si quieres que se atribuya a tu cuenta.
¿Por qué og:image debe ser una dirección completa?
Las redes sociales descargan la imagen desde sus propios servidores, así que una ruta relativa como /img/card.png no tiene contra qué resolverse. Usa una URL absoluta con https://. Un tamaño común de tarjeta es de 1200 por 630 píxeles.
¿Qué hace la opción de robots?
noindex pide a los buscadores que no listen la página, y nofollow les pide que no sigan sus enlaces. Lo predeterminado para una página sin etiqueta robots es index y follow, así que elegir ambos no escribe ninguna etiqueta.
¿Se escapan los caracteres especiales?
Sí. Los signos &, los signos de menor y mayor y las comillas dobles de tu texto se convierten en entidades HTML, así que un título como Q&A "live" no puede salirse de su atributo ni agregar marcado a la página.
¿Se envía algo a un servidor o se carga mi imagen?
No. Las etiquetas se generan en tu navegador y la dirección de la imagen solo se muestra como texto en la simulación de redes sociales, nunca se solicita. Las redes sociales la descargarán más tarde, cuando alguien comparta la página.