in

Cómo optimizar imágenes para tu tienda Shopify

Aprende a comprimir tus imágenes y reducir su peso sin perder calidad de una forma sencilla

Las imágenes son una parte vital de tu página web para atraer la atención de tus visitas, rompen largos párrafos de texto, hacen tu contenido más atractivo y lo ayudan a ser compartido a través de Internet con mayor frecuencia. Por desgracia, las imágenes también aumentan el peso de tus páginas.

Las imágenes son una parte vital de tu página web para atraer la atención de tus visitas, rompen largos párrafos de texto, hacen tu contenido más atractivo y lo ayudan a ser compartido a través de Internet con mayor frecuencia. Por desgracia, las imágenes también aumentan el peso de tus páginas.

Cada imagen que añades a una página, post o producto tiene que ser descargada por los usuarios a su ordenador, móvil o tablet. Esto aumenta el tiempo de carga, que puede frustrar a los usuarios y puede tener un efecto negativo en tu posicionamiento en buscadores.

El peso de las imágenes tiene un efecto negativo para tu posicionamiento. Clic para tuitear

Si no utilizas Shopify, tener demasiadas imágenes también aumenta significativamente la transferencia y consumen más espacio de almacenamiento en tu servidor. Esto es poco probable que ocurra si estás empezando y tienes pocas imágenes, sin embargo, con el tiempo, podría aumentar el coste de tu alojamiento, ya que el espacio no es ilimitado. Si utilizas Shopify, aunque no tienes límite en las transferencias ni en el número de archivos, tus usuarios sí notarán cuando tus imágenes tardan demasiado tiempo en visualizarse por culpa de su peso excesivo.

Utiliza este enlace para probar Shopify de forma totalmente gratuita.

Formatos de archivo

Los programas de edición de imágenes te permiten guardar tus imágenes en un gran número de formatos diferentes. Los formatos de archivo más utilizados en páginas web son JPEG y PNG.

Los archivos JPG son más adecuados para fotografías, ya que contienen muchos colores. Este formato usa compresión con el fin de reducir el tamaño del archivo. Los PNGs son mejores para imágenes con colores planos, como logotipos, ilustraciones, capturas de pantalla, e imágenes que forman parte del diseño de tu tienda, como iconos y botones (aunque cada vez más se utilizan archivos .SVG). Un PNG utiliza técnicas de compresión sin pérdida de calidad por lo que la imagen tiene más detalle, sin embargo esto también significa que el archivo será algo más pesado.

Optimizar tus imágenes reducirá el peso del archivo, pero también afectará a la calidad de la imagen, es necesario encontrar un punto medio.

Otro formato que se puede ver frecuentemente utilizado en Internet es GIF. Los archivos GIF son más adecuados para las imágenes de baja calidad con sólo unos pocos colores. Hoy en día, el formato GIF es conocido en Internet como el formato para los archivos animados.

Optimizando tus imágenes antes de subirlas a tu Shopify

La mayoría de las aplicaciones de edición de imágenes te ayudarán a disminuir la calidad de una imagen para internet.

Si no sabes utilizar programas de edición de imáganes, y lo que buscas es algo rápido, que recorte tus imágenes al tamaño correcto y las optimice todas juntas, puedes usar las siguientes aplicaciones:

  • PhotoBulk | Disponible para Mac por 9€.
  • Caesium | Disponible gratis para Windows.

Si sabes usar herramientas de edición de imágenes como por ejemplo Photoshop, no te será dificil optimizar tus imáganes. Lo más sencillo es usar la opción que se llama «Guardar para Web y dispositivos» y lo puedes encontrar en Archivo/Guardar para Web. Aunque en las versiones actuales de Photoshop (CC 2015 en adelante) esta opción ha desaparecido, se puede encontrar en Archivo/Exportar/Guardar para Web (heredado).

guardar para web en photoshop

La mayoría de las aplicaciones de edición de imágenes tienen una opción para guardar imágenes para la web.

Photoshop te permite elegir el tipo de archivo de la imagen y su calidad. En la parte inferior izquierda también detalla el tamaño de archivo que tendrá la imagen si la guardas con los valores que has elegido.

panel opciones guardar para web photoshop

Photoshop te permite elegir el nivel exacto de optimización aunque existen otras muchas que también disponen de herramientas similares, como GIMP.

Otras alternativas más económicas a Photoshop, son:

  • Pixlr Editor | Disponible como aplicación web gratis.
  • GIMP | Disponible gratis para Windows, Mac y Linux.
  • Affinity Photo | Disponible para Mac por 49.99€, prueba gratuita disponible.
  • Pixelmator 3.5 Canyon | Disponible para Mac por 29.99€, prueba gratuita disponible.
  • Acorn 5 | Disponible para Mac por 29.99€, prueba gratuita disponible.

Tanto si tu editor de imágenes tiene una opción para optimizar imágenes como si no, te recomiendo que una vez tengas tus imágenes guardadas al tamaño que necesites, utilices los siguientes programas:

  • ImageOptim | Disponible gratis para Mac.
  • FileOptimizer | Disponible gratis para Windows.
  • Riot | Disponible gratis para Windows.
  • Mozjpeg | Disponible como aplicación web.

Todas las aplicaciones anteriores son de descarga gratuita. Hay muchas otras aplicaciones premium disponibles online, aunque no tienen ningún beneficio importante sobre estas alternativas y son gratis. Estas aplicaciones se encargarán de reducir un poco más esos archivos, eliminando datos innecesarios que contienen los archivos Jpg, Png o Gif, como los metadatos EXIF (fecha, hora, modelo de la cámara, etc…).

Si usas Mac ImageOptim es la mejor opción, lo único que tendrás que hacer es arrastrar las imágenes a optimizar sobre el icono de la aplicación y ella se encargará de reducir considerablemente su tamaño con la mínima pérdida de calidad. El resto de programas tanto para Windows como para Linux funcionan de una forma similar.

ImageOptim reducción peso imágenes

Optimizar imágenes ya subidas a tu tienda Shopify

En la Shopify app store hay muchas apps disponibles que pueden optimizar tus imágenes después de que las hayas subido a tu tienda online. En mi opinión, es mejor optimizar las imágenes antes de subirlas a tu Shopify, sin embargo entiendo por qué mucha gente optimiza las imágenes tras subirlas, ya que les puede ahorrar algo de tiempo.

Uno de los plugins de optimización más conocidos para Shopify es Crush Pics esta app te permite comprimir, optimizar y automatizar el proceso.

Si nunca has optimizado tus imágenes, esta app es una forma rápida y eficaz de reducir el peso de todas las imágenes subidas a tu tienda Shopify.

Conclusión final

No debes subestimar la importancia que tiene la optimización de tus imágenes. La optimización reducirá el tiempo de carga de tu tienda y mejorará la experiencia de usuario. Tu posición en los resultados de búsqueda también mejorará debido a que las páginas cargarán más rápido.

Recuerda que, si bien la compresión de una imagen reducirá el peso del archivo, la calidad también se puede ver perjudicada si comprimes la imagen demasiado. Por lo tanto, es importante conseguir un equilibrio entre calidad de imagen y el peso del archivo.

Como siempre, si necesitas ayuda optimizando tus imágenes, siempre puedes ponerte en contacto con nosotros.

Si aún no has probado Shopify, utiliza este enlace y podrás probarlo de forma totalmente gratuita.

2 Comentarios

Escribe un comentario

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *