Vista previa de enlaces en redes sociales
Previsualiza cómo puede verse un enlace al compartirlo en Facebook, X y LinkedIn a partir de su título, descripción e imagen, o carga las etiquetas og: desde la URL.
¿Qué es Vista previa en redes sociales?
Esta herramienta muestra, una junto a otra, maquetas aproximadas de las tarjetas de enlace que Facebook, X (Twitter) y LinkedIn presentan para una URL. Escribe el título, la descripción y la URL de la imagen, o pulsa «Cargar etiquetas desde la URL» para leer automáticamente las etiquetas Open Graph y de Twitter de la página.
Cómo usar Vista previa en redes sociales
- Introduce la URL de la página; opcionalmente pulsa Cargar etiquetas desde la URL para rellenar los campos con sus etiquetas og: y twitter:.
- Edita el título, la URL de la imagen y la descripción para probar variantes.
- Compara las tres maquetas de tarjeta; los textos largos se acortan como suele hacerlo cada red.
Cuándo usar Vista previa en redes sociales
Úsala para iterar sobre los títulos y las imágenes para compartir antes de publicar. Las maquetas son aproximaciones (las tarjetas reales dependen de la versión de la aplicación, el tamaño de pantalla y la caché de cada red), así que confirma con los depuradores oficiales en las campañas importantes.
Cómo funciona Vista previa en redes sociales
Las vistas previas se renderizan localmente con el diseño de tarjeta actual de cada red (imagen 1,91:1, nombre de host, título y descripción) y límites de caracteres aproximados. «Cargar etiquetas desde la URL» usa la Pages Function de AlgoKit protegida contra SSRF para descargar la página y extraer sus meta etiquetas (og:title, og:description, og:image, twitter:*, con el título y la descripción HTML como alternativa). La imagen se muestra directamente desde la URL que introduces.
Casos de Uso Comunes
- Comprobar que el título de un blog no se corta en Facebook.
- Ver cómo se recorta la imagen de un producto en una tarjeta ancha.
- Comparar la vista previa de dos variantes de titular.
- Verificar que el og:image de una página publicada está bien configurado.
Preguntas Frecuentes
¿Estas vistas previas son exactas?
No. Siguen los diseños actuales de las redes, pero las fuentes, el recorte de texto y el encuadre varían según el dispositivo y cambian con el tiempo.
¿Por qué falla Cargar etiquetas desde la URL?
Puede que la página bloquee bots, requiera iniciar sesión, esté en una red privada o esté caída. Aun así, puedes escribir los valores a mano.
¿Qué etiquetas se leen?
Primero og:title, og:description, og:image y og:url; luego twitter:title/description/image; y después el <title> y la meta description de la página.