Como ativar o carregamento preguiçoso (lazy loading) de imagens no seu site
Olá, viajante da web! 🌟 Se você quer deixar seu site mais rápido, leve e responsivo, ativar o carregamento preguiçoso de imagens é um dos passos mais simples e eficazes que você pode dar. É como dizer: "Só carregue a imagem quando o visitante estiver olhando para ela!"
Na GeHost, você pode fazer isso facilmente — sem precisar de código complexo ou ferramentas externas. Vamos juntos nesse guia prático, passo a passo, com um toque de calma e sabedoria (como um verdadeiro Sensei da web).
O que é lazy loading?
É uma técnica que adia o carregamento das imagens até o momento em que elas entram na área visível da tela. Isso significa que, ao abrir seu site, as imagens que estão abaixo da dobra (ou fora da tela) não são baixadas imediatamente — só quando o usuário rola para elas.
💡 Dica do Sensei: Sites com muitas imagens (como portfólios, lojas ou blogs) ganham até 50% mais em velocidade com lazy loading. E o usuário nem percebe a diferença — só sente a rapidez!
Como ativar no seu site (passo a passo)
Seu site está hospedado na GeHost? Ótimo! Vamos lá:
- Entre no painel do cliente: Acesse painel.gehost.com.br com suas credenciais.
- Abra o cPanel: No painel, clique em cPanel — é o coração da sua hospedagem.
- Localize o Gerenciador de Arquivos: No cPanel, encontre a ferramenta chamada Gerenciador de Arquivos (File Manager) e clique nela.
- Navegue até a pasta do site: No Gerenciador, abra a pasta public_html — é onde estão todos os arquivos do seu site.
- Abra o arquivo principal: Procure pelo arquivo principal do seu site, geralmente index.html ou index.php. Clique para editá-lo.
Após abrir o arquivo, procure pelas tags de imagem, que geralmente têm o formato:
<img src="imagem.jpg" alt="Descrição" >
Para ativar o lazy loading, basta adicionar o atributo loading="lazy" dentro da tag <img>. Veja como ficará:
<img src="imagem.jpg" alt="Descrição" loading="lazy" >
✨ Dica do Sensei: Você pode fazer isso em todas as imagens do seu site — não precisa de um código especial. O navegador entende automaticamente!
Pronto! O que acontece agora?
Depois de salvar as alterações (use o botão Salvar no editor), seu site já está usando o lazy loading. Agora, quando os visitantes acessarem seu site:
- As imagens que estão fora da tela não serão carregadas imediatamente.
- Elas só aparecerão quando o usuário rolar até elas.
- Isso reduz o tempo de carregamento inicial e economiza dados.
Como verificar se funcionou?
Use o navegador Chrome, abra as Ferramentas do Desenvolvedor (F12), vá até a aba Network e recarregue a página. Veja se as imagens aparecem com atraso, apenas quando você rola. Se sim, parabéns — você está no caminho certo!
Importante: não é só imagem
Se o seu site usa vídeos, iframes ou elementos com conteúdo pesado, o mesmo princípio pode ser aplicado. Basta adicionar loading="lazy" nos elementos que suportam essa propriedade.
Se tiver dúvidas, não hesite em entrar em contato com nosso suporte — estamos aqui para ajudar. E lembre-se: cada pequeno ajuste no seu site é um passo maior em direção ao sucesso.
Com carinho,
Sensei da GeHost
*Hospedagem que cuida de você, com tecnologia leve e coração forte.*
