Compresión de imágenes para sitios web: menos peso sin sacrificar la foto

Una página de recetas tarda en abrirse porque cada foto se envió directamente desde la cámara y pesa varios megabytes. El lector sólo necesita ver la comida claramente en el ancho del teléfono celular. Reducir el peso del archivo puede transformar la experiencia, siempre y cuando la compresión se realice con criterio.

Las dimensiones vienen antes que el porcentaje de calidad.

Si la imagen ocupa 800 píxeles en la página, no hay motivo para publicar siempre la versión de 6000 píxeles. Cambiar el tamaño primero a menudo reduce la calidad más que apretar agresivamente. UsarComprimir imagenpara probártelo y observar tanto la dimensión como el peso final.

JPEG y WebP funcionan bien en fotografías; PNG tiende a tener más sentido en gráficos o imágenes con transparencia. La elección depende del contenido y la compatibilidad requerida. Una imagen con números pequeños puede verse mal con niveles de compresión aceptables para paisajes.

La prueba debe realizarse donde aparece la imagen.

Compare el original y el comprimido a tamaño completo en la página, en pantallas claras y oscuras cuando sea relevante. Vea caras, bordes de productos, degradados y letras en línea. Los defectos más comunes son bloques visibles, contornos dobles y manchas en áreas uniformes.

Nombres, versiones y responsabilidad

Adopte nombres de archivo descriptivos, comopastel-rebanada-de-chocolate.webpy texto alternativo que describe el contenido para aquellos que no pueden ver la foto. Conserve la versión original en su biblioteca. Si publica muchas imágenes, estandarice los anchos y compare la carga en una conexión lenta. Comprimir bien es encontrar la versión más pequeña que resulte agradable y comprensible.

El peso de la página es la suma de las imágenes.

Una fotografía reducida de 3 MB a 280 KB supone un ahorro importante, pero una galería con veinte imágenes de este tamaño todavía requiere varios megas. Mire el conjunto: tamaño de portada, miniaturas, imágenes del artículo y versión para pantallas más grandes. Publicar la misma foto enorme en todos los espacios desperdicia datos de los visitantes. Cuando la plataforma admita imágenes responsivas, proporcione versiones proporcionales al tamaño de la pantalla.

Evite también compresiones sucesivas a lo largo de la edición. Si alguien guarda un JPEG ya reducido y el siguiente editor lo comprime nuevamente, la pérdida se acumula. Conserva una copia de calidad de la foto original, con un nombre y organización que te permita encontrarla meses después. De esta manera puedes generar nuevos tamaños a medida que cambia el diseño, sin depender de archivos que ya han perdido detalles.