La elección del formato importa
El formato de imagen incorrecto puede hacer que tu web cargue el doble de lento o que tus imágenes pierdan calidad. Esta guía te ayuda a elegir el formato correcto para cada situación.
Resumen rápido
| Formato | Mejor para | Transparencia | Tamaño |
|---|---|---|---|
| JPG | Fotografías | No | Pequeño |
| PNG | Logos, gráficos, capturas | Sí | Mediano-grande |
| WebP | Todo en la web | Sí | Muy pequeño |
| AVIF | Todo (futuro) | Sí | Mínimo |
| SVG | Iconos, vectores | Sí | Mínimo |
Cuándo usar JPG
- Fotografías de producto, personas, paisajes.
- Imágenes donde los pequeños artefactos de compresión son invisibles.
- Compatibilidad máxima (email, impresión, apps legacy).
No uses JPG para: logos, capturas de pantalla con texto, imágenes con fondos transparentes.
Cuándo usar PNG
- Logos e iconos que necesitan transparencia.
- Capturas de pantalla con texto legible.
- Imágenes que vas a editar varias veces.
Inconveniente: PNG es significativamente más grande que JPG o WebP para fotografías.
Cuándo usar WebP
WebP es la mejor opción para la web en 2024:
- 30-35 % más pequeño que JPG a calidad equivalente.
- 26 % más pequeño que PNG en modo sin pérdida.
- Admite transparencia y animación.
- Compatible con Chrome, Firefox, Safari (≥14), Edge, Opera.
Recomendación: sirve WebP con fallback JPG usando <picture> para compatibilidad total.
Cuándo usar SVG
Para iconos, logos y gráficos puramente vectoriales, SVG es imbatible:
- Escala sin pérdida a cualquier resolución.
- Tamaño de archivo mínimo.
- Editable con CSS y JavaScript.
Recomendación final
Para la mayoría de sitios web: usa WebP con fallback JPG/PNG. Herramientas como KaijuConverter, Squoosh o ImageMagick convierten en lote. Para logos y gráficos vectoriales, SVG.
Casos de uso avanzados
Optimización web a escala: sitios e-commerce con miles de productos pueden reducir bandwidth costs 60-80% migrando de JPG a AVIF o WebP. Cloudflare Images, Imgix y Cloudinary ofrecen transformación on-the-fly basada en Accept header del cliente — sirviendo AVIF a Chrome/Edge modernos, WebP a Safari/Firefox, JPG fallback a navegadores legacy. Print-ready output: convertir RGB a CMYK con perfil ICC (US Web Coated SWOP v2 para offset comercial, FOGRA39 para europeo) garantiza que los colores impresos coincidan con preview en pantalla calibrada. PDFs/X-1a y X-4 son los formatos exigidos por imprentas profesionales. Foto profesional: workflow Adobe consiste en RAW (input cámara) → DNG (archivado) → PSD (edición no-destructiva) → TIFF (deliverable) → JPG/WebP (web/social). Cada etapa preserva diferentes capacidades. Vector graphics: SVG es preferido para logos, iconos, ilustraciones planas — escala infinitamente sin pérdida y se anima con CSS/JavaScript. Para UIs modernas, los icon fonts (Font Awesome) están siendo reemplazados por SVG sprites por mejor accesibilidad y customización.
Mejores prácticas y consejos profesionales
Selección de formato según contenido: fotografías → JPG (calidad 85-95) o WebP (calidad 80-90); gráficos con texto/líneas finas → PNG o WebP lossless; ilustraciones planas → SVG; iconos UI → SVG; screenshots → PNG; HDR → AVIF o JPEG XL. Color profile management: siempre embebe el perfil ICC en archivos profesionales (Adobe RGB para fotografía pre-impresión, sRGB para web, Display P3 para Apple ecosystem). Sin perfil embedded, los visualizadores asumen sRGB que puede causar shifts de color visibles. Resolución vs tamaño: para web display, 72 DPI es suficiente; para impresión profesional, 300 DPI mínimo. Lazy loading + responsive images: combina <img loading="lazy" srcset> con AVIF/WebP fallback chain para bandwidth saving sin sacrificar UX. Metadata privacy: archivos JPG de smartphone contienen GPS, modelo de cámara, fecha exacta — usa exiftool -all= para limpiar antes de subir a redes sociales si privacidad importa.
Compatibilidad y consideraciones técnicas
KaijuConverter soporta más de 30 formatos de imagen (JPG, PNG, WebP, AVIF, HEIC/HEIF, GIF, BMP, TIFF, SVG, ICO, PSD, RAW múltiples vendors, JPEG XL) usando ImageMagick 7.x, libvips, y format-specific libraries (libpng, libjpeg-turbo, libwebp, libavif, librsvg). Procesamos imágenes hasta 100 MB con resoluciones hasta 16384×16384 píxeles y profundidades de 8/10/12/16-bit por canal. EXIF y metadata: leemos toda la información embedded (cámara, lente, GPS, datos de captura, ICC profile) y la migramos al output cuando el formato destino lo soporta — crítico para workflows profesionales que dependen de provenance tracking. HDR: soportamos PQ y HLG transfer functions para AVIF/JPEG XL/HEIC HDR (rec.2020 color space). Performance: una conversión típica JPG→WebP de 5 MB tarda 1-3 segundos; HEIC→JPG de iPhone 12 Mpix tarda 2-5 segundos; PSD multi-layer→PNG flat puede requerir 5-15 segundos según complejidad. Privacidad: cifrado TLS 1.3, contenedores Docker aislados, eliminación automática tras 2 horas con multi-pass overwrite.
Conversiones relacionadas
Lo más habitual al trabajar con imágenes son estas direcciones de conversión: