Cuando un artículo presenta otra página, el enlace puede aparecer como texto o como una tarjeta con título, descripción, URL y a veces una imagen. Suele llamarse blog card, link card o vista previa de enlace.
Una imagen hace que la tarjeta destaque, pero no siempre debería ser el valor por defecto. La decisión cambia según si la imagen se obtiene automáticamente, se define manualmente en el artículo o se omite cuando no aporta demasiado.
Cómo lo resuelven muchos blogs
Muchas plataformas de blog y CMS generan una tarjeta cuando pegas una URL. Obtienen el título, la descripción y la imagen Open Graph, y muestran una vista previa en el editor o en el artículo publicado.
Eso no siempre significa que la página de destino se consulte cada vez que alguien lee el artículo. En muchos sistemas, el resultado se guarda al pegar, al publicar o en una caché del servicio. Si la página de destino cambia su imagen OGP después, la tarjeta del artículo puede no actualizarse de inmediato.
- Una URL pegada puede expandirse automáticamente como tarjeta
- El resultado obtenido puede guardarse en datos del artículo o en caché
- Si no hay imagen, la tarjeta puede mostrar título, descripción y dominio
- Algunas plataformas ofrecen poco control sobre el diseño
- Los enlaces internos pueden usar tarjetas más completas y los externos tarjetas simples
Lo que aportan las tarjetas con imagen
Una tarjeta con imagen ayuda a entender el destino antes de hacer clic. Es útil para apps, productos, servicios, eventos y artículos visuales donde un icono o una imagen Open Graph añade contexto.
También ayuda a separar varias tarjetas dentro del mismo artículo. Cuando hay muchos enlaces externos juntos, la diferencia visual puede facilitar el escaneo más que una lista de enlaces de texto.
Lo que complica las tarjetas con imagen
Las imágenes externas introducen fallos posibles. La imagen puede estar bloqueada, faltar, recortarse mal, cambiar después o hacer más pesada la carga. La interfaz también necesita un fallback cuando la imagen no está disponible.
- Las imágenes externas pueden fallar por protección hotlink o restricciones de fetch
- La proporción de la imagen OGP puede no encajar con la tarjeta
- Un cambio de imagen en el destino puede cambiar el aspecto del artículo
- Muchas tarjetas con imagen pueden afectar rendimiento y estabilidad visual
- Iconos de apps y logotipos pueden requerir revisar condiciones de uso
Las imágenes manuales son menos llamativas, pero más estables
En sitios pequeños o editoriales que quieren controlar el resultado, un campo manual de imagen puede ser un buen equilibrio. Añade trabajo de edición, pero permite elegir la imagen, el recorte y la descripción.
Las tarjetas solo de texto también son válidas. En sitios con documentación, notas técnicas o reportes de verificación, el título, una descripción breve y el dominio pueden ser suficientes.
Un valor por defecto práctico para TOOLPOOL
En un sitio como TOOLPOOL, centrado en notas, comprobaciones y explicaciones de herramientas, las tarjetas de texto son un buen valor por defecto. El lector entiende a dónde lleva el enlace y por qué aparece en el artículo.
Si más adelante se añaden imágenes, conviene que sean opcionales. Introducciones de apps, notas sobre servicios y páginas de producto pueden beneficiarse de una imagen; enlaces simples a documentación normalmente no la necesitan.
Una ruta de implementación razonable
- Empezar con título, descripción y dominio
- Añadir imagen como campo opcional
- Diseñar primero el estado sin imagen
- Incorporar obtención automática solo después de definir caché y fallos
- Revisar condiciones antes de usar iconos de apps o logotipos
Una blog card no es solo decoración. Ayuda a entender a dónde va el enlace y por qué forma parte del artículo. La imagen debería decidirse desde ese objetivo, no solo por hacer la tarjeta más vistosa.