O que é webP e como usar

WebP é uma formato de imagem desenvolvido pelo próprio Google com o intuito de diminuir o tamanho de imagens trafegadas dentro da internet para reduzir o tempo de carregamento e download de imagens, sem interferir na qualidade das imagens.

Segundo o Google, o formato webP pode ser até 45% menor do que imagens em formatos tradicionais como jpeg e png.

O formato webP foi criado pelo Google em meados de 2010, mas passou a ganhar mais aderência somente nos últimos anos, visto que um dos grandes limitadores do formato na época de seu lançamento era a incompatibilidade com navegadores, já que no início, o formato webP era compatível apenas com o Google Chrome, mas atualmente, boa parte dos navegadores já dão suporte ao webP.

Por exemplo, o Firefox, um dos navegadores mais utilizados em versões desktop, passou a suportar nativamente o formato de webP somente em agosto de 2018, 8 anos após o lançamento oficial.

Atualmente, os navegadores que dão suporte nativo para webP são:

• Chrome (desktop e celular).
• Firefox (desktop e celular).
• Edge.
• Opera (desktop e celular).

Quais as vantagens de usar webP em sites e apps?

Em média, mais de 65% do peso de um site é de imagens, sendo assim, webmasters tem o desafio de criar aplicações visualmente atrativas, mas sem afetar a performance da aplicação.

Pensando nisso, utilizar o formato webP é bastante vantajoso, já que é possível acelerar a entrega das imagens com baixo esforço técnico. Além disso, por ser um formato mais leve, a utilização de webP pode contribuir para que seu site ganhe relevância orgânica. Por exemplo, boa parte das ferramentas de performance utilizadas atualmente verificam o formato de suas imagens, classificando seu site com melhor pontuação, caso identifiquem que o formato webP é utilizado.

Outro ponto importante é o volume de uso de banda utilizado por imagens webP. Já que as imagens são menores, consequentemente é necessário utilizar menos dados de saída. Se considerarmos aplicações com alta escala de tráfego, reduzir o uso de banda pode representar uma economia significativa de custos.

Quais as desvantagens de usar webP em sites e apps?

Atualmente, a desvantagem de usar webP é a incompatibilidade com alguns navegadores, em especial, o Safari da Apple que por enquanto só dá suporte a imagens em webP em nas versões do iOS 14 e macOS 11.0. Porém, é possível contornar essa desvantagem utilizando um produto de otimização e conversão de imagens, que transformar as imagens jpeg e png em webP de acordo com o navegador do usuário, possibilitando ter uma boa eficiência de entrega em webP para navegadores que dão suporte e se eventualmente algum navegador não der suporte, a imagem é entregue automaticamente em seu formato original.

Como usar webP em sites e apps?

Atualmente, a melhor prática para utilizar webP é através de um conversor de imagens, já que por enquanto, nem todos os navegadores dão suporte nativo a webP.

A GoCache possui uma ferramenta de otimização de imagens que realiza a conversão de imagens para webp, automaticamente e sem esforço técnico.

Basicamente, nosso produto de otimização de imagens considera o formato das imagens de seu site e app e realiza a conversão das imagens na borda, entregando o melhor formato para o usuário final, considerando tanto o navegador utilizado no acesso quanto a localização geográfica, reduzindo latência através da entrega via CDN.

Trata-se de um produto muito simples de ser ativado, disponível para todos os usuários que utilizam nossa rede de distribuição de conteúdo.

Caso queira conhecer mais sobre o Lithio, nosso otimizador de imagens, acesse a documentação oficial.

Existem também opções de plugin para WordPress que fazem a conversão de imagens, mas é necessário avaliar como a conversão é feita, já que muitos plugins passam a distribuir imagens por endereços externos, prejudicando a otimização do site para SEO e muitas vezes adicionando latência de entrega.

• Otimização de imagens no WordPress
• GT Metrix: Como usar
• Como usar CDN para distribuir imagens
• WebPageTest: Aprenda como usar
• Como usar webP no WordPress
• CDN e SEO: Práticas recomendadas