Cómo redimensionar imágenes sin perder calidad
Image Tools/Optimization

Cómo redimensionar imágenes sin perder calidad

"Redimensionar sin perder calidad" es una de las búsquedas más frecuentes sobre imágenes en la web, y encierra una pequeña contradicción. Reducir una imagen siempre descarta píxeles: eso es exactamente lo que significa reducir. Lo que la gente pregunta en realidad es cómo acabar con una imagen más pequeña que siga viéndose bien, y esa sí es una pregunta con respuestas claras.

El daño visible que se suele llamar "pérdida de calidad" casi nunca viene del redimensionado en sí. Viene de cuatro errores concretos: deformar, ampliar, elegir mal el formato y recomprimir un archivo con pérdida. Si los evitas, una imagen reducida es prácticamente indistinguible del original a su nuevo tamaño.

Qué ocurre al redimensionar

Una imagen de mapa de bits es una rejilla de píxeles. Reducir una foto de 4000 píxeles de ancho a 1000 significa que cada cuatro píxeles de origen a lo ancho deben convertirse en uno de salida. Algo tiene que decidir de qué color será ese píxel de salida, y ese algo es el algoritmo de remuestreo.

El vecino más cercano elige uno de los cuatro píxeles candidatos y descarta el resto. Es instantáneo y conserva los bordes duros a la perfección, lo que lo convierte en la opción correcta para pixel art y para escalar por factores enteros exactos. En una fotografía produce bordes dentados y moteado visible en el detalle fino.

La interpolación bilineal promedia los cuatro píxeles más cercanos, ponderados por distancia. Mucho más suave, ligeramente blanda.

La interpolación bicúbica considera un vecindario de 4 × 4 y ajusta una curva suave a través de él. Es el estándar para el redimensionado fotográfico y lo que usan por defecto los editores de escritorio. Conserva degradados y bordes mejor que la bilineal a un coste de cálculo moderado.

Los navegadores exponen esto mediante el ajuste imageSmoothingQuality del canvas. Cuando está en "high", un redimensionado en navegador hace esencialmente el mismo trabajo que un editor de escritorio. Esto importa porque significa que un redimensionado totalmente local y respetuoso con la privacidad no es un compromiso de calidad: el algoritmo es el mismo.

Error uno: deformar

Lo más dañino que puedes hacerle a una imagen es cambiar su relación de aspecto. Una foto de 4000 × 3000 es 4:3. Redimensiónala a 1000 × 750 y sigue siendo 4:3, solo que más pequeña. Redimensiónala a 1000 × 1000 y cada círculo se convierte en una elipse, cada cara se aplasta, y ningún grado de enfoque lo arreglará.

Por eso el bloqueo de proporción es el control más importante de cualquier redimensionador. Con él activo, escribes una dimensión y la otra se calcula a partir de las proporciones de origen. Desactívalo solo cuando quieras deformación de verdad, que es casi nunca.

Fíjate en que "que quepa en 1000 × 1000" y "que mida exactamente 1000 × 1000" son operaciones distintas. Ajustar escala la imagen hasta que cabe entera en la caja, así que una foto 4:3 ajustada a una caja de 1000 × 1000 queda en 1000 × 750: el alto sale por debajo del límite. Forzar dimensiones exactas o deforma la imagen o exige recortarla. Si una plataforma pide un cuadrado exacto, recorta primero y redimensiona después; no estires.

Error dos: ampliar esperando detalle

Ampliar ejecuta la interpolación al revés: un píxel de origen rellena cuatro de salida, y los valores intermedios se inventan promediando vecinos. No se añade detalle, porque no existe en el archivo. Una foto de 400 × 300 ampliada a 1600 × 1200 tiene dieciséis veces más píxeles y exactamente la misma información, repartida de forma más fina. El ojo lo interpreta como falta de nitidez.

No puedes recuperar lo que nunca se capturó. Por eso los buenos redimensionadores se niegan a ampliar salvo que lo pidas explícitamente. Existen motivos legítimos para pedirlo —cumplir un requisito de lienzo fijo, imprimir a un tamaño físico determinado, satisfacer un sistema que rechaza archivos pequeños—, pero ninguno hace la imagen más nítida.

Los ampliadores por IA son una técnica genuinamente distinta. En lugar de interpolar, generan detalle plausible a partir de un modelo entrenado con millones de imágenes. Los resultados pueden ser llamativos, pero el detalle añadido está inventado, no recuperado. Para una foto de vacaciones eso da igual. Para cualquier cosa con valor probatorio —un documento, una foto de producto, una imagen médica o forense— el detalle inventado es un problema serio, porque la salida afirma cosas que el original nunca registró.

Error tres: el formato equivocado

La elección de formato afecta a la calidad percibida más que la mayoría de los ajustes de redimensionado.

  • JPEG — con pérdida, sin transparencia. Correcto para fotografías. Su compresión aprovecha que la visión humana detecta mal los pequeños cambios de color en degradados suaves, que es justo de lo que está hecha una fotografía. En color plano y texto nítido produce artefactos de anillo visibles.
  • PNG — sin pérdida, admite transparencia. Correcto para capturas, logotipos, ilustración lineal y cualquier cosa con grandes zonas planas o bordes limpios. En una fotografía suele producir un archivo de tres a cinco veces mayor que JPEG sin ganancia visible.
  • WebP — con o sin pérdida, admite transparencia, y suele ser entre un 25% y un 35% más pequeño que JPEG a calidad visual equivalente. Lo admiten todos los navegadores actuales, incluido Safari 14 en adelante, lo que lo convierte hoy en la opción sensata por defecto para imágenes web.

