Elegir el formato de imagen correcto puede reducir el tamaño de la página entre un 40% y un 60% sin perder calidad. Analicemos cada formato y cuándo usarlo.
Comparación de formatos
| Formato | compresión | Transparencia | Animación | Apoyo |
|---|---|---|---|---|
| JPEG | con pérdida | No | No | 100% |
| PNG | Sin pérdidas | Sí | APNG | 100% |
| WebP | Ambos | Sí | Sí | 97%+ |
| AVIF | Ambos | Sí | Sí | 92%+ |
| SVG | Vector | Sí | Sí | 100% |
cuando que formato
JPEG: fotografías e imágenes complejas
Perfecto para fotografías con millones de colores. Una calidad del 80-85% proporciona la relación calidad/tamaño óptima.
PNG es un gráfico con transparencia.
Logotipos, íconos, capturas de pantalla: todo lo que requiera transparencia o bordes de texto claros.
WebP es un formato moderno universal
Entre un 25 y un 35 % más pequeño que JPEG con la misma calidad. Recomendado para la mayoría de los casos.
SVG es un gráfico vectorial
Escala sin perder calidad. Ideal para iconos, logotipos e ilustraciones.
Conversión de imágenes
Utilice las herramientas de Xuvero:
- Convertidor de imágenes— convertir entre PNG, JPG, WebP
- Compresor de imagen— comprimir imágenes sin pérdida visible de calidad
- Cambiar tamaño de imagen— cambiar el tamaño de la imagen
Optimización para SEO
- Carga diferida—
loading="lazy"para imágenes debajo de la primera pantalla - Texto alternativo— describe lo que se muestra en Google Imágenes
- Dimensiones— siempre especifique el ancho y el alto para evitar CLS
- Conjunto de caracteres— proporcionar diferentes tamaños para diferentes pantallas
