Optimización de imágenes web

Imágenes optimizadas para web

Un buen diseño de página web siempre puede ir acompañado de imágenes creativas y atractivas, pero antes de subirlas a tu sitio web tienes que optimizarlas para que ocupen poco espacio y pierdan la menos calidad posible.

Antes de subir una imagen a tu web

Optimiza todas las imágenes que quieras utilizar antes de subirlas a tu página web. La mejor forma de hacerlo es con un editor de imágenes. Yo personalmente utilizo Photoshop para tratarlas antes de subirlas al servidor. Más abajo te explico cómo hacerlo de forma correcta, sin perder calidad y reduciendo su tamaño al máximo posible. Hay páginas web que ofrecen reducción de imágenes dónde puedes subirlas de forma masiva y luego descargarlas. Pero siempre hay un precio y no es nada interesante. Es mucho mejor que lo hagas tu ya que no requiere de mucho tiempo y tendrás el control total, tanto de tamaño de imagen como reducción de peso.

Cómo optimizar una imagen para la web con Photoshop

Abre el archivo que quieras optimizar con la aplicación Photoshop. Si tienes que reducir muchas imágenes de golpe puedes ponerlas todas en una carpeta y grabar una acción. Las acciones con Photoshop funcionan de la siguiente manera:

  • Abre todas las imágenes que quieras optimizar con Photoshop.
  • Ve a ventana/acciones y dale al icono de grabar.
  • Haz la siguiente combinación de teclas para guardar la imagen para web y dispositivos: Ctrl + Alt + Shift + G.
  • Ahora verás una ventana emergente con las opciones de guardado.
  • En ajuste preestablecido selecciona la opción JPG alta.
  • Al instante verás en la parte inferior de la ventana de guardado el peso que tendrá la imagen una vez la guardes en este formato.
  • Como podrás comprobar el peso ha bajado de forma drástica y la calidad a penas se pierde.
  • Guarda tu imagen y súbela a tu web.

Los formatos de imagen más utilizados en las páginas web JPG, PNG y GIF

Formato de imagen JPG

Es el formato estándar de la mayoría de las imágenes que componen un sitio web. JPG permite reducir mucho el peso de la imagen manteniendo sus proporciones y calidad. Por ejemplo, las imágenes que forman parte de un carrusel deslizante en una web son de un tamaño considerable, por lo general son las más grandes que carga el sitio y las más pesadas. Gracias al formato JPG estas imágenes de tanto tamaño pueden ser reducidas en peso y como ya he mencionado prácticamente no pierden calidad.

Formato de imagen PNG

También se ven muchas imágenes con el formato .png en los sitios web. Son mucho más pesadas que el famoso JPG pero lo interesante del formato .png es que las imágenes cuando las editamos pueden ser guardadas con fondo transparente. Se suelen utilizar para conseguir efectos creativos de movimiento en cualquier lugar de la web.

Formato de imagen GIF

Este formato se utiliza para mostrar breves fotogramas en movimiento u otro tipo de elementos en movimiento como pueden ser los iconos. Los puedes extraer de animaciones o vídeos creados previamente con Photoshop. Son bastante pesados, depende de la duración del archivo.

¿Qué pasa si subo las imágenes a mi web sin optimizarlas?

El principal problema que tendrá tu página web es que va a cargar de forma muy lenta y esto va a afectar de forma muy negativa a tu sitio. Los usuarios no quieren esperar cuando buscan algo a través de internet. Si no les muestras lo que quieren ver de forma rápida se irán probablemente a la página web de tu competencia.

Contacto

Inicia tu proyecto conmigo

Resolveré todas tus dudas y te ayudaré con la contratación del alojamiento web y el registro de tu dominio.