Optimización de imágenes

Estás aquí:
< Todos los temas

La optimización de imágenes suele producirse a través del uso adecuado del formato y tamaño recomendado. Veamos ambas opciones.

Formatos

Las imágenes grandes ralentizan sus páginas web, lo que crea una experiencia de usuario poco óptima. Optimizar imágenes es el proceso de disminuir el tamaño de sus archivos,  que a su vez acelera el tiempo de carga de la página.

Lo primero que debemos saber es que el sistema soporta tres formatos de imágenes: JPG, PNG y GIF.

 Veamos las características de estos tres formatos:

Formato JPG

JPG fue un tipo de archivo desarrollado por el Grupo Conjunto de Expertos Fotográficos (JPEG) para ser un estándar para los fotógrafos profesionales. Al igual que el método que los archivos ZIP utilizan para encontrar redundancias en los archivos para comprimir los datos, los JPG comprimen los datos de las imágenes reduciendo las secciones de las imágenes a bloques de píxeles o «tiles».  Al ser un formato para fotografías, no contienen información sobre canales Alpha, que permiten la transparencia de partes de una imagen sobre su fondo. Esto quiere decir  que si disponemos de una fotografía de un producto con color negro de fondo, en la página del producto, la fotografía conservará el color de fondo.

 Los JPGs se han convertido en la imagen estándar de Internet porque pueden ser comprimidos. Un JPG típico puede comprimirse en una proporción de 2:1 hasta 100:1, dependiendo de su configuración.

Como norma, una compresión del 60% suele mantener una buena relación compresión/calidad de imagen.

Formato GIF

GIF es por naturaleza un archivo de color de 8 bits, lo que significa que se limitan a una paleta de 256 colores, que pueden ser elegidos del modelo de color RGB y guardados en una tabla de búsqueda de color (CLUT), o simplemente «Tabla de colores». Sin embargo, hay paletas de colores estándar, como la paleta «Web Safe». Una nota importante es que las imágenes en escala de grises son por naturaleza una paleta de 8 bits, por lo que guardarlas como GIF es bastante ideal.

Además de soportar la transparencia, el GIF también soporta animaciones, limitando cada cuadro a 256 colores preseleccionados.

Aunque el GIF no tiene pérdidas como el JPG, la conversión a color de 8 bits distorsiona muchas imágenes, usando filtros para mezclar ópticamente, o «difuminar» los colores, de manera similar a los puntos de medios. Esto puede alterar radicalmente una imagen ofreciendo un aspecto punteado.

El GIF no es ideal para la fotografía moderna, ni para el almacenamiento de imágenes. En tamaños pequeños con tablas de color muy limitadas, las imágenes GIF pueden ser más pequeñas que los archivos JPG. Pero en la mayoría de los tamaños ordinarios, la compresión JPG creará una imagen más pequeña. Son muy anticuados, útiles sólo para crear pequeñas animaciones o para crear a veces transparencias toscas.

Formato PNG

PNG fue desarrollado como una alternativa al GIF. PNG es un excelente tipo de archivo para gráficos de Internet, ya que soporta la transparencia en los navegadores con una elegancia que el GIF no posee.

PNG admite color de 8 bits como GIF, pero también admite color de 24 bits RGB, como JPG. También son archivos sin pérdidas, comprimiendo las imágenes fotográficas sin degradar la calidad de la imagen. PNG tiende a ser el más grande de los tres tipos de archivos y no es compatible con algunos navegadores (generalmente más antiguos).

PNG soporta transparencia. Muchos usuarios confunden soportar transparencia con incluirla automáticamente. Un archivo PNG debe ser retocado con anterioridad para incluir transparencia. Dicho de otro modo, si tiene una imagen con fondo y la transforma directamente a PNG, la imagen no será transparente.

Qué formato utilizar

  • GIF: Cuando en una imagen utilizamos pocos colores, como en un logo
  • JPG: Cuando es una fotografía sin transparencias
  • PNG: Cuando la fotografía está tratada para admitir transparencias

Si desea editar fotografías de manera gratuita, dispone de herramientas online como pixlr.com

Tamaño

Una pantalla es un formato digital que solo acepta una unidad de medida: el pixel. Éste equivale a un punto de la resolución de su pantalla. Conceptos como los puntos por pulgadas no son aplicables a una pantalla por lo que únicamente debemos centrarnos en modificar la cantidad de pixeles que debe tener nuestra imagen.

El sistema recomienda una anchura máxima de 1000 píxeles de ancho por 794 píxeles de alto para las imágenes de producto. Para los logotipos de las empresas se recomiendan 275 píxeles de ancho por 100 de alto.

Para recortar una imagen de manera gratuita, existen muchas utilidades online. Para facilitar la tarea hemos realizado un pequeño tutorial con la herramienta gratuita online https://www.img2go.com/es/cambiar-tamano-de-imagen

Primero seleccionaremos un archivo desde nuestra ordenador, una dirección de Internet o algún sistema alternativo de los propuestos.

Ajustaremos el formato siguiendo las instrucciones del apartado Formatos

Elegiremos 1000 píxeles de anchura y dejaremos sin rellenar el apartado altura para no deformar la imagen.

Dejamos sin rellenar el apartado DPI (puntos por pulgada)

Pulsamos el botón empezar. En la actualidad, la descarga se produce de forma automática. Si ésta no llegase a producirse, puede pulsar el botón Descarga.

Tabla de contenidos
  • Registro
¿Perdiste tu contraseña? Por favor introduce tu usuario o dirección email. Recibirás un enlace para crear una contraseña nueva via email