Como configurar lazy loading de imagens para melhorar o tempo de carregamento
Olá, querido cliente da GeHost! 👋 Seja bem-vindo ao seu guia de desempenho e otimização com a Sensei da GeHost — aqui, ensinamos com carinho, clareza e segurança, como deixar seu site mais rápido, leve e agradável para os visitantes.
Imagine um site que carrega rápido, mesmo com muitas imagens. Parece mágica? Não é. É só uma boa prática chamada lazy loading. Vamos explicar como colocar isso em prática, mesmo que você não seja técnico.
Dica da Sensei: O lazy loading faz com que as imagens só carreguem quando o visitante rolar a página até elas. Isso economiza tempo, banda e torna o site mais responsivo!
O que é lazy loading?
É uma técnica que atrasa o carregamento das imagens até o momento em que elas aparecem na tela do usuário. Em vez de carregar todas as fotos ao abrir a página, o navegador espera até que a imagem esteja "próxima" da área visível.
Resultado? O site parece mais rápido, especialmente em páginas com muitas imagens — como portfólios, lojas online ou blogs.
Como ativar o lazy loading na sua hospedagem GeHost?
Na GeHost, você não precisa instalar nada complexo. O sistema já suporta essa funcionalidade, mas você precisa ativá-la de forma correta no seu site. Vamos lá, passo a passo:
- Entre no painel da GeHost: Acesse painel.gehost.com.br com seu usuário e senha.
- Acesse o Gerenciador de Arquivos: No painel, localize e clique em Gerenciador de Arquivos (File Manager).
- Navegue até a pasta do seu site: Abra a pasta
public_html— é aqui que estão todos os arquivos do seu site. - Encontre o arquivo de configuração: Procure por
index.htmlou o arquivo principal da sua página (pode serhome.php,index.php, etc.). - Edite o arquivo: Clique com o botão direito sobre o arquivo e escolha Editar ou Code Editor.
- Localize as tags <img>: Procure por linhas que comecem com
<img, como:<img src="foto1.jpg" alt="Minha foto" >
- Adicione o atributo
loading="lazy": Basta acrescentar esse atributo dentro da tag <img>, assim: - Salve as alterações: Clique em Salvar ou Salvar Arquivo.
- Atualize o site: Acesse seu site no navegador e verifique se as imagens estão carregando corretamente — agora, elas só carregarão quando forem visíveis!
<img src="foto1.jpg" alt="Minha foto" loading="lazy" >
Dica da Sensei: Você pode fazer isso em todos os arquivos do seu site que contenham imagens. O ideal é aplicar o loading="lazy" em todas as imagens que não estão imediatamente visíveis na primeira tela.
Como saber se está funcionando?
Use o modo de desenvolvedor do seu navegador (pressione F12 ou Ctrl+Shift+I). Abra a aba Network e atualize a página. Observe que as imagens só aparecem no carregamento quando você rola a tela até elas.
Se você quiser, pode usar ferramentas gratuitas como PageSpeed Insights ou GTmetrix para verificar o impacto do lazy loading no desempenho do seu site.
Importante: O que NÃO fazer
- Não instale plugins ou scripts complexos que não sejam necessários — o
loading="lazy"já é suportado por navegadores modernos. - Não altere arquivos do sistema da GeHost — tudo deve ser feito apenas nos arquivos do seu site (dentro de
public_html). - Não use atributos como
data-srcoulazyloadse não for necessário — o padrão do HTML já é suficiente.
Pronto! Você está no caminho certo.
Com esse pequeno ajuste, você já está deixando seu site mais rápido, mais leve e mais amigável para o visitante. E lembre-se: o sucesso do seu site começa com pequenas ações, como essa.
Se precisar de ajuda, entre em contato com o nosso suporte — estamos aqui para te ajudar, com carinho e atenção. 💙
Com carinho,
A Sensei da GeHost
Seu parceiro de crescimento digital
Informações importantes:
- Grupo: G e Soluções e Eventos LTDA (marca institucional Entexp, entexp.com.br).
- CNPJ: 46.647.904/0001-04.
- Suporte: 30 dias grátis após a entrega.
- Formas de pagamento: Cartão de Crédito (PayPal) e Pix (InfoPago).