Generador de metaetiquetas

Previsualiza, edita y genera metaetiquetas Open Graph + Twitter Card. Mira cómo se ve tu página en Google, Facebook, X, LinkedIn, Pinterest y Slack, antes de publicarla.

Vista previa

Google

https://so-me.studio

Metaetiquetas, Previsualiza, edita y genera

Con las metaetiquetas puedes editar y experimentar con tu contenido y previsualizar cómo se verá tu página web en Google, Facebook, X y más.

X (Twitter)

Sin imagen

Desde so-me.studio

Metaetiquetas, Previsualiza, edita y genera

Con las metaetiquetas puedes editar y experimentar con tu contenido y previsualizar cómo se verá tu página web en Google, Facebook, X y más.

Facebook

Sin imagen

so-me.studio

Metaetiquetas, Previsualiza, edita y genera

Con las metaetiquetas puedes editar y experimentar con tu contenido y previsualizar cómo se verá tu página web en Google, Facebook, X y más.

LinkedIn

Sin imagen

Metaetiquetas, Previsualiza, edita y genera

so-me.studio

Pinterest

Sin imagen

Metaetiquetas, Previsualiza, edita y genera

so-me.studio

Slack

so-me.studio

Metaetiquetas, Previsualiza, edita y genera

Con las metaetiquetas puedes editar y experimentar con tu contenido y previsualizar cómo se verá tu página web en Google, Facebook, X y más.

Las metaetiquetas deciden cómo se ve tu página al compartirla en redes sociales, resultados de búsqueda y vistas previas de chat. Si están mal, tu enlace se ve roto en LinkedIn o ilegible en Slack. Este generador de metaetiquetas gratuito previsualiza tus etiquetas Open Graph + Twitter Card en todas las plataformas principales, Google, Facebook, X, LinkedIn, Pinterest, Slack, antes de publicar.

Qué hacen realmente las metaetiquetas

Tres categorías de metaetiquetas controlan cómo aparece tu página en la web. (1) Las etiquetas SEO, <title> y <meta description>, deciden cómo te muestra Google en los resultados de búsqueda. (2) Las etiquetas Open Graph (og:*) controlan las vistas previas de Facebook, LinkedIn, Slack y la mayoría de las apps de chat. (3) Las etiquetas Twitter Card (twitter:*) controlan específicamente las vistas previas de X.

Sin metaetiquetas, las plataformas improvisan: suelen tomar texto al azar de tu página y la primera imagen que encuentran. El resultado se ve roto. Con las metaetiquetas adecuadas, controlas toda la vista previa.

Metaetiquetas imprescindibles en cada página

Lo mínimo para una vista previa cuidada: <title> (60 caracteres), <meta name=description> (160 caracteres), <meta property=og:title>, <meta property=og:description>, <meta property=og:image> (se recomienda 1200×630), <meta property=og:url> y <meta property=og:type> ('website' para la mayoría de las páginas).

Para controlar lo específico de Twitter: <meta name=twitter:card> (normalmente 'summary_large_image'), además de los valores propios twitter:title, twitter:description y twitter:image si quieres una vista previa distinta en X.

El generador produce todas estas etiquetas a partir de los datos que introduces.

Especificaciones de la imagen OG que funcionan en todas partes

1200×630 píxeles (relación 1,91:1): funciona en Facebook, LinkedIn, Twitter, Slack, Discord e iMessage. Las imágenes más pequeñas se recortan automáticamente de forma extraña; las más grandes se reducen de tamaño.

Peso inferior a 5 MB, porque algunas plataformas rechazan los archivos más grandes. JPG o PNG. Incluye texto legible en la propia imagen: muchas plataformas muestran las imágenes OG en el feed antes que cualquier texto de acompañamiento, así que la imagen tiene que comunicar valor por sí sola.

Depurar las vistas previas de las metaetiquetas

La mayoría de las plataformas guardan en caché los datos OG de forma agresiva. Si actualizas tus metaetiquetas pero sigue apareciendo la vista previa antigua, usa estos depuradores para forzar la actualización:

  • Facebook: Facebook Sharing Debugger (developers.facebook.com/tools/debug)
  • X: X Card Validator (cards-dev.twitter.com/validator)
  • LinkedIn: LinkedIn Post Inspector (linkedin.com/post-inspector)
  • Pinterest: Pinterest Rich Pin Validator (developers.pinterest.com/tools/url-debugger)
  • Google: Rich Results Test (search.google.com/test/rich-results)

Cada depurador fuerza un nuevo rastreo de tu página para que las nuevas metaetiquetas se propaguen.

Consejos para sacarle el máximo partido a esta herramienta

  • Imagen OG: 1200×630 px. Funciona en todas las plataformas principales.
  • Añade texto legible en la imagen OG: muchas vistas previas del feed muestran la imagen antes que el texto.
  • Título: 60 caracteres como máximo. Por encima, Google lo trunca.
  • Descripción: 150-160 caracteres. Misma regla de truncamiento.
  • Tras actualizar las metaetiquetas, ejecuta los depuradores de cada plataforma para forzar la actualización de la caché.

Preguntas frecuentes

¿Es gratuito el generador de metaetiquetas?

Sí. Gratis, sin registro y sin límites.

¿Qué tamaño debe tener mi imagen OG?

1200×630 píxeles (relación 1,91:1). Funciona en Facebook, LinkedIn, X, Slack, Discord e iMessage sin recorte automático.

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

Open Graph por sí solo cubre la mayoría de las plataformas (X recurre a OG si faltan las etiquetas de Twitter). Añade las etiquetas Twitter Card solo si quieres una vista previa en X distinta de la del resto de plataformas.

¿Por qué no aparece mi metaetiqueta actualizada en las vistas previas de Facebook?

Facebook guarda en caché los datos OG. Usa el Sharing Debugger de Facebook para forzar la actualización de la caché tras modificar las etiquetas.

¿Qué diferencia hay entre la meta description y la descripción OG?

La meta description aparece en los resultados de búsqueda de Google. La descripción OG aparece en las vistas previas de las redes sociales. Pueden ser iguales o distintas: define la descripción OG por separado si quieres un texto distinto para redes sociales y para buscadores.

Programa una vez.
Publica en todas partes.

Deja de hacer malabares con pestañas: redacta, adapta y publica en 20 plataformas desde un único calendario.