O seu site está preparado para performar cada vez melhor? O Google está sempre lançando atualizações e métricas para estimular os sites a melhorarem sua performance com o objetivo de proporcionar uma melhor experiência para seus usuários, especialmente aqueles que utilizam dados móveis para navegar pela internet.
Um dos fatores que podem afetar a performance do seu site em WordPress ou WooCommerce são as imagens utilizadas para ilustrar seu website ou vender seus produtos e serviços na web. Se elas não estiverem otimizadas, elas podem afetar o carregamento da sua página.
E se uma página demora para carregar, o usuário pode abandonar o seu site, o que diminui o tráfego, posicionamento no Google e outros mecanismos de busca e ainda diminuir as conversões. Uma das formas de deixar o formato das suas imagens mais leve é usar o formato de imagem WebP.
Neste post, você vai conhecer melhor as funcionalidades do plugin WebP Express, um plugin para converter imagens para o formato WebP.
Mas antes de se aprofundar mais sobre as funcionalidades deste plugin, vamos entender melhor o que é o formato WebP.
O que é WebP?
WebP é um novo formato de arquivo para imagens. Ao utilizar este formato de imagens em seu site em WordPress, as imagens serão 30% menores em tamanho se comparado a outros formatos utilizados, como PNG e JPEG. E apesar de ter seu tamanho reduzido, a imagem não perde qualidade, o que é muito importante, afinal uma imagem vale mais que mil palavras.
Ainda de acordo com o site W3Techs, plataforma responsável por acompanhar o uso de tecnologias na web, 17,6% dos sites na web já utilizam o formato WebP para exibir suas imagens para os usuários. E este número vem crescendo consideravelmente. Em primeiro lugar ainda está o formato PNG com 78,7%.
No entanto, mesmo sendo um formato de imagem cada vez mais popular, nem todos os navegadores aceitam este novo formato. Mas, navegadores, como Google Chrome, Firefox e Microsoft Edge já aceitam o formato WebP.
O WordPress suporta o formato WebP?
A resposta é sim! Desde a versão 5.8, o WordPress passou a ter suporte para o upload de imagens no formato WebP. Se você tem uma versão inferior a 5.8, ao tentar realizar o upload de uma imagem em formato WebP, uma mensagem de erro aparecerá na tela.
Mas para converter imagens que você já utiliza em seu site ou loja virtual para WebP, você pode contar com o auxílio de plugins! Por isso, a partir de agora, você confere as principais funcionalidades do plugin WebP Express.
WebP Express: um plugin para converter imagens para WebP
O plugin WebP Express está disponível para download no repositório oficial do WordPress e conta com mais de 100 mil instalações ativas e conta com classificação de 4,5 estrelas.
Confira as principais funcionalidades deste plugin:
- Este plugin é gratuito, ou seja, você pode converter imagens sem custo adicional.
- Além de converter as imagens para WebP, o plugin mantém arquivado as imagens originais.
- Ao manter as imagens originais arquivadas, o plugin permite que o usuário possa ver as imagens disponíveis em seu site mesmo quando não está utilizando um navegador que tenha suporte para o formato WebP. Nestes casos, as imagens serão exibidas em PNG ou JPEG.
- O plugin utiliza a biblioteca WebP Convert para realizar as conversões das imagens.
- O WebExpress é compatível com plugins de lazy loading, como o Lazy Load feito pela WP Rocket. Ao combinar os plugins, as suas imagens aparecerão para o usuário apenas quando ele navegar por elas.
- Conversão automática das imagens enviadas para a biblioteca do WordPress.
- Conversão em lote das imagens já existentes.
- Ajustes de qualidade configuráveis (equilíbrio entre peso e qualidade).
- Integração direta com seu tema e conteúdo.
- Compatibilidade com JPEG, PNG e GIF.
- Funciona junto com os principais plugins de cache e otimização.
- Se por algum motivo, você precisar que algumas imagens do seu site permaneçam em outros formatos, o plugin permite que desenvolvedores realizem ajustes no código.
Como instalar o plugin WebP Express em seu WordPress?
Agora que você já conhece todas as funcionalidades deste plugin, é hora de aprender a instalá-lo em seu site.Para utilizar este plugin, o processo de instalação é bem simples. Confira:
- Localize na coluna esquerda do seu painel WordPress a opção “Plugins” e clique nele;
- Assim que carregar uma nova página, clique em “Adicionar novo”;
- Você será redirecionado a uma nova página, onde estão todos os plugins disponíveis para WordPress;
- Clique na opção pesquisar;
- Em seguida, digite WebP Express ou plugin para WebP.
- Após encontrá-lo, basta clicar em instalar agora.
- Caso não encontre, clique aqui e baixe o plugin.
- Após concluir a instalação, clique em ativar.
- Em seguida, faça as configurações necessárias de acordo com as suas necessidades.
- Agora é só aproveitar todos os benefícios do plugin.
Como configurar o plugin WebP Express em seu WordPress?
Ao ativar, você será direcionado para a tela de configurações. Entre os principais ajustes estão:
HTML Handling: escolha como as imagens serão substituídas no código HTML (troca direta da tag <img> ou uso do elemento <picture> com fallback).
Operation Mode: a opção padrão “Vary Images Response” já é suficiente para começar, entregando automaticamente versões WebP para navegadores compatíveis.
Conversion Settings: defina a qualidade e compressão das imagens WebP. É possível seguir as recomendações ou testar valores diferentes até encontrar o equilíbrio ideal.
Convertendo imagens existentes:
Você pode optar por:
Conversão em lote (bulk): ideal para sites que já possuem muitas imagens. O processo pode demorar, então é indicado rodar em horários de menor tráfego.
Conversão automática no upload: toda nova imagem será salva também em WebP.
Como lidar com os problemas que podem surgir durante a conversão:
Imagens quebradas: caso seu tema ou outro plugin não interprete bem a substituição, teste as diferentes opções de HTML Handling até encontrar a melhor.
Conversão seletiva: é possível escolher imagens específicas na biblioteca de mídia para converter.
Como converter imagens com o WebP Express usando o WP-CLI:
Para usuários avançados, o plugin oferece a possibilidade de automatizar as conversões por meio do WP-CLI. Ideal para quem não resiste a uma linha de comando:
Ajuda
Use a opção –help para aprender sobre as opções disponíveis para cada comando.
- wp webp-express –help: Exibe todos os comandos disponíveis para o WebP Express.
- wp webp-express convert –help: Mostra as opções específicas para o comando convert.
Converter Imagens
- wp webp-express convert: Cria imagens WebP para todas as imagens que ainda não foram convertidas.
- wp webp-express convert –reconvert: Converte novamente todas as imagens, incluindo aquelas que já possuem uma versão WebP.
- wp webp-express convert themes: Converte apenas as imagens localizadas na pasta de temas.
- wp webp-express convert uploads/2021: Converte somente as imagens encontradas na pasta “2021”, dentro do diretório de uploads.
- wp webp-express convert –only-png: Converte exclusivamente as imagens no formato PNG.
- wp webp-express convert –quality=50: Define a qualidade da conversão para 50, ignorando a configuração definida na interface do plugin.
- wp webp-express convert –converter=cwebp: Força o uso do conversor cwebp para a operação.
Limpar Imagens WebP (Flush)
- wp webp-express flushwebp: Remove todas as imagens WebP geradas.
- wp webp-express flushwebp –only-png: Remove apenas as imagens WebP que foram criadas a partir de imagens PNG.
Sintaxes dos Comandos
Limpar: wp webp-express flushwebp [–only-png]
Converter: wp webp-express convert [<localização>] [–reconvert] [–only-png] [–only-jpeg] [–quality=<número>] [–near-lossless=<número>] [–alpha-quality=<número>] [–encoding=<auto|lossy|lossless>] [–converter=<conversor>]
Mas lembre-se, antes de iniciar a conversão de imagens para o novo formato, é essencial que você faça um backup em seu site. Desta forma, em caso de problemas, você poderá utilizar o backup para solucionar qualquer impasse.
Além de manter o backup atualizado, utilize o ambiente de testes antes de executar as mudanças no site publicado. Assim, você pode testar tudo com segurança.
Veja também: Como configurar o plugin WebP Express em servidores NGINX para Otimizar Imagens no WordPress.
Conclusão
Ao longo deste post, você pode saber um pouco mais sobre o novo formato de imagens WebP e quais as principais funcionalidades do plugin WebP Express.
No entanto, se você quer conhecer mais opções de plugins para converter imagens para WebP, confira este post: Imagens WebP: saiba o que é e como utilizá-la no seu site WordPress.
Agora que você chegou até o fim deste post, nós queremos saber: você já utiliza este formato em seu site? Sentiu alguma diferença na performance após a otimização? Conta para a gente nos comentários.
E se você gostou deste post, compartilhe com seus amigos em suas redes sociais.
Até a próxima!