Cómo optimizar imágenes para la web: formatos, tamaño y peso

Una foto sacada con el celular puede pesar varios megas. Subirla tal cual a tu web es una de las causas más frecuentes de lentitud. Optimizar imágenes es rápido y se nota enseguida.

Elige el formato correcto

• JPG: fotografías con muchos colores, con buena compresión.
• PNG: gráficos con transparencia o texto nítido, pero pesa más.
• WebP: formato moderno que ofrece buena calidad con menos peso; hoy lo soportan todos los navegadores.
• SVG: logos e íconos vectoriales, que se ven nítidos a cualquier tamaño y pesan muy poco.

Ajusta las dimensiones

No tiene sentido subir una imagen de 4000 píxeles de ancho si en la web se muestra a 800. Redimensiónala al tamaño máximo en que se va a ver, considerando pantallas de alta densidad.

Comprime

Herramientas gratuitas como Squoosh permiten reducir el peso con una pérdida de calidad imperceptible. Una calidad de compresión moderada suele bastar para la mayoría de las fotos.

Detalles que suman

• Usa carga diferida (lazy loading) para imágenes que están más abajo.
• Define ancho y alto para evitar saltos de diseño.
• Escribe un texto alternativo descriptivo para accesibilidad y SEO.
• Nombra los archivos con palabras claras, no con IMG_2034.

Un flujo de trabajo para cada imagen nueva

Optimizar no tiene que ser un trabajo extra enorme si lo conviertes en un hábito. Antes de subir cualquier imagen, sigue siempre los mismos pasos.

• Recorta y redimensiona al tamaño máximo en que se va a mostrar.
• Elige el formato: WebP o JPG para fotos, PNG o SVG para gráficos.
• Comprime con una herramienta de calidad moderada y compara el antes y el después.
• Nombra el archivo con palabras claras separadas por guiones.
• Escribe el texto alternativo al insertarla en la página.

Imágenes adaptables

En la web moderna se pueden ofrecer varios tamaños de una misma imagen para que el navegador cargue el más adecuado según el ancho de la pantalla. Así, un celular no descarga la versión grande pensada para una computadora. Muchas plataformas lo hacen automáticamente; en webs a medida se configura con atributos de imagen adaptable.

Preguntas frecuentes

¿Qué peso máximo debería tener una imagen?

No hay un número fijo, pero como referencia, busca que la mayoría de las imágenes de contenido pesen bastante menos de 200 kilobytes, y que las principales no pasen de unos 300 a 400. Lo importante es el equilibrio entre calidad y velocidad.

¿Conviene usar WebP en todos lados?

Sí en la mayoría de los casos, porque ofrece buena calidad con menos peso y es compatible con los navegadores actuales. Para correos y algunos documentos, JPG y PNG siguen siendo más seguros.

¿Pierden calidad las imágenes al comprimirlas?

Con compresión moderada la pérdida es imperceptible a simple vista. Si la fuerzas demasiado, aparecen bordes borrosos y colores bandeados. Compara siempre antes de guardar.

Herramientas gratuitas que puedes usar

Existen aplicaciones en línea que comprimen y convierten imágenes sin instalar nada, y programas gratuitos para procesar muchas a la vez. Para empezar, prueba con una herramienta que te deje comparar la imagen original y la comprimida lado a lado.

Si tu web usa un CMS, hay complementos que optimizan automáticamente las imágenes al subirlas. Revisa su configuración: algunos comprimen demasiado y otros muy poco. Un ajuste inicial bien probado ahorra mucho trabajo manual.

Con estos pasos puedes bajar el peso total de una página de forma notable sin que nadie note la diferencia visual.