Generador de Meta Tags
Generate title, description, Open Graph and Twitter card tags, with warnings for the mistakes that break social previews.
Generador de meta tags
Pegar en <head>
<title>How to merge PDFs without uploading them</title>
<meta name="description" content="A short, specific summary of the page — this is what shows under the title in search results.">
<meta name="robots" content="index, follow">
<link rel="canonical" href="https://example.com/blog/merge-pdf">
<!-- Open Graph -->
<meta property="og:type" content="website">
<meta property="og:title" content="How to merge PDFs without uploading them">
<meta property="og:description" content="A short, specific summary of the page — this is what shows under the title in search results.">
<meta property="og:url" content="https://example.com/blog/merge-pdf">
<meta property="og:site_name" content="Example">
<meta property="og:locale" content="en_US">
<!-- Twitter / X -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="How to merge PDFs without uploading them">
<meta name="twitter:description" content="A short, specific summary of the page — this is what shows under the title in search results.">Se ejecuta completamente en tu navegador. Tus datos nunca salen de tu dispositivo.
What next?
FAQ
¿Por qué la descripción se repite tres veces?
Porque tres consumidores diferentes leen tres etiquetas diferentes y ninguno de ellos vuelve a los otros. <meta name="description"> es lo que los motores de búsqueda leen para el fragmento. og:description es lo que Facebook, LinkedIn, Slack, WhatsApp y la mayoría de los desenrolladores de enlaces leen. twitter:description es lo que X lee. Omitir uno significa que esa plataforma no muestra nada, o inventa algo de su texto de página.
La duplicación es inevitable y es por eso que generar estas a mano es lo suficientemente tedioso como para querer una herramienta para ello.
¿Qué significan los conteos de caracteres 60 y 160?
Son donde el truncamiento generalmente comienza, no límites duros. Google procesa títulos en un ancho de píxel en lugar de contar caracteres, por lo que un título de mayúsculas anchas se corta antes que uno de minúsculas estrechas — 60 es una regla de oro confiable. Las descripciones se cortan alrededor de 160, a veces más cortas en dispositivos móviles.
Nada se aplica. Ir más allá es una opción legítima si las palabras importantes vienen primero; el contador está allí para que sea una opción en lugar de un accidente.
¿Por qué advierte sobre una URL de imagen relativa?
Porque og:image es obtenida por un rastreador que solo tiene esa cadena — no tiene página para resolver /og.png contra, y no tiene noción confiable de su origen. Una URL relativa es la razón más común de por qué una vista previa de enlace no muestra imagen, y es invisible en pruebas porque la página misma se procesa bien.
Lo mismo se aplica a og:url, que debe ser absoluto por la misma razón.
¿Cuál es la diferencia entre los dos tipos de tarjeta?
summary_large_image procesa una imagen ancha por encima del texto; summary procesa una pequeña miniatura cuadrada al lado. Grande es adecuado para artículos y páginas de producto; resumen es adecuado cuando no tiene una imagen fuerte o la imagen es un logotipo.
Solicitar una tarjeta de imagen grande sin proporcionar una imagen es advertido, porque las plataformas recurren silenciosamente a una tarjeta de resumen simple y la vista previa se ve rota en lugar de intencional.
¿Están las etiquetas escapadas correctamente?
Sí. Los signos de unión, comillas y corchetes angulares se escapan en cada valor de atributo. Esto importa más de lo que parece: un título como Bob & "Widgets" escrito sin escape cierra el atributo temprano, y el resto de la etiqueta se convierte en marcado perdido en su <head>. Los títulos que contienen comillas son comunes y la rotura es fácil de pasar por alto.
¿Debería agregar un enlace canónico?
Sí, e incluido cuando completa la URL. og:url y <link rel="canonical"> hacen trabajos relacionados pero diferentes — el primero le dice a las plataformas sociales qué URL atribuir a una acción compartida, el segundo le dice a los motores de búsqueda cuál de varias URLs similares es la real. Ambos deben apuntar a la misma dirección.
¿Se envía algo a un servidor?
No. Las etiquetas se ensamblan desde su entrada por concatenación de cadenas en esta pestaña del navegador. Nada se transmite, lo que vale la pena saber dado que los títulos de página no publicados y las URL son frecuentemente lo primero que alguien escribe en una herramienta como esta.
More generators tools
- Generador de Códigos de Barras — Crea un código EAN-13, EAN-8, UPC-A, ITF-14, Code 128, Code 39, Data Matrix, PDF417 o Aztec.
- Generador de UUID — Genera UUID v4, v7 y v1 en el navegador.
- Generador de hash (MD5, SHA-1/256/384/512) — Calcula hashes MD5, SHA-1, SHA-256, SHA-384 y SHA-512 de texto o archivos.
- Generador de contraseñas — Genera contraseñas seguras con aleatoriedad criptográfica.
- Generador de datos de prueba — Genera datos ficticios realistas (usuarios, emails, direcciones, fechas) en JSON, CSV o SQL.
- Generador de Código QR — Genera códigos QR para texto, URLs, vCard, Wi-Fi o email — descarga PNG y SVG, niveles de corrección de errores, personalización de color.