¿Qué son las etiquetas Open Graph?

Son elementos meta (og:title, og:description, og:image, og:url, og:type) que dicen a las apps sociales cómo pintar la vista previa de un enlace. Sin ellas, Facebook, LinkedIn y Slack suelen adivinar un título débil o la imagen equivocada.

¿Qué etiquetas Open Graph necesito?

Empieza por og:title, og:type, og:image y og:url. Añade og:description, og:site_name y og:locale cuando los tengas. Este generador emite solo los campos que rellenas, más og:type (por defecto website).

¿Qué tamaño debe tener og:image?

Usa una URL https absoluta. 1200 x 630 píxeles es el tamaño apaisado habitual para Facebook y LinkedIn. Las imágenes más pequeñas se recortan o caen a una miniatura.

¿También necesito etiquetas Twitter Card?

X (Twitter) puede leer Open Graph, pero twitter:card, twitter:title, twitter:description y twitter:image te dan control explícito. Activa la opción para incluirlas. Con imagen se usa summary_large_image; sin imagen, summary.

¿Dónde pego el HTML?

Pega las etiquetas dentro del head del documento HTML (o de la API de metadatos de tu framework). Deben estar en la URL pública que pones en og:url para que los crawlers las vean.

¿Sale mi texto del dispositivo?

No. El generador de etiquetas Open Graph corre por completo en tu navegador. Títulos, URLs e imágenes no se suben ni se guardan en un servidor.

Herramientas SEO

Popular

Generador de etiquetas Open Graph

Crea etiquetas Open Graph y Twitter Card en tu navegador.

Título de la página

0 caracteres

Descripción

0 caracteres

URL de la página

URL de la imagen

Recomendado 1200 x 630 px. Usa una URL https absoluta.

og:type

Nombre del sitio

Locale

Usa el formato Open Graph como en_US o es_ES.

Etiquetas HTML

Rellena un título, una descripción, una URL o una imagen para generar etiquetas.

Vista previa social

Añade una URL de imagen para previsualizar la imagen del share

www.example.com

El título de tu página

Tu descripción aparece aquí cuando se comparte el enlace.

Acerca de Generador de etiquetas Open Graph

Crea etiquetas Open Graph y Twitter Card en tu navegador. Introduce el título, la descripción, la URL, la imagen, el tipo, el nombre del sitio y el locale, y copia el HTML al head para que Facebook, LinkedIn, Slack y otras apps muestren una tarjeta limpia. Las etiquetas Twitter Card opcionales usan summary_large_image si hay URL de imagen. Nada se sube.

Cómo usar Generador de etiquetas Open Graph

Introduce el título, la descripción, la URL canónica y la URL de la imagen.
Elige un og:type (website, article, product o profile).
Añade un nombre de sitio y un locale opcionales (por ejemplo es_ES).
Deja las etiquetas Twitter Card activas salvo que solo quieras markup Open Graph.
Copia el HTML y pégalo dentro del head de tu página.

Ejemplos de Generador de etiquetas Open Graph

Tarjeta de un artículo

Título "Etiquetas Open Graph para un artículo", tipo article, imagen 1200 x 630 y la URL del post generan og:title, og:type, og:image y og:url listos para pegar en la plantilla.

Portada con nombre del sitio

Usa tipo website, tu marca como og:site_name y la URL de inicio para que Slack y LinkedIn muestren la marca bajo el título.

Ficha de producto

Tipo product más título, descripción, URL e imagen hero da una tarjeta con aspecto de tienda en Facebook y iMessage.

Comillas y ampersands

Un título como Shop "A & B" se escapa a Shop "A & B" para que el HTML siga siendo válido al pegarlo.

Leer la guía completa

Cómo usar Generador de etiquetas Open Graph: guía completa (2026) - 5 min de lectura

Preguntas frecuentes sobre Generador de etiquetas Open Graph

¿Qué son las etiquetas Open Graph?: Son elementos meta (og:title, og:description, og:image, og:url, og:type) que dicen a las apps sociales cómo pintar la vista previa de un enlace. Sin ellas, Facebook, LinkedIn y Slack suelen adivinar un título débil o la imagen equivocada.
¿Qué etiquetas Open Graph necesito?: Empieza por og:title, og:type, og:image y og:url. Añade og:description, og:site_name y og:locale cuando los tengas. Este generador emite solo los campos que rellenas, más og:type (por defecto website).
¿Qué tamaño debe tener og:image?: Usa una URL https absoluta. 1200 x 630 píxeles es el tamaño apaisado habitual para Facebook y LinkedIn. Las imágenes más pequeñas se recortan o caen a una miniatura.
¿También necesito etiquetas Twitter Card?: X (Twitter) puede leer Open Graph, pero twitter:card, twitter:title, twitter:description y twitter:image te dan control explícito. Activa la opción para incluirlas. Con imagen se usa summary_large_image; sin imagen, summary.
¿Dónde pego el HTML?: Pega las etiquetas dentro del head del documento HTML (o de la API de metadatos de tu framework). Deben estar en la URL pública que pones en og:url para que los crawlers las vean.
¿Sale mi texto del dispositivo?: No. El generador de etiquetas Open Graph corre por completo en tu navegador. Títulos, URLs e imágenes no se suben ni se guardan en un servidor.

Comprobador de meta description y vista previa SERP

Comprobador gratis de longitud SERP y vista previa de meta description. Contador de caracteres en vivo y preview del snippet de Google, o genera un borrador. Se ajusta al límite de 150-160.

Generador de slugs

Convierte cualquier título o frase en un slug de URL limpio y SEO-friendly. Minúsculas, sin acentos y con separador de guiones o guiones bajos: gratis, instantáneo y privado.

Comprobador de densidad de keywords

Analiza la densidad de keywords en cualquier texto. Ve las palabras principales y frases de 2-3 palabras con conteos y porcentajes de densidad: gratis, instantáneo y privado.