Optimización de Imágenes, mejoras en SEO

Nada mejor que tener una página web limpia y en insuperables condiciones, con el rendimiento al 100%. Esto, en parte, solo se puede lograr gracias a una optimización de todas las imágenes que estén en la web.

Este trabajo es sumamente importante porque las imágenes crean un mayor tiempo de carga al entrar a la página. Sencillo: a mayor peso, mayor la espera para acceder.

Pero lo que suma un real problema, no es solo esto, sino lo que llega a consecuencia de la nula optimización: la pésima experiencia de los usuarios.

Si un usuario entra en nuestra página web y se encuentra con que las imágenes allí colocadas tardan demasiado en aparecer, puede que abandone la página tras pasar algunos segundos.

Claramente esto no es bueno para el flujo de tiempo de visita de nuestra web. Debemos lograr una excelente optimización de cada imagen para retener la atención de todo el que visite el sitio. Por ese motivo, hemos traído para ti este artículo que de seguro ayudará a cualquiera con la optimización de sus imágenes.

Optimizar el tamaño de las imágenes

Podemos optimizar las imágenes de dos formas distintas: por su tamaño y su calidad. Hablaremos primero de la optimización de tamaño.

Cuando nos referimos a optimizar el tamaño de las imágenes, queremos decir que hay que fijar nuestra atención al espacio real que cada imagen va a ocupar en nuestra página web.

Es normal toparnos con la idea de colocar en nuestro portal la imagen de mejor calidad que encontremos, la cual pesa una buena cantidad de Mega bites. Esto no hará otra cosa que bajar el rendimiento de la web.

Un ejemplo claro, podría ser el de utilizar una imagen de 6016 píxeles de ancho, cuando el contenedor de la web solo ocupa 848 píxeles. Aquí estamos incurriendo en un gran error, ya que usamos una imagen que supera con creces el límite de la página.

La solución a esto es más fácil de lo que podríamos imaginar. Antes de subirla, tendremos que llevarla a un editor de imágenes. Una vez allí, reduciremos las dimensiones del material.

Podremos conseguir que una imagen de 6016×3384 píxeles, con un tamaño de 25,3MB, se reduzca fácilmente a 848×477 píxeles, con un tamaño de 432KB. Sin duda alguna, este será un cambio importante que ayudará con la optimización del portal.

Optimizar la calidad de las imágenes

Una vez conseguido el tamaño apropiado para cada una de nuestras imágenes, podremos optimizar su calidad.

Lo ideal para gráficos pequeños e imágenes con animaciones, es usar archivos GIF. Estos serían inferiores a 10×10 píxeles o con una paleta de colores básica, que no contenga más de 3 colores.

En cuanto a las imágenes de estilo más fotográfico y profesional, lo aconsejable serían los archivos JPG.  Con herramientas como Photoshop, podemos optimizar la calidad de estas imágenes, seleccionando la opción “Guardar para web”.

Al seleccionar esta opción, se optimizará la compresión y se eliminaran los metadatos y comentarios que puedan tener las imágenes, ayudando a reducir así su peso. Haciendo esto, lograremos llevar a una imagen de 432KB a 86,4KB.

A continuación vamos a mostrar unos plugins, los cuales pueden ayudarnos con la tarea de optimización de imágenes, pero si queremos ahorrarnos la instalación de un plugin, todos los planes de alojamiento web para los clientes de webservi.es disponen de una herramienta para esta labor, con la cual conseguiremos que en un solo clic todas las imágenes de nuestro  sitio web estén optimizadas.

Si se quiere hacer uso de algún plugin que nos ayude con la compresión. Estos pueden ser: WP Smush, EWWW Image Optimizer o Imagify. Cualquiera de ellos se puede configurar para que suba de manera automática el material visual a la librería multimedia de la web.

PageSpeed Insights: la herramienta que necesitamos para optimizar

Este es un conjunto de herramientas creado por Google con el fin de optimizar el rendimiento de cualquier página web. Proporcionan datos sobre el rendimiento real de las páginas tanto en dispositivos móviles como en ordenadores, y nos dan consejos acerca de cómo obtener una mejor optimización.

Estas herramientas incluyen datos de un informe llamado “Experiencia de Usuario de Chrome (CrUX)”, el cual muestra información del rendimiento real de nuestra web. Incluso compara la media de cada una de estas métricas con todas las páginas contenidas en el informe CrUX.

Una página web con la mayor rapidez de entrada

Si llevamos a cabo todos estos pasos, en poco tiempo no tendremos por qué preocuparnos por la optimización. Cada vez que un usuario entre en el sitio, va a experimentar una rapidez bastante agradable, haciendo que este quiera quedarse y seguir navegando por todas las pestañas.

Recordad: cada imagen que deseemos colocar en la web, tendrá que pasar por este proceso. Si queremos el mejor rendimiento, necesitamos aplicar las medidas necesarias.