Abrir herramienta de vista previa de gráficos
Obtenga una vista previa de cómo aparece su página cuando se comparte en Facebook, X (Twitter), LinkedIn, WhatsApp, Slack y Discord. Verifique og:title, og:description, og:image, etiquetas de tarjetas de Twitter y obtenga un informe calificado con recomendaciones prácticas para mejorar el intercambio social, todo procesado de forma segura en su navegador.
Paste your HTML source code below to see exactly how your page will appear when shared on Facebook, X (Twitter), LinkedIn, WhatsApp, Slack, and Discord. All processing runs locally in your browser.
¿Por qué utilizar nuestra herramienta de vista previa de Open Graph?
- Sugerencias de soluciones prácticas: cada problema detectado incluye una explicación clara y sugerencias de soluciones prácticas. Aplique los cambios con confianza sabiendo exactamente qué es necesario mejorar y por qué.
- 100% privado y gratuito: todos los análisis se realizan localmente en su navegador. No se cargan datos en ningún servidor, no es necesario registrarse ni hay límites de uso. Úselo tantas veces como necesite, completamente gratis.
Casos de uso comunes para la herramienta de vista previa de Open Graph
- Compartir en Facebook e Instagram: obtenga una vista previa de cómo aparece su página como una vista previa del enlace de Facebook y una tarjeta de historia de Instagram. Verifique que og:title, og:description y og:image se procesen correctamente con la relación de aspecto correcta (1200×630px) antes de compartir.
- Tarjetas X (Twitter): consulte el marcado de su tarjeta de Twitter para ver los tipos de tarjetas resumen, resumen_imagen_grande y de jugador. Obtenga una vista previa del diseño exacto que muestra X, incluido el título, la descripción, la imagen y la atribución de dominio.
- Vista previa de enlaces de LinkedIn: asegúrese de que sus artículos y páginas muestren vistas previas profesionales en los feeds de LinkedIn. Verifique que las imágenes OG cumplan con la recomendación de LinkedIn de 1200 × 628 píxeles y que las descripciones encajen en la tarjeta de vista previa.
- Enlaces de aplicaciones de mensajería: obtenga una vista previa de cómo aparecen los enlaces compartidos en WhatsApp, Telegram y otras aplicaciones de mensajería. Estas plataformas utilizan etiquetas OG para generar vistas previas de enlaces enriquecidas con miniaturas y descripciones.
- Control de calidad y depuración del desarrollador: depure problemas de etiquetas OG durante el desarrollo. Verifique que las plantillas de CMS, los metadatos de Next.js y las páginas renderizadas en el servidor produzcan etiquetas sociales correctas antes de implementarlas en entornos de producción.
- Control de calidad del marketing de contenidos: valide los metadatos sociales para publicaciones de blogs, páginas de destino y campañas de marketing antes del lanzamiento. Garantice la coherencia de la marca en todas las plataformas para compartir con títulos, imágenes y descripciones precisas.
¿Qué es el análisis de etiquetas de Open Graph?
El análisis de etiquetas Open Graph examina Open Graph, Twitter Card y metaetiquetas sociales en documentos HTML para identificar problemas, mejorar la calidad y garantizar las mejores prácticas. Esta herramienta proporciona una evaluación integral que le ayuda a comprender el estado actual y lo que debe mejorarse.
Cómo funciona nuestro analizador
- Ingrese su contenido: cargue un archivo, pegue el contenido o ingrese la URL que desea analizar. La herramienta acepta una amplia gama de formatos de entrada para una máxima flexibilidad.
- Análisis integral: el analizador procesa sus datos comparándolos con una lista de verificación detallada de reglas, mejores prácticas y métricas de calidad. Cada control se evalúa de forma independiente para obtener resultados precisos.
- Revisar y aplicar correcciones: explore los resultados del análisis organizados por categoría. Cada hallazgo incluye una explicación clara y sugerencias de soluciones prácticas que puede aplicar directamente.
Casos de uso comunes para etiquetas Open Graph
verificar vistas previas de uso compartido de redes sociales antes de publicarlas, verificar imágenes y descripciones de OG para Facebook y LinkedIn, validar el marcado de tarjetas de Twitter, depurar apariciones de enlaces compartidos en WhatsApp y Discord, y auditar metadatos sociales durante las migraciones de sitios web. La herramienta está diseñada para desarrolladores, ingenieros de control de calidad y miembros del equipo técnico que necesitan una apariencia para compartir en las redes sociales, tasas de clics y coherencia de marca en todas las plataformas para compartir.
Privacidad, seguridad y disponibilidad
Todo el análisis se realiza íntegramente dentro de su navegador mediante el procesamiento del lado del cliente. Nunca se cargan datos en ningún servidor: cada byte permanece en su dispositivo. No hay límites de tamaño de archivos, requisitos de registro ni límites de uso. La herramienta es 100% gratuita y no tiene funciones premium ocultas.
Preguntas frecuentes
Una herramienta de vista previa de Open Graph le permite ver exactamente cómo aparecerá su página cuando se comparta en plataformas de redes sociales como Facebook, X (Twitter), LinkedIn, WhatsApp, Slack y Discord. Analiza su HTML para extraer og:title, og:description, og:image, etiquetas de tarjetas de Twitter y ofrece vistas previas visuales para cada plataforma, todo localmente en su navegador.
Esta herramienta verifica og:title, og:description, og:image, og:url, og:type, og:site_name, og:locale, og:image:width, og:image:height, og:image:alt, twitter:card, twitter:title, twitter:description, twitter:image, twitter:site, twitter:creator, y recurre a etiquetas de título y metadescripciones cuando se usan etiquetas OG desaparecido.
¡Absolutamente! Todo el procesamiento se ejecuta directamente en su navegador mediante JavaScript. No se carga ningún contenido HTML en ningún servidor. Sus datos nunca salen de su dispositivo, lo que hace que esta sea la forma más segura de obtener una vista previa de las etiquetas de Open Graph.
El tamaño de imagen og: recomendado es 1200×630 píxeles para Facebook y la mayoría de las plataformas. LinkedIn recomienda 1200×628px. Para las tarjetas de resumen_imagen_grande de Twitter, utilice al menos 600 × 314 px. El tamaño mínimo aceptable en todas las plataformas es 200×200px. Utilice siempre URL absolutas que comiencen con https:// para og:image.
Los motivos comunes incluyen: falta la etiqueta og:image, usar una URL relativa en lugar de absoluta, la URL de la imagen devuelve un 404, la imagen es demasiado pequeña (menos de 200 × 200 px), el formato de imagen no es compatible (use JPEG, PNG o WebP) o caché de la plataforma: use Facebook Sharing Debugger o LinkedIn Post Inspector para borrar los datos almacenados en caché.
Las etiquetas Open Graph (og:title, og:description, og:image) fueron creadas por Facebook y se utilizan en la mayoría de las plataformas sociales. Las tarjetas de Twitter (twitter:tarjeta, twitter:título, twitter:descripción, twitter:imagen) son específicas de X (Twitter). Si faltan etiquetas de Twitter Card, X recurre a las etiquetas OG. El uso de ambos garantiza una visualización óptima en todas las plataformas.
Utilice el depurador de uso compartido de Facebook endevelopers.facebook.com/tools/debug/. Pega tu URL y haz clic en "Scrape Again" para obligar a Facebook a volver a leer tus etiquetas OG. Para LinkedIn, utilice el inspector de publicaciones. Para X, los datos de OG normalmente se actualizan a los pocos minutos de los cambios de página.
Sí, nuestra herramienta de vista previa de Open Graph es 100% gratuita, sin costos ocultos, requisitos de registro, niveles premium ni límites de uso. Obtenga una vista previa de las etiquetas OG ilimitadamente para cualquier proyecto (personal, comercial o empresarial) completamente gratis.