La queja clásica de calidad —"mi logotipo se ve borroso tras redimensionarlo"— casi siempre es un problema de "debería haber sido PNG" y no un problema de redimensionado. Los artefactos de JPEG se concentran exactamente en los bordes nítidos y de alto contraste de los que están hechos los logotipos y el texto.

Una trampa de conversión: JPEG no tiene canal alfa. Convertir un PNG transparente a JPEG obliga a rellenar las zonas transparentes con un color sólido, normalmente blanco y a veces negro según la herramienta. Si tu imagen depende de la transparencia, convierte a WebP o quédate en PNG.

Cómo redimensionar imágenes sin perder calidad

Error cuatro: recomprimir un archivo con pérdida

JPEG y WebP con pérdida descartan información cada vez que codifican. Si abres un JPEG, lo redimensionas y lo guardas como JPEG, estás comprimiendo datos ya comprimidos: los artefactos de la primera pasada pasan a formar parte de la imagen que la segunda intenta conservar. Repítelo y la degradación se acumula de forma visible, un fenómeno conocido como pérdida generacional.

Consecuencias prácticas:

  • Redimensiona siempre desde el original de mayor calidad que tengas, no desde una copia que ya ha pasado por una app de mensajería o una red social.
  • Haz todas tus ediciones y exporta una sola vez. No guardes JPEG intermedios.
  • Si tienes que iterar, conserva un PNG o el original de cámara como copia maestra de trabajo y exporta a JPEG o WebP solo al final.

Ajustes de calidad: dónde se dobla la curva

El control de calidad de JPEG y WebP no se comporta de forma lineal. El tamaño del archivo cae en picado en la parte alta del rango mientras la diferencia visible sigue siendo insignificante:

  • 100 → 90: a menudo elimina más de la mitad del tamaño, sin diferencia visible apreciable.
  • 90 → 80: otra reducción significativa, con un ablandamiento muy leve en la textura fina.
  • 80 → 70: ganancias menores; empiezan a aparecer artefactos en degradados suaves como los cielos.
  • Por debajo de 70: bloques visibles alrededor de los bordes nítidos; por debajo de 50 la mayoría de imágenes se ven claramente degradadas.

Para entrega web, el punto óptimo práctico está entre 80 y 85 en la mayoría de fotografías. Las imágenes con grandes degradados suaves (atardeceres, fondos de estudio) necesitan algunos puntos más; las imágenes muy texturizadas toleran algunos puntos menos. Los ajustes de calidad no hacen absolutamente nada en PNG, que por definición no tiene pérdida.

Elegir las dimensiones de destino

El tamaño correcto es el tamaño al que la imagen se va a mostrar realmente, multiplicado por la densidad de píxeles que quieras admitir. En la web:

  • Cabecera a todo el ancho: entre 1600 y 2000 px de ancho cubre las pantallas de alta densidad en la mayoría de diseños.
  • Imagen dentro del artículo: entre 1000 y 1200 px suele sobrar.
  • Miniatura o avatar: entre 300 y 400 px.

Servir una fotografía de 4000 píxeles en un hueco de 600 obliga a cada visitante a descargar varias veces más datos de los que necesita, y es una de las causas más habituales de malas puntuaciones en Core Web Vitals. El navegador la escalará para mostrarla, así que el visitante no obtiene ningún beneficio de esos píxeles de más.

Para imprenta, trabaja hacia atrás desde el tamaño físico a 300 PPP: una copia de 15 × 10 cm quiere unos 1800 × 1200 píxeles. Por debajo de unos 150 PPP el resultado se ve blando sobre papel. Recuerda que la cifra de PPP guardada en un archivo es solo metadato: cambiarla sin remuestrear no cambia nada de la imagen real.

Una nota de privacidad sobre los metadatos

Las fotografías de móviles y cámaras llevan metadatos EXIF: modelo de cámara, parámetros de exposición, marca de tiempo y con frecuencia coordenadas GPS. Cuando una imagen se redimensiona redibujándola sobre un canvas, la salida contiene solo píxeles y todo eso se descarta.

Para compartir, suele ser una ventaja: el lugar donde se tomó la foto no viaja con ella. Si necesitas conservar el EXIF por catalogación o por derechos de autor, necesitas una herramienta que copie explícitamente el bloque de metadatos, porque el redimensionado basado en canvas de cualquier herramienta de navegador lo descarta.

La versión corta

  • Mantén bloqueada la proporción. Recorta si necesitas otra forma; nunca estires.
  • Reduce sin miedo; amplía solo cuando tengas un requisito concreto, y cuenta con perder nitidez.
  • JPEG o WebP para fotografías, PNG para gráficos y transparencia.
  • Redimensiona desde el mejor original que tengas y exporta una sola vez.
  • Una calidad de 80-85 es el punto óptimo para la web.
  • Apunta al tamaño de visualización, no al tamaño mayor que tengas a mano.

Pruébalo

Nuestro redimensionador de imágenes aplica todo esto por defecto: la proporción viene bloqueada, la ampliación está desactivada hasta que la pidas y el suavizado del canvas está en alta calidad. Puedes redimensionar por píxeles exactos, por porcentaje o desde preajustes, convertir entre JPEG, PNG y WebP, y procesar hasta 20 imágenes a la vez con descarga en ZIP. Todo se ejecuta en tu navegador, así que tus imágenes nunca se suben.

Si tu objetivo es un archivo más ligero y no unas dimensiones menores, el compresor de imágenes es mejor punto de partida: optimiza la compresión sin tocar las dimensiones en píxeles, que a menudo es todo lo que una página lenta necesita en realidad.

← Volver al Blog