Desempenho & CDN 0 visualizações

Como configurar imagens em formato WebP para reduzir o peso das páginas do site

Ver no WHMCS

Como configurar imagens em formato WebP para reduzir o peso das páginas do site

Olá, querido(a) cliente da GeHost! 👋 Seja bem-vindo(a) ao seu guia prático, feito com carinho para te ajudar a deixar seu site mais rápido e leve — como um foguete com asas de papel! 🚀

Hoje vamos falar de um segredo que os sites mais rápidos já usam: imagens em formato WebP. Esse formato é como um superpoder para fotos e ilustrações — elas ficam menos pesadas (até 30% a menos!) sem perder qualidade. É como trocar um caminhão por uma bicicleta que leva o mesmo pacote!

Dica Sensei: Sites mais leves carregam mais rápido, agradam mais os visitantes e até melhoram o posicionamento nos buscadores como Google. Um bom desempenho é como um sorriso no início da jornada do usuário.

Passo a passo: como usar WebP no seu site

Para aproveitar o WebP, você precisa de dois ingredientes: imagens convertidas e configuração no servidor para que o navegador as reconheça. Vamos lá!

  1. Converta suas imagens para WebP

    Antes de tudo, você precisa transformar suas fotos (como JPG ou PNG) em WebP. Isso pode ser feito com ferramentas online gratuitas, como:

    Selecione suas imagens, escolha "WebP" como formato de saída e faça o download. Guarde esses arquivos novos com nomes como foto-principal.webp ou logo.webp.

  2. Suba as imagens WebP para o seu site

    Use o Gerenciador de Arquivos do cPanel para enviar suas novas imagens. Acesse o painel do cliente em painel.gehost.com.br e siga este caminho:

    Tela de login do cPanel com campos de usuário e senha

    Depois de logado, clique em Gerenciador de Arquivos no painel inicial:

    Painel inicial do cPanel com os grupos de ferramentas

    Selecione a pasta public_html (ou a pasta do seu site) e use o botão Upload para enviar seus arquivos WebP.

  3. Atualize o código do seu site para usar WebP

    Agora vem a parte mais importante: o seu site precisa saber que, quando possível, deve usar o arquivo WebP em vez do JPG ou PNG.

    Isso é feito com uma tag especial no HTML chamada <picture>. Veja um exemplo simples:

    <picture>
      <source srcset="foto-principal.webp" type="image/webp">
      <img src="foto-principal.jpg" alt="Descrição da imagem" />
    </picture>

    Essa estrutura diz ao navegador: “Tente usar o WebP primeiro. Se não conseguir, use o JPG como backup.”

    Se você usa um site construído com WordPress, Elementor, ou outro sistema, há plugins que fazem isso automaticamente (como WebP Express ou ShortPixel). Basta instalar e ativar!

  4. Verifique se o WebP está funcionando

    Para testar, abra seu site em um navegador moderno (Chrome, Firefox, Edge) e veja se as imagens estão carregando corretamente. Você pode usar o Inspeção de Elementos (botão direito → “Inspeção”) e verificar se o arquivo carregado tem extensão .webp.

    Se algo não funcionar, verifique se o arquivo está no caminho certo e se o nome está exatamente igual ao que está no código.

Dica extra: otimize ainda mais com o CDN da GeHost

Se o seu plano inclui CDN (Rede de Distribuição de Conteúdo), o WebP ganha ainda mais força! O CDN armazena suas imagens em servidores espalhados pelo mundo — isso significa que o visitante do Rio de Janeiro, por exemplo, baixa a imagem de um servidor mais próximo, muito mais rápido.

Para verificar se o CDN está ativo, acesse o painel do cliente e veja se seu domínio está listado como “ativado” em serviços de CDN. Se não estiver, entre em contato com nosso suporte — estamos aqui para te ajudar!

Leitor curioso? O WebP é suportado por quase todos os navegadores modernos. Mas, como segurança, sempre mantenha uma versão JPG/PNG como backup. Isso evita que o site fique “quebrado” em navegadores antigos.

Resumo do que você aprendeu hoje

  • WebP é um formato leve que reduz o tamanho das imagens sem perder qualidade.
  • Converta suas imagens para WebP com ferramentas online.
  • Suba os arquivos WebP para o seu site via Gerenciador de Arquivos.
  • Use a tag <picture> no código para priorizar WebP com fallback para JPG/PNG.
  • Use o CDN da GeHost para ainda mais velocidade global.

Parabéns, guerreiro(a) da web! 🏆 Você acabou de dar um passo gigante para deixar seu site mais rápido, mais leve e mais amado pelos visitantes.

Se tiver dúvidas, não hesite: nosso suporte está aqui para te ajudar — e é só um clique no painel do cliente.

Com carinho, seu Sensei da GeHost 🌟

Precisa de Ajuda?

Nossa equipe está pronta para resolver suas dúvidas.