Usando imagens WebP no WordPress

Como você provavelmente já sabe, quando se trata de sites, a velocidade é importante! Uma das principais coisas que você pode fazer para acelerar seu site é reduzir o tamanho da página. Quanto menor, menos dados precisam ser baixados. Quanto menos dados, mais rápido (dentro do razoável!) a página provavelmente será carregada.

As imagens constituem uma parte significativa do tamanho do arquivo de uma página da Web (às vezes, mais de 50% dos dados da página são imagens). Isso torna as imagens o alvo número um para fazer uma dieta em sua busca por tamanhos de página menores! Tradicionalmente, a maioria das imagens usadas em sites são JPEGs ou PNGs. Ambos são excelentes tipos de arquivos que funcionam bem em sites. No entanto, eles podem ter um problema de tamanho. Embora o uso de uma ferramenta como o TinyPNG seja recomendado (e possa ter um impacto dramático no tamanho das imagens que você adiciona ao seu site), e se houvesse um formato de imagem menor 'direto da caixa'. Bem, existe e chama-se WebP.

Neste artigo, vamos dar uma olhada nas imagens WebP com mais detalhes para descobrir o que são e como você pode usá-las em seu site WordPress. Então, se você sempre quis emagrecer seu site, vá tomar um café e comer um bolo (ninguém disse que temos que fazer dieta tão bem quanto o nosso site!) e vamos lá!

O que são imagens WebP?

Então, o que são essas imagens WebP que você provavelmente já ouviu as pessoas falarem? Bem, não há nada muito complexo ou misterioso nisso. Basicamente, é apenas outro tipo de arquivo. Em vez de as imagens serem salvas no formato JPEG ou PNG, elas são salvas como WebP. WebP foi realmente desenvolvido pelo Google. Eles descrevem o WebP como 'um formato de imagem moderno que fornece compressão superior sem perdas e com perdas para imagens na web. Usando o WebP, webmasters e desenvolvedores da web podem criar imagens menores e mais ricas que tornam a web mais rápida.'

O Google adora um site rápido, por isso faz sentido que eles sejam líderes no fornecimento de um formato de imagem que ajude os sites a serem executados mais rapidamente. Os arquivos WebP são normalmente de 25% a 34% do que um JPEG equivalente (de acordo com o próprio estudo do Google). Com base no fato de que as imagens podem compor a maior parte dos dados em uma página da Web, essa é uma economia significativa.

Hospede seu site com a Pressidium

GARANTIA DE DEVOLUÇÃO DO DINHEIRO DE 60 DIAS

VEJA NOSSOS PLANOS

E não se preocupe que você perderá a qualidade de suas imagens - todo o objetivo do WebP é ser capaz de salvar imagens em um formato que permaneça com alta qualidade do ponto de vista visual e, ao mesmo tempo, seja salva em um pequeno formato de arquivo. Um ganha-ganha.

Portanto, se as imagens WebP são pequenas e ainda oferecem uma ótima experiência visual para seus usuários, você pode se perguntar por que elas não estão em uso mais difundido. Existem algumas razões principais para isso.

1. Usabilidade: Atualmente, as imagens WebP não são suportadas pela maioria dos softwares de design gráfico, como Photoshop ou Illustrator. Qualquer pessoa que trabalhe nesses programas estará acostumada a abrir arquivos de imagens (de todas as descrições, JPEG, GIF, PNG etc.) e apenas 'começar' a editar conforme necessário. Além disso, quando se trata de salvar esses arquivos, você normalmente pode exportar para qualquer um dos formatos de imagem comuns. Com o WebP isso não é possível fazer imediatamente. Em vez disso, você provavelmente precisará baixar um plug-in do WebPShop para usar seu software de edição de imagem 'normal'. Até que as imagens WebP se tornem tão onipresentes quanto JPEGs e outros formatos, sempre haverá uma relutância em 'complicar demais' as coisas e muitos web designers continuarão a usar formatos de imagem mais tradicionais.
2. Compatibilidade do navegador : WebP NÃO é universalmente suportado por todos os navegadores. Isso significa que, embora a maioria de seus visitantes que usam navegadores atualizados como Chrome ou Mozilla não tenham problemas para visualizar essas imagens, você ainda terá uma minoria considerável que não poderá visualizar imagens de sites salvas como WebP, que inclui principalmente o Safari que fornece suporte apenas parcial dependendo da versão usada (no momento da redação). Você precisará de uma solução alternativa (que discutiremos abaixo) para garantir que todos os visitantes possam ver seu site como você pretende.

Então, a pergunta tem que ser 'devo usar WebP?'. Bem, certamente parece que as pessoas estão começando a tomar mais conhecimento do que é um formato de arquivo incrivelmente inovador. E, se a velocidade realmente importa para você e você tem os recursos para criar um site usando imagens WebP, por que não? Tal como acontece com todas as novas tecnologias, às vezes pode demorar para sair do portão, mas é melhor estar à frente da curva do que correr para alcançar sua concorrência! Com isso em mente, vamos dar uma olhada em como usaríamos imagens WebP em um site WordPress.

Como usar imagens WebP com WordPress

Qualquer um que tenha mergulhado direto e tentado fazer upload de arquivos WebP para seu site WordPress antes de julho de 2021 ficaria um pouco desapontado. Você provavelmente esperaria que qualquer imagem WebP carregada pelo Media Center fosse salva normalmente. Em vez disso, você pode ter visto uma tela como esta:

Felizmente, desde o lançamento do WordPress 5.8, agora você pode enviar imagens WebP diretamente para o WordPress, o que torna esse excelente formato de imagem tão fácil de usar quanto os formatos JPEG, PNG e GIF. São melhorias consistentes como essa que são uma das principais razões pelas quais faz sentido atualizar seu núcleo do WordPress para a versão mais recente. Claro, se você estiver usando um host WordPress gerenciado como o Pressidium, nós cuidamos disso para você, ajudando a garantir que você esteja sempre executando a versão mais recente e melhor do WordPress.

Antes do lançamento do WordPress 5.8, uma das maneiras mais fáceis de usar imagens WebP era instalar um plug-in que convertesse os formatos de imagem suportados (por exemplo, PNGs) em arquivos WebP e os exibisse em seu site. Existem algumas ressalvas ao usar imagens WebP (nós as listamos acima) e usar um plug-in adequado, como o Shortpixel, pode eliminar essas desvantagens, portanto, ainda pode ser uma solução que vale a pena considerar. Continue a ler para saber mais!

Shortpixel

Shortpixel é um plugin incrível e que vale a pena pensar em usar, independentemente de você optar por usar imagens WebP. Shortpixel é um serviço de otimização de imagem bem estabelecido. Ele executa todas as imagens que você carrega por meio de seu excelente serviço de compactação de imagens, muitas vezes comprimindo o tamanho da imagem em 50% ou mais, sem perda de qualidade de imagem. Ele faz isso automaticamente, o que significa que você não precisa pensar em compactar suas imagens antes de enviá-las para seu site.

Para realmente aproveitar ao máximo o Shortpixel, você precisará pagar por um plano com eles. Eles cobram com base em 'imagens otimizadas/mês' com 5.000 imagens por mês custando apenas US$ 3,99/mês. Para muitos sites, esse plano será mais que suficiente e, dados os benefícios de desempenho associados a um site otimizado, é barato pelo preço.

O Shortpixel otimiza uma ampla variedade de formatos de imagem, incluindo JPEG e PNG. Então, você pode estar se perguntando, como isso me ajuda a adicionar imagens WebP ao meu site WordPress?

Se você se lembrar, nem todos os navegadores da Web suportam o formato WebP com suporte apenas parcial do WebP no Safari, dependendo da versão usada (no momento da redação) e nenhum suporte oferecido pelo Internet Explorer. Simplesmente não é uma opção viável criar um site que não atenda a esses visitantes, mesmo que aqueles que usam um navegador desatualizado ou sem suporte sejam uma minoria.

Você também deve se lembrar de que muitos softwares de edição de imagens também não suportam arquivos WebP imediatamente. Então, temos uma batalha em duas frentes… não apenas precisamos pular obstáculos para criar ou trabalhar com arquivos WebP em primeira instância, mas também precisamos encontrar uma maneira de a) adicioná-los ao nosso site WordPress eb) criar uma imagem de reserva para quem visita nosso site usando um navegador não compatível com WebP.

Shortpixel ao resgate

Shortpixel tem uma abordagem legal para usar imagens WebP em sites WordPress. Ao marcar uma única caixa de seleção no plug-in, você pode instruí-lo a criar versões WebP de qualquer imagem que você enviar. Você pode então dizer ao plug-in Shortpixel para exibir essas imagens WebP em navegadores que suportam WebP.

Se o navegador dos visitantes do site não puder exibir imagens WebP, um formato de imagem alternativo será exibido automaticamente. Isso dá a você o melhor de todos os mundos… a velocidade que acompanha um site que usa imagens de tamanho pequeno graças ao WebP para navegadores que podem lidar com elas ou uma alternativa bem otimizada para aqueles que não podem.

WebP é agora um formato de imagem amplamente adotado. Se você optar por usar a função de upload nativa agora disponível no WordPress ou gerá-los por meio de um plug-in como o ShortPixel, faz sentido mudar as imagens do seu site para variantes WebP para que seu site possa aproveitar o tamanho reduzido do arquivo que deve, por sua vez, se traduzem em um site de carregamento mais rápido.