Cómo conseguir que la vista previa en miniatura de tu sitio web se muestre en las comparticiones de Facebook

Escrito por ehow contributor | Traducido por beatriz sánchez
  • Comparte
  • Twittea
  • Comparte
  • Pin
  • E-mail
Cómo conseguir que la vista previa en miniatura de tu sitio web se muestre en las comparticiones de Facebook
(Justin Sullivan/Getty Images News/Getty Images)

Facebook tiene una función de enlaces que permite a los usuarios compartir contenido entre ellos. Esta funcionalidad, también llamada "Compartir" o "Añadir esto", carga un gráfico del sitio para acompañar al enlace. Debido a varios factores, no todos los sitios cargarán una imagen de vista previa. Además de tener el título más largo de todos los tiempos, este artículo también contiene los pasos para asegurar que tu sitio web mostrará una imagen de "Vista previa para compartir".

Nivel de dificultad:
Moderado

Otras personas están leyendo

Necesitarás

  • Un software de manipulación de imagen (opcional)
  • Capacidad para alojamiento de imágenes
  • Acceso a cabeceras HTML

Lista completaMinimizar

Instrucciones

  1. 1

    Antes de pasar por cada una de las páginas de tu sitio añadiendo código y creando imágenes, comprueba que no tengas ya una buena imagen con "Vista previa para compartir". Accede a Facebook, intenta compartir un enlace y mira lo que aparece. Si no consigues una imagen (o al menos una que te guste), continúa.

  2. 2

    Encuentra una imagen que quieras utilizar para representar tu sitio. Puedes utilizar un logotipo, una imagen del sitio, o incluso una captura de pantalla. Asumiendo que sólo quieres que la gente conozca el buen aspecto de tu página en sus navegadores, toma una captura de pantalla de tu sitio web. Puedes hacer esto utilizando el botón de imprimir pantalla, Shift+Comando+3 en un Mac, o algún software de captura de pantallas gratuito.

  3. 3

    Antes de cargar la captura de pantalla, utiliza un software de imagen para cortarla y editarla de la forma que quieras que aparezca en el sitio. Para cargarla, yo la reduciría a 250 píxeles de anchura o menos, y la comprimiría.

  4. 4

    Carga la imagen. Lo mejor es que la cargues en el sitio web real para el que estás generando la vista previa. Aunque puede funcionar con otro servicio como Flickr o Photobucket, a veces no cargará una vista previa de la imagen del sitio.

  5. 5

    Añade una etiqueta de metadatos del origen de la imagen en la cabecera de tu documento. La etiqueta tendrá un aspecto parecido a: < link rel="image_src" href="http://site.com/image.jpg" /> (eliminar el espacio entre < y el enlace). Asegúrate de cambiar el href al lugar en el que está alojada la imagen, usando la dirección URL completa. Para poder conseguir una "Vista previa para compartir" y otras funciones para leer la imagen correctamente, necesitas asegurarte de que está entre las etiquetas de cabecera en tu html. También ayuda tener etiquetas de metadatos "title" (Título) y "description" (descripción).

Consejos y advertencias

  • Facebook toma las imágenes de vista previa, así que si has intentado recientemente generar una vista previa pero no has tenido suerte, intenta utilizar otra dirección (http://site.com/index.html el lugar de http://site.com).
  • El redireccionamiento parece estar en el camino de la vista previa. Si rediriges un dominio, intenta usar la dirección real a la que apunta.
  • Añadir una imagen de vista previa para compartir "img_src" puede hacer que pierdas la habilidad de permitir a los usuarios seleccionar varias imágenes cuando comparten tu sitio. Este código le dice al sitio qué imagen utilizar en lugar de proporcionar más opciones al usuario.

No dejes de ver

Recursos

Filtrar por:
  • Mostrar todos
  • Artículos
  • Galerías de fotos
  • Videos
Ordenar:
  • Más relevante
  • Más popular
  • Más reciente

No se encuentran artículos disponibles

No se encuentran slideshows disponibles

No se encuentran videos disponibles