Generador de meta tags - Open Graph y Twitter Cards con vista previa
Generar meta tags
A step-by-step guide to grind size, water temperature and brew ratios for café-quality coffee in your own kitchen.
Qué hacen las meta tags y cuáles importan
Las meta tags son las líneas de la sección head de una página que los buscadores y las redes sociales leen en lugar de la página en sí. El título y la descripción dan forma a tu fragmento en Google; las etiquetas Open Graph y Twitter Card deciden la imagen, el titular y el texto que aparecen al compartir el enlace. Este generador las escribe todas desde un solo formulario y muestra el resultado tal como se verá.
Pasos
- 1 Introduce el título y la descripción de la página. Los contadores muestran las longitudes que suelen caber en los resultados de búsqueda: unos 60 y 160 caracteres.
- 2 Añade la URL canónica, el nombre del sitio y una imagen de 1200×630. Elige el tipo de contenido, la configuración regional y el diseño de la tarjeta; las tres vistas previas se actualizan mientras escribes.
- 3 Copia las etiquetas generadas y pégalas dentro de la sección head de tu página, sustituyendo las etiquetas de título y descripción existentes.
Título y descripción
La etiqueta title es el titular azul de los resultados de búsqueda y el texto de la pestaña del navegador. Mantenla por debajo de unos 60 caracteres y pon primero las palabras distintivas; Google recorta por ancho en píxeles, así que las letras anchas consumen espacio más rápido. La descripción no es un factor de posicionamiento, pero es tu anuncio en los resultados: 150–160 caracteres que dicen qué ofrece la página y por qué hacer clic. Google puede sustituirla por texto de la página si lo considera más adecuado.
Open Graph
Facebook, LinkedIn, WhatsApp, Slack y la mayoría de las apps de mensajería leen og:title, og:description, og:image y og:url para construir la vista previa del enlace. La imagen debe ser de 1200×630 píxeles (1,91:1), pesar menos de 8 MB y darse como URL absoluta. og:type es website para la mayoría de las páginas y article para las publicaciones; og:site_name aparece sobre el titular en algunas redes. Sin estas etiquetas, al compartir puede mostrarse una imagen cualquiera de la página o ninguna.
Twitter Cards
X usa sus propias etiquetas pero recurre a Open Graph para lo que falte, así que sobre todo necesitas twitter:card para elegir el diseño (summary_large_image para una imagen a todo el ancho, summary para una miniatura cuadrada pequeña) y twitter:site para la cuenta a acreditar. Título, descripción e imagen se repiten aquí para las redes que solo leen el conjunto twitter:.
URL canónica y robots
El enlace canónico indica a los buscadores qué dirección es la original cuando el mismo contenido es accesible desde varias URL (con y sin parámetros, http y https, barra final). Usa siempre la URL absoluta completa. La etiqueta robots suele ser innecesaria (index, follow es el valor por defecto) y solo merece añadirse para mantener una página fuera de los resultados con noindex.