Herramientas y trucos para optimizar las imágenes de tu web

Trucos y herramientas para optimizar con facilidad las imágenes de tu web

Introducción

Las imágenes y elementos gráficos de tu web, tales como iconos o viñetas, consolidan la personalidad de tu negocio y son un claro distintivo de tu imagen de marca. Pero si subes imágenes a tu servidor sin optimizar o con un tamaño inadecuado, pueden resultar muy perjudiciales.

En este artículo te vamos a enseñar por qué debes optimizar todas las imágenes que utilices en tu web, qué necesitas saber y con qué herramientas gratuitas disponibles en internet.

Por qué debes optimizar las imágenes de tu web

Hoy en día es fundamental optimizar las imágenes que se muestran en una web de manera correcta. La cantidad de ilustraciones que tiene tu web y su tamaño influyen de forma considerable en el tiempo de carga de sus páginas. La velocidad de carga es un factor muy a tener en cuenta desde que Google comenzó a poner en valor la necesidad de reducir el tiempo que una web tarda en mostrarse.

De poco sirve realizar un riguroso trabajo de optimización SEO, si después subes a tu servidor imágenes que pesan varias megas, provocando que el tiempo de carga se alargue.

Y además, vas a motivar que tus visitantes desesperen esperando que una página se muestre por completo, y que al final terminen abandonando y se vayan por donde han venido. Muchas personas no son conscientes, pero una web lenta y pesada puede lograr un porcentaje muy alto de rebote y generar pérdida de usuarios y, por supuesto, de ventas.

Otro gran inconveniente es que puedes llegar a saturar tu servidor, siendo necesario adquirir uno de mayores prestaciones solo por el hecho de no cuidar la optimización de tus imágenes.

Por tanto, ahora lo sabes: si descuidas la optimización de las imágenes de tu web, la velocidad de carga, la pérdida de visitas y la saturación de servidor se verán afectadas de forma muy negativa. Y esto va a provocar una disminución considerable de tu posicionamiento.

Qué tienes que tener en cuenta para saber optimizar imágenes sin perder calidad

Los principales aspectos que tienes que conocer para optimizar imágenes de forma correcta, son:

  • El tamaño, saber las dimensiones que deben tener con el fin adaptarlas de manera exacta al lugar que han de ocupar.
  • El formato, seleccionar el tipo más adecuado acorde al modo en que se muestran dentro de tu web.
  • La compresión, conseguir reducir su peso lo más posible sin que afecte a su calidad.

La combinación de estos tres factores es la forma con la que vas a lograr la optimización más completa de tus imágenes. Veamos cómo trabajar con cada uno de ellos.

Optimiza el tamaño de las imágenes para web

Para optimizar el tamaño de las imágenes, lo primero es conocer las dimensiones que han de tener a fin de adaptarlas lo más exacto posible al espacio que van a ocupar. Como norma general debes saber que, cuanto más grande es una imagen, más tamaño tendrá su archivo. Así que si, por ejemplo, estás usando una plantilla que muestra las fotos de tu blog a 640 píxeles de ancho por 400 de alto, lo ideal es que las edites para conseguir que tenga esas dimensiones. Pero debes tener cuidado de hacerlo sin deformar su aspecto, reduciendo y recortando lo que sea necesario para mantener sus proporciones.

Si necesitas una herramienta con la que redimensionar o recortar imágenes, iLoveIMG seguro que te servirá. Te recomendamos modificar primero las dimensiones manteniendo la relación de aspecto, cambiando los píxeles de manera que una de ellas tenga el valor que buscamos, y la otra el otro valor o superior. Después, podrás recortar lo que sobre hasta conseguir las medidas de alto y ancho exactas al lugar que vayan a ocupar, o bien las que tu desarrollador web te haya recomendado.

Elige el formato adecuado para cada situación

Elegir adecuadamente el tipo de imagen que necesitas en cada caso es decisivo. Una mala selección provocará que el archivo tenga más peso del deseable y esto afectará a la carga de tu web, haciendo que tu posicionamiento se vea perjudicado. Tenemos varios tipos de imagen que tienes que conocer y saber diferenciar:

  • PNG – produce imágenes de mayor calidad y obtiene menos pérdidas al comprimirla, pero tiene un tamaño de archivo más grande. Es el tipo de formato ideal para imágenes con colores planos y fotografías que tengan fondo transparente.
  • JPEG – se puede ajustar el nivel de calidad mediante un buen equilibrio entre esta y el tamaño de archivo, el fondo no es transparente y aunque tiene un menos peso que la anterior, se obtiene más pérdida de calidad con una compresión inadecuada. Es un formato perfecto para fotografías, llegando a reducir de manera considerable su peso. Como norma general, por encima del 70% la foto se verá bastante bien y la perdida de información será casi inapreciable.
  • GIF – solo utiliza 256 colores. Es la mejor opción para imágenes animadas y usa una compresión sin pérdida de calidad.
  • SVG – es un formato vectorial que permite mostrar en cualquier tamaño un gráfico guardado con esta extensión sin pérdida alguna de calidad. Es la manera ideal de mostrar el logotipo de tu empresa o los iconos de tu web. Como norma general, formas con colores planos y sin fondo.

Comprime las imágenes si perder calidad

Por último, llegamos al final del proceso de optimización: la compresión. Esto significa reducir el peso de una imagen todo lo que podamos, tratando de obtener la menor pérdida de calidad posible. Una vez completada esta fase se produce una reducción de la información, pero puedes lograr que esa disminución de datos no afecte y resulte imperceptible para el ojo humano, perjudicando lo menos posible a la calidad con la que se verá la imagen.

A continuación te facilitamos algunas herramientas online gratuitas que te ayudarán a obtener resultados de compresión muy buenos:

Con cualquiera de estas aplicaciones, lo que debes hacer es simplemente subir o arrastrar las imágenes que quieres comprimir, y después descargártelas a tu ordenador. ¡Y ya las tienes listas para subir al servidor de tu web!.

Conclusiones

Ya has visto que optimizar el peso de las imágenes de tu web es un procedimiento fundamental a la hora de favorecer todo lo posible su posicionamiento. Recuerda siempre seguir estos pasos que te hemos explicado:

  1. Redimensionar y recortar sin deformar.
  2. Elegir el tipo de archivo más conveniente.
  3. Comprimir manteniendo una buena calidad.

Si realizas estos pasos cada vez que tengas que subir una imagen a tu web, verás que en poco tiempo lo harás de forma casi automática. Y además, ten por seguro que Google tendrá en cuenta tu esfuerzo por mantener tu web en condiciones óptimas de velocidad y navegación.

¿Te ha resultado útil este recurso?

Image

Únete a nuestro newsletter de Recursos Gratis para estar al día de las últimas publicaciones.

Por favor, habilite el javascript para enviar este formulario


Comentarios gracias a CComment

Puede que también te interese