Imagens costumam ser os arquivos mais pesados de uma página. Converter o formato pode reduzir transferência, mas a decisão deve considerar o tipo de imagem e os navegadores atendidos.
JPEG continua útil
É amplamente compatível e funciona bem para fotografias, mas geralmente precisa de mais bytes do que formatos modernos para qualidade semelhante. Continua sendo um fallback seguro.
WebP equilibra compressão e suporte
WebP aceita compressão com ou sem perda, transparência e animação. Seu suporte em navegadores modernos é amplo, o que o torna uma escolha prática para grande parte dos sites.
AVIF pode reduzir ainda mais
AVIF oferece compressão eficiente, transparência e maior profundidade de cor. A codificação pode ser mais lenta e arquivos grandes não carregam de forma progressiva. Teste imagens reais, pois o melhor resultado varia com o conteúdo.
Use o elemento picture quando necessário
O navegador pode escolher o primeiro formato compatível e recorrer a WebP ou JPEG como alternativa. Isso permite adotar AVIF sem abandonar usuários de ambientes antigos.
Formato não resolve tudo
- redimensione a imagem para o espaço em que será exibida;
- informe largura e altura para evitar mudança de layout;
- carregue abaixo da dobra de forma preguiçosa;
- não aplique lazy loading à imagem principal que define o LCP;
- use qualidade visual suficiente, não máxima por padrão.
Compare tamanho e aparência lado a lado. Uma capa de notícia pode aceitar compressão diferente de uma imagem de produto. A meta é entregar a menor imagem que preserve a informação necessária.
Fonte: MDN Web Docs
0 comentários
Participe da conversa. Todos os comentários passam por moderação.