Você abre o site. O texto aparece, mas uma imagem ainda demora a chegar.
Às vezes, o peso está no que os olhos não percebem.
Imagens grandes demais para o que a web foi feita.
O ShortPixel pode criar versões com fração do tamanho em WebP e AVIF e entregá-las pela sua CDN. Mas precisamos passar por dois caminhos: criar a imagem e fazê-la chegar ao navegador.
Prepare as imagens
No WordPress, com o ShortPixel Image Optimizer conectado à sua conta, entre em:
Configurações → ShortPixel → WebP/AVIF & CDN
Ative Create WebP Images e Create AVIF Images. Salve.
As imagens antigas também precisam atravessar essa mudança. Em Mídia → Bulk ShortPixel, execute a geração dos formatos que ainda faltam, observando os créditos disponíveis.
Abra o caminho da CDN
Na mesma aba, ative:
Deliver the next generation images using the ShortPixel CDN
Limpe o cache do site.
Agora, as imagens podem seguir pela CDN e chegar em um formato compatível com o navegador. Se outro plugin também controla essa entrega, escolha qual ficará responsável. Dois caminhos sobrepostos podem tornar o resultado confuso.
Desabilite a opção acima, se a sua hospedagem já tiver CDN integrada. Eu deixo do jeito abaixo com minha CDN. Leia atentamente as instruções e o mais importante é entrar em modo desenvolvedor e testar se os navegadores estão mostrando WebP ou AVIF.
Minha CDN é pelo Jetpack Boost, desativei a CDN do ShortPixel e habilitei a opção CDN da imagem no Jetpack.
Veja o que realmente chegou
O site pode parecer igual. A mudança acontece por baixo da superfície.
Abra uma página pública no Chrome:
- Pressione F12 e entre em Network / Rede.
- Selecione Img e marque Disable cache.
- Recarregue a página e role para carregar as imagens.
- Clique em uma delas e procure Headers → Response Headers → Content-Type.
A resposta será direta:
image/webp— chegou WebP.image/avif— chegou AVIF.image/jpegouimage/png— essa imagem ainda chegou no formato original.
Não se deixe levar apenas pelo nome do arquivo. Um endereço terminado em .jpg pode carregar outro formato dentro dele.
Em Request URL, o domínio spcdn.shortpixel.ai também indica o caminho padrão da CDN do Image Optimizer. Mas o mais importante é como dissemos, achar o Content-Type WebP e AVIF.
No meu aparece imagem sendo fornecida pela i0.wp.com, que seria o equivalente a spcdn.shortpixel.ai na minha hospedagem:
O CDN não é obrigatório, mas não custa nada em clicar em ativar caso apareça uma opção assim. Melhora muito o tempo de carregamento da página.
Se a mudança ainda não aparecer
A primeira visita pode encontrar a imagem antes de a CDN terminar de prepará-la. Aguarde alguns minutos e teste novamente.
Se o formato original persistir, confira a geração, a opção de entrega e os caches. Algumas imagens podem permanecer no formato original quando a conversão não oferece vantagem.
Depois, feche o painel e volte à página.
A imagem continua contando a mesma história. Talvez agora ela chegue um pouco antes.
Reforçando uma dica importante
Dependendo de quem é o seu provedor, apague todos os caches se você (logado) ou o seu cliente (deslogado) não conseguir ver a mudança. Algumas CDNs também possuem opção de apagar o cache.
Atualize o navegador e verifique novamente se está funcionando.
Resultado
Deixe um comentário