¿Qué es Open Graph?

Open Graph: definición e importancia

Cuando pega un enlace en WhatsApp, LinkedIn, Facebook o Slack, suele aparecer una tarjeta de vista previa con imagen, título y descripción. Los servicios obtienen estos datos de las etiquetas Open Graph de la cabecera de la página. Facebook introdujo el protocolo en 2010 y hoy lo leen casi todas las plataformas y mensajeros.

Sin Open Graph, los servicios adivinan: toman cualquier imagen de la página, recortan el título de forma poco afortunada o no muestran ninguna vista previa. Para las empresas es un problema de imagen, porque los enlaces los reenvían a menudo terceros, como clientes, socios y empleados, y la primera impresión se forma ya en la vista previa del chat.

Las etiquetas Open Graph más importantes

Los datos de Open Graph se incluyen como elementos meta con el prefijo og: en la cabecera de la página. Cuatro etiquetas se consideran estándar; otras, como og:site_name u og:locale, las complementan. X (antes Twitter) utiliza además sus propias etiquetas Twitter Card, pero recurre a Open Graph como alternativa.

• og:title – título de la vista previa
• og:description – descripción breve en una o dos frases
• og:image – imagen de la vista previa; lo habitual son 1200 × 630 píxeles (aprox. 1,91:1)
• og:url – dirección preferida de la página
• og:type – tipo de contenido, por ejemplo website o article

Ejemplo práctico: empresa de cubiertas

Una empresa de cubiertas envía presupuestos y páginas de referencias por WhatsApp. Hasta ahora, la vista previa muestra una foto aleatoria y el texto «Página de inicio». Tras añadir las etiquetas Open Graph, aparece una imagen de referencia con el logotipo de la empresa, un título claro y una frase sobre el alcance de los servicios. Los enlaces transmiten más confianza.

WhatsApp, Facebook y LinkedIn guardan las vistas previas en caché. En Facebook y LinkedIn puede actualizarse la versión guardada con el Sharing Debugger y el Post Inspector, respectivamente; en WhatsApp puede tardar un poco en aparecer la nueva vista previa. Tenga en cuenta esta espera cuando haga cambios.

Ventajas, límites y errores habituales

Open Graph no influye en el posicionamiento de Google, pero hace que los enlaces compartidos tengan un aspecto profesional. Eso aumenta la probabilidad de que se haga clic en ellos y de que los destinatarios reconozcan de inmediato de quién procede el enlace. Esto compensa sobre todo en presupuestos, ofertas de empleo o referencias que se envían por chat. Tropiezos típicos:

• Falta la imagen, es demasiado pequeña o tiene un formato incorrecto
• Dirección de imagen relativa en lugar de completa
• Los mismos datos en todas las subpáginas
• Imagen de vista previa sin logotipo o con un texto ilegible en miniaturas pequeñas
• Imagen no accesible, por ejemplo detrás de un inicio de sesión

Imple­menta­ción

Nano Concepts incorpora metaetiquetas completas y etiquetas para compartir en redes en cada proyecto web, incluida una imagen destacada con el logotipo de la empresa, para que los enlaces enviados se vean bien en WhatsApp, LinkedIn y otras plataformas. En tiendas y revistas, el título y la imagen de cada página pueden generarse automáticamente a partir de los contenidos.