Formato de imágenes ideales para tu web

Todos los que hemos desarrollado un sitio web, en algún momento hemos tenido problemas con las imágenes que queremos establecer dentro de nuestro sitio web o blog. Esto no es nada nuevo ya que las imágenes son un pilar fundamental en nuestra página web, es lo que nos ayudará a captar la atención de nuestros visitantes y muchas veces es  el elemento detonador que nos llevará a tu usuario hasta la tomar la decisión de compra. si lo hacemos bien. Subir una foto de mala calidad, o tener una pésima organización de ellas, puede ocasionar el efecto contrario.

Pero… ¿Por qué es importante optimizar las imágenes?

Las razones son muchas pero nos quedamos con las tres más importantes:

• SEO:  Uno de los factores que contribuye al posicionamiento es la velocidad de la carga de la página o dicho de otra manera, una página cuya carga en el navegador sea de más de 5 segundos, tendrá menos posibilidades de posicionarse correctamente. Las imágenes pesadas (muchos KB o MB) hacen que la velocidad de carga de una página se vea ralentizada.
• Conversión: Al crear una tienda online “eCommerce” cuya estructura es la combinación de imágenes y textos sea organizada, tendrá más posibilidades de atraer, retener y “convertir” en clientes potenciales a las .
• Estética: Las imágenes de pésima calidad hacen de todo menos transferir una imagen seria y profesional de nuestro negocio. Si, por ejemplo, tienes una página web de fotografía o una web para tu proyecto musical, tus imágenes deben ser de gran calidad.

Vamos a explicar por qué una está optimizada y la otra no:

• PÍXELES: El tamaño en píxeles de la imagen original es el tamaño de largo y ancho. Piensa que 32 píxeles son 1 centímetro: por lo que la imagen original de la derecha (no optimizada) sería de 187,5 cm (que es la altura de un hombre adulto). Este es un tamaño innecesario para una imagen dentro de una columna. Podemos tener imágenes de 1000 o 2000 píxeles por ejemplo en el área superior de algunas plantillas (que está destinada para tener una imagen).
• RESOLUCIÓN: ppp significa píxeles por pulgadas (también puedes verlo en inglés como dpi -dot per inch- o ppi -pixels per inch). Cuanto mayor sea el número de pp “Pixeles”, mayor será la calidad, pero eso servirá para la impresión de una imagen. Por ejemplo, para una página web, 72 pp será suficiente; mientras que para un imagen de un periódico se necesita al menos 300 pp.
• TAMAÑO: Efectivamente, la imagen optimizada será menos pesada (33KB) que la imagen no optimizada para web (10, 3 MB) y eso influye en la velocidad de carga de la página. Existen diferentes formas para guardar imágenes para web o incluso plataformas online como pixlr donde puedes optimizarlas. Como decíamos, lo importante es la forma de guardar el archivo para web: podemos incluso lograr que una imagen de 2000px, optimizada para web y que no sea demasiado pesada.

¿Y ahora? que formato elijo? 

• PNG: Se utiliza sobretodo para las imágenes que están hechas con formas geométricas y tienen colores planos. La gran ventaja de este formato es que conserva las transparencias y que no pierde mucha calidad en la compresión de la imagen, por eso se utiliza para logotipos.
• .JPG: Es el formato universal que se utiliza sobre todo para las imágenes, pues aunque se pierde un poco de calidad al comprimir las imágenes, no se pierden colores o tonalidades.
• .GIF: Este formato se utiliza para animaciones sobretodo. Dado que se utilizan varias imágenes o un vídeo para hacer el gif, el tamaño en kb puede ser muy grande; por eso, en ocasiones se comprime la imagen y pierde calidad.

De nada servirá tener imágenes optimizadas y combinarlas con texto si no van a llevar un orden dentro del sitio, lo que te recomendamos es que, para que un diseño sea efectivo y que las imágenes capten la atención de las visitas, es fundamental que estén bien combinadas. 

Conclusión:

Una vez teniendo nuestras imágenes optimizadas las podremos subir a nuestro sitio sin temer a que la velocidad de carga se vea afectada por dichos elementos.

En resumen: 

Utiliza imágenes con un tamaño en píxeles adecuado en función lo que necesites,

optimiza la imagen para web para que no sea muy pesada en terminos de (KB) pues eso ayudará a la velocidad de carga de tu página y por ultimo, Guarda tus imágenes según el formato que más convenga.