Redimensionador y Recortador de Imágenes

Las imágenes digitales son rejillas de píxeles — una imagen de 1920×1080 tiene más de 2 millones de píxeles individuales. El redimensionamiento cambia el número de píxeles en esta rejilla. Reducir dimensiones requiere fusionar múltiples píxeles en menos, un proceso llamado decimación o submuestreo. Aumentar dimensiones requiere interpolar nuevos píxeles a partir de los existentes, un proceso llamado interpolación o sobremuestreo. La calidad del resultado depende en gran medida del algoritmo de remuestreo usado.

The browser's Canvas API uses the browser's built-in image resampling, which is typically bilinear or bicubic interpolation. Bilinear interpolation computes each new pixel as a weighted average of the 4 nearest original pixels. Bicubic interpolation uses a 4×4 neighborhood and produces smoother results, especially for upscaling. The canvas's imageSmoothingQuality property can be set to 'low', 'medium', or 'high' -- our tool uses 'high' for maximum quality. For photographic images, this produces results comparable to dedicated image editing software.

Al redimensionar, es importante mantener la relación de aspecto (la relación entre ancho y alto) para evitar la distorsión. Si cambias el ancho sin cambiar proporcionalmente el alto, la imagen aparecerá estirada o comprimida. Nuestra herramienta bloquea la relación de aspecto por defecto — cambiar una dimensión ajusta automáticamente la otra. Para redimensionamiento no proporcional (por ejemplo, ajustar una imagen en un contenedor de tamaño fijo), puedes desbloquear la relación de aspecto, pero el resultado se verá distorsionado.

Redimensionar, recortar y comprimir son tres operaciones distintas que a menudo se confunden. Redimensionar cambia las dimensiones de la imagen (recuento de píxeles). Recortar elimina píxeles de los bordes para centrarse en una región específica. Comprimir reduce el tamaño del archivo sin cambiar las dimensiones aplicando algoritmos de compresión con pérdida o sin pérdida. Estas operaciones sirven para diferentes propósitos: redimensionar para ajustar dimensiones, recortar para composición, comprimir para tamaño de archivo.

For web optimization, you typically need all three: crop to the desired aspect ratio, resize to the target dimensions (e.g., 1200×630 for Open Graph images), and compress to reduce file size (target < 200 KB for hero images). A common mistake is resizing without compressing -- a 4000×3000 image resized to 800×600 but saved as PNG can still be several megabytes. Always resize AND compress (using JPEG or WebP format) for web images.