Cómo hacer que una imagen aparezca y cargue más rápido

Escrito por brian valle | Traducido por lucrecia garcía
  • Comparte
  • Twittea
  • Comparte
  • Pin
  • E-mail
Cómo hacer que una imagen aparezca y cargue más rápido
La optimización de tus imágenes para su visualización en la web hará que se carguen más rápido. (Ablestock.com/AbleStock.com/Getty Images)

Al publicar imágenes en internet, es importante asegurarte de que estén optimizadas para su visualización en la web. De esta manera, puedes hacer que se carguen más rápido. Por el contrario, las imágenes de carga lenta tienden a desalentar a los visitantes y pueden impedir que disfruten plenamente de tu sitio web. La mejor manera de asegurarte de que tus imágenes se carguen más rápido es exprimir tanta calidad como puedas en un archivo de tamaño fijo. Para verlos en la web, es una buena idea mantener el tamaño de cada una de las imágenes por debajo de 50Kb.

Nivel de dificultad:
Difícil

Otras personas están leyendo

Necesitarás

  • Un editor de imágenes (Photoshop, PaintShopPro, GIMP o Pixlr)

Lista completaMinimizar

Instrucciones

  1. 1

    Utiliza el formato correcto. Utiliza JPEG para imágenes con gradientes y muchas mezclas de color. Para las imágenes que contienen formas de alto contraste y texto, puedes utilizar GIF o PNG. La mayoría de los software de edición de imágenes soporta conversiones de varios formatos.

  2. 2

    Cambia la resolución de la imagen a 72 ppp (puntos por pulgada). La mayoría de las pantallas y monitores muestran las páginas web y las imágenes en esta resolución. Utiliza esta resolución también para reducir las distorsiones y problemas de color.

  3. 3

    Maximiza el recorte de tu imagen. Por ejemplo, si se coloca el tema de la imagen sobre un fondo sólido, recorta la mayor parte del color sólido. Obtendrás un tamaño de archivo más pequeño.

  4. 4

    Aplícale un ligero desenfoque a la imagen. Comienza por aplicar un desenfoque gaussiano de radio de 0,2 píxeles. Un desenfoque Gaussian de radio de 1,0 píxeles debe ser suficiente para reducir el tamaño del archivo de la imagen en aproximadamente un 23 por ciento. Para evitar la pérdida de calidad, prueba borrar sólo el fondo de la imagen o una parte de ella que no se destaque.

  5. 5

    Aísla el sujeto de la imagen con la herramienta de selección y añade más desenfoque para el resto de la imagen. Esto reducirá el tamaño del archivo de la imagen. Como beneficio adicional, haces que tus temas destaquen más.

Consejos y advertencias

  • En el marcado HTML, asegúrate de indicar el ancho y la altura de cada imagen que incrustas. De esta manera, los navegadores no tienen que calcular el tamaño ideal para tu imagen.
  • Utiliza sprites de imagen cada vez que puedas. Combina imágenes más pequeñas en un solo archivo de imagen grande para reducir el número de peticiones HTTP que tu página web tiene que hacer. Con esto, puedes hacer que tus imágenes se carguen más rápido.

No dejes de ver

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