# Vista previa de tarjeta social _Fuente: https://seomatrix.ai/es/tools/social-preview/_ --- ## Qué hace La vista previa social muestra cómo se verá un enlace como tarjeta en X, Facebook, Telegram y LinkedIn, construida a partir de las etiquetas meta Open Graph (og:) y Twitter Card de la página. Cuando esas etiquetas faltan, el título se corta o la imagen no carga, las plataformas muestran una URL desnuda o texto aleatorio: eso hunde el porcentaje de clics y deja a los bots sociales y a los rastreadores de IA sin un título, descripción e imagen limpios para representar tu página. ## Qué revisa - **og:title** — El titular que la plataforma muestra en la tarjeta; sin él se toma el o se ve una URL desnuda, y un og:title demasiado largo se corta y debilita la tarjeta. - **og:description** — El resumen breve bajo el título; con unos 110-160 caracteres no se trunca, y su ausencia deja la tarjeta vacía o la rellena con texto suelto del cuerpo. - **og:image** — La miniatura de vista previa; debe ser una URL HTTPS absoluta a un archivo accesible (idealmente 1200×630, menos de ~5 MB) o la tarjeta sale sin imagen o rota. - **twitter:card** — Indica a X si dibuja una tarjeta cuadrada pequeña (summary) o un banner grande (summary_large_image); sin la etiqueta, X recurre a un valor por defecto y tu imagen puede no verse a tamaño completo. - **og:url / canonical** — El enlace canónico al que apunta la tarjeta; un og:url erróneo o relativo envía las publicaciones compartidas y la caché de la plataforma a una dirección incorrecta o inexistente. - **og:type / og:site_name** — El tipo (website, article) y el nombre del sitio dan contexto a la plataforma y una etiqueta de marca sobre el título; omitirlos hace que la tarjeta se vea genérica y sin marca. ## Cómo usarla 1. Pega la URL de tu página y ejecuta la vista previa para renderizar las tarjetas de X, Facebook/Telegram y LinkedIn una al lado de otra. 2. Revisa las advertencias señaladas: falta og:image, título truncado, URL de imagen no absoluta o ausencia de twitter:card. 3. Corrige las etiquetas meta en el <head> de la página, vuelve a desplegar y verifica de nuevo — luego limpia la caché de la plataforma (por ejemplo, con el Sharing Debugger de Facebook) para que se relea la tarjeta. ## Preguntas ### ¿Por qué no aparece la imagen al compartir mi enlace? Normalmente la página no tiene og:image, o og:image apunta a una ruta relativa o a una URL que la plataforma no puede alcanzar. Define og:image como una URL HTTPS absoluta de una imagen activa (1200×630 funciona en todas partes) y vuelve a rastrear. ### ¿Cuál es el tamaño ideal de la imagen Open Graph? 1200×630 píxeles (relación 1.91:1) es el tamaño seguro: llena la tarjeta grande en X, Facebook, Telegram y LinkedIn sin recortes. Mantén el archivo por debajo de ~5 MB y sírvelo por HTTPS. ### ¿X, Facebook y LinkedIn leen las mismas etiquetas? Comparten las etiquetas centrales de Open Graph (og:title, og:description, og:image), pero X también lee twitter:card y las etiquetas twitter:* y las prefiere cuando existen. Esta herramienta renderiza las tres tarjetas para detectar las diferencias por plataforma en una sola pasada. ### ¿Por qué sigue mostrándose la vista previa antigua tras corregir las etiquetas? Las plataformas cachean la tarjeta leída. Fuerza una actualización en el depurador de cada plataforma — Sharing Debugger de Facebook, Post Inspector de LinkedIn o volviendo a compartir en X — para que reobtengan las etiquetas Open Graph actualizadas.