WebP, AVIF, JPG ou PNG: cal escoller
- WebP: a opción segura. Pesa entre un 25 % e un 35 % menos ca un JPG de calidade parecida, admite transparencia e ábreno todos os navegadores actuais.
- AVIF: comprime aínda máis, sobre todo en fotos, a costa de tardar máis en codificarse. Todos os navegadores modernos o mostran, pero non todos saben crealo: se o teu non pode, a opción aparece desactivada.
- JPG: para cando necesitas máxima compatibilidade, como no correo ou en programas antigos. Non ten transparencia: as zonas transparentes saen en branco.
- PNG: sen perda. Úsao para capturas de pantalla, logotipos ou imaxes con texto; para fotos pesa demasiado.
Que calidade poñer
Entre 75 e 85 é o punto doce para fotos na web: por riba, o ficheiro crece moito e a diferenza apenas se nota. En AVIF pódese baixar máis, ata 60 ou 65, cun resultado parecido. Fíxate na porcentaxe de aforro e compara as miniaturas: se unha imaxe sae máis grande ca o orixinal, é que xa estaba ben comprimida.
Reducir o tamaño aforra aínda máis ca a calidade. Unha foto de móbil ten 4000 píxeles de ancho; para unha web, 1600 ou 2000 adoitan sobrar. Escribe o ancho en «Ancho máximo» e as que sexan máis grandes redúcense mantendo a proporción.
Sen subir nada
A maioría dos conversores en liña soben as túas imaxes ao seu servidor. Este non: a conversión faina o teu navegador
coa API canvas, e os ficheiros non saen do teu equipo. Funciona igual sen conexión unha vez cargada a
páxina. A contrapartida é que o resultado depende do codificador do teu navegador, e que se perden os metadatos
EXIF (data, cámara, localización), cousa que nunha web adoita ser unha vantaxe.
Servir varios formatos
Para darlle AVIF a quen o admita e un JPG aos demais, usa <picture>. As imaxes do
xerador de ximg.es pódense pedir en calquera deses formatos cambiando a extensión, útil
para probar o marcado antes de ter as imaxes reais:
<picture>
<source srcset="https://ximg.es/1200x800.avif" type="image/avif">
<source srcset="https://ximg.es/1200x800.webp" type="image/webp">
<img src="https://ximg.es/1200x800.jpg" width="1200" height="800" alt="">
</picture>