Hay muchos Formatos de Imagen , para conocer mas sobre los formatos de imágenes te recomendamos visitar nuestro post sobre Formatos de Imagen
Mantener un sitio web optimizado y atractivo al mismo tiempo es una tarea difícil.
La principal idea es mantener un balance entre el menor peso y la mejor calidad posible.
Primero hay que pensar, para qué se va a utilizar esa imagen:
- Es para fondo grande que ocupe toda la pantalla?
- Es para una foto producto?
- Tiene que tener transparencia?
Respondiendo las preguntas anteriores vamos a poder tomar decisiones de que formato elegir y que tamaño debe de tener.
Si la foto va a ocupar toda la pantalla es recomendable que no tenga transparencia, ya que las mismas agregan mucho peso, que se puede solucionar aplicando el color de fondo deseado o utilizar una fotografía. En este caso utilizaremos el formato .JPG o .JPEG . Y el tamaño deberá ser como máximo 1920×1080. ¿Por que este tamaño? Muy simple, es el tamaño estandarizado de las pantallas Full HD, si bien hay mejores pantallas, como las 4K , retina, etc tenemos que tener en cuenta que es una pagina web, la cual se diseña para muchas personas por lo que tomamos la media de pantallas como referencia. No nos interesa que las pocas personas que tienen pantallas 4K en sus computadoras la vean en esa calidad, nos interesa que todas los usuarios carguen el sitio de la forma mas rápida posible.
Si la foto es para un producto, nos fijaremos que relación de aspecto tiene las fotos de nuestro producto y tomaremos como dimensión el tamaño mas grande donde se muestre, no cargaremos ningún producto con una imagen mas grande de lo que se va a mostrar; se puede, pero el buscador va a redimensionar la imagen al tamaño requerido por el producto, por lo que estaremos desperdiciando peso de disco en servidor y haciendo que la pagina tarde mas en cargar sin ningún resultado.
Tip para optimizar las imágenes de forma rápida y sencilla:
Antes de cargar las imágenes se pueden pasar por un programa de optimización de imágenes, como photoshop. En caso de no tener Photoshop recomendamos utilizar este compresor online: