Guía de link previewer para enlaces compartidos
Publicado el · Actualizado el
Un link previewer determina cómo aparece una URL compartida en mensajería, redes sociales y herramientas de colaboración. Esta guía explica cómo configurar un link previewer con títulos, descripciones, imágenes, metadatos, caché, redirecciones, pruebas y debugging.
Entiende cómo se crea una vista previa
Una vista previa suele generarse desde los metadatos de la página, no solo desde el diseño visible. Las plataformas pueden revisar HTML, etiquetas sociales, URL canónica, imagen, estado y redirecciones.
Cada plataforma usa su propio crawler y caché. La misma página puede verse distinta. Trata la vista previa como una superficie independiente que necesita configuración y pruebas.
- Trata la vista como superficie propia.
- Revisa metadata y assets.
- Prueba por plataforma.
Escribe títulos y descripciones para compartir
El título debe identificar la página con claridad sin ser demasiado largo. La descripción resume el valor del destino y debe seguir teniendo sentido fuera del contexto de la página.
Los metadatos deben reflejar el contenido real. No prometas una función, precio o resultado que no exista. Usa plantillas para páginas dinámicas con overrides cuando haga falta.
- Mantén título claro.
- Escribe descripción breve.
- Alinea con contenido real.
Elige imágenes de vista previa fiables
La imagen debe ser pública para el crawler, estable, con content type correcto y tamaño adecuado. URLs privadas o firmadas que caducan pueden impedir que aparezca.
Diseña pensando en recortes distintos. Mantén el contenido importante lejos de los bordes y evita información esencial solo en texto pequeño. Versiona la URL cuando cambie la imagen.
- Usa URLs públicas estables.
- Diseña para recorte.
- Versiona imágenes cambiadas.
Configura metadatos sociales
Los metadatos sociales deben estar en el HTML inicial que recibe el crawler. Incluye título, descripción, imagen, URL y tipo con URLs absolutas válidas.
El JavaScript del cliente puede ejecutarse demasiado tarde. Renderiza metadatos dinámicos en servidor y evita etiquetas conflictivas.
- Renderiza en HTML inicial.
- Usa URLs absolutas.
- Evita conflictos.
Gestiona redirecciones y URLs canónicas
Las redirecciones pueden romper la vista previa si hay cadenas largas, autenticación o cambios inesperados. Mantén una ruta corta y predecible al contenido público.
Usa URL canónica de forma coherente. Con parámetros de campaña, decide si la vista representa el enlace trackeado o el destino canónico.
- Mantén redirects cortos.
- Usa canonical de forma coherente.
- Define tracking.
Planifica caché y retrasos de actualización
Las plataformas suelen cachear la vista previa. Los cambios pueden tardar aunque el HTML ya sea correcto. Usa herramientas oficiales de actualización cuando existan.
Versionar la URL de la imagen ayuda cuando cambia realmente. No cambies URLs constantemente solo para forzar caché. Registra qué cambió y cuándo.
- Espera retrasos de caché.
- Usa herramientas de refresh.
- Registra cambios.
Prueba en varias plataformas
Prueba en varias superficies reales: título, descripción, imagen, destino, recorte, idioma y redirecciones. Incluye una publicación nueva sin caché previa.
Usa una checklist con homepage, producto, artículo, contenido dinámico, versión localizada y página con imagen personalizada.
- Prueba páginas representativas.
- Prueba cold share.
- Repite tras cambios.
Depura vistas previas rotas o antiguas
Si falla, revisa estado, URL final, redirecciones, HTML para bots, metadatos, acceso a imagen, robots, caché y CDN. El problema puede estar en distintas capas.
Infera Agent puede inspeccionar metadatos, comparar respuestas, probar rutas y detectar imágenes inaccesibles cuando la vista esperada está definida.
Antes de lanzar, usa una checklist de metadata, acceso a imagen, URL canónica, redirecciones, respuesta del crawler, localización, caché y plataformas de prueba. Evita tarjetas inconsistentes.
Después, sigue imágenes rotas, tarjetas antiguas, títulos incorrectos, redirects inesperados, problemas de idioma y fallos por plataforma. Estos patrones muestran la capa responsable.
Antes de lanzar, usa una checklist de metadata, acceso a imagen, URL canónica, redirecciones, respuesta del crawler, localización, caché y plataformas de prueba. Evita tarjetas inconsistentes.
Después, sigue imágenes rotas, tarjetas antiguas, títulos incorrectos, redirects inesperados, problemas de idioma y fallos por plataforma. Estos patrones muestran la capa responsable.
Antes de lanzar, usa una checklist de metadata, acceso a imagen, URL canónica, redirecciones, respuesta del crawler, localización, caché y plataformas de prueba. Evita tarjetas inconsistentes.
Después, sigue imágenes rotas, tarjetas antiguas, títulos incorrectos, redirects inesperados, problemas de idioma y fallos por plataforma. Estos patrones muestran la capa responsable.
- Inspecciona la respuesta.
- Comprueba la imagen.
- Conserva evidencia reproducible.
Preguntas
¿Qué controla un link previewer?
Metadatos, título, descripción, imagen, URL canónica, redirecciones, acceso del crawler y caché de la plataforma.
¿Por qué aparece una vista previa antigua?
La plataforma puede tener una versión en caché. Puede ser necesario usar una herramienta de refresh o versionar una imagen realmente cambiada.
¿Conviene generar metadata solo con JavaScript?
El HTML inicial o server-rendered suele ser más fiable porque algunos crawlers no ejecutan todo el JavaScript.
¿Cómo ayuda Infera Agent?
Puede inspeccionar metadata, comparar respuestas, probar rutas y detectar imágenes inaccesibles.