Como configurar cache do navegador (browser caching) pelo arquivo .htaccess Print

  • 0

Como Configurar Cache do Navegador pelo Arquivo .htaccess (para Melhor Desempenho)

Olá, amigo(a) GeHost! Seja bem-vindo(a) ao seu guia de desempenho web com carinho e clareza. Aqui, você vai aprender como usar o .htaccess para ativar o cache do navegador — um truque simples que deixa seu site mais rápido, reduzindo o tempo de carregamento e o uso de dados.

Imagine que seu site é uma loja. Cada vez que um cliente entra, ele tem que pegar tudo do estoque. Agora imagine que, depois da primeira visita, ele pode levar algumas coisas consigo — como camisetas, óculos, sapatos — e usar de novo. Isso é o cache: o navegador "lembra" de arquivos que já baixou, como imagens, estilos e scripts.

Com o cache ativado, o usuário não precisa baixar tudo de novo. É como ter um armário de memória no navegador. Mais rápido, mais leve, mais agradável.

Dica do Sensei: O cache não é só para sites grandes. Ele ajuda qualquer site — mesmo que seu blog tenha poucas páginas — a ficar mais ágil. E isso melhora a experiência do visitante e até o SEO!

Passo a Passo: Ativando Cache no .htaccess

Para configurar o cache, vamos editar o arquivo .htaccess no diretório raiz do seu site (geralmente public_html). Esse arquivo controla como o servidor lida com pedidos de acesso.

  1. Entre no painel do cliente: Acesse painel.gehost.com.br com suas credenciais.
  2. Abra o Gerenciador de Arquivos: No painel, clique em Arquivos e depois em Gerenciador de Arquivos.Tela do Gerenciador de Arquivos do cPanel
  3. Ative a opção "Mostrar arquivos ocultos": No canto superior direito, marque a opção Mostrar arquivos ocultos (incluindo .htaccess).
  4. Localize o arquivo .htaccess: Navegue até a pasta public_html (ou a pasta raiz do seu site). Procure por um arquivo chamado .htaccess. Ele pode estar escondido — mas agora você já ativou a visualização.
  5. Edite o arquivo: Clique com o botão direito no arquivo .htaccess e escolha Editar.
  6. Adicione as regras de cache: No editor, cole o código abaixo no final do arquivo. Ele define quanto tempo o navegador deve manter cada tipo de arquivo em cache:
    # Ativação de Cache para Arquivos Estáticos
    <IfModule mod_expires.c>
        ExpiresActive On
        ExpiresDefault "access plus 1 month"
        ExpiresByType text/css "access plus 1 month"
        ExpiresByType application/javascript "access plus 1 month"
        ExpiresByType application/x-javascript "access plus 1 month"
        ExpiresByType image/gif "access plus 1 year"
        ExpiresByType image/jpeg "access plus 1 year"
        ExpiresByType image/png "access plus 1 year"
        ExpiresByType image/svg+xml "access plus 1 year"
        ExpiresByType image/webp "access plus 1 year"
    </IfModule>
    
  7. Salve as alterações: Clique em Salvar (ou Salvar Arquivo) no editor.

Como Funciona o Cache?

Com esse código, o navegador entende que:

  • Arquivos de imagem (como JPG, PNG, WebP) podem ser armazenados por 1 ano.
  • Arquivos CSS e JavaScript podem ser armazenados por 1 mês.
  • Outros arquivos (como HTML) são atualizados mais frequentemente — por isso o padrão é "acesso mais 1 mês".

Se você fizer uma mudança no design (como alterar uma cor), o navegador vai perceber que o arquivo mudou e baixará a nova versão. Mas para os arquivos que não mudaram, ele usa a cópia já salva.

Importante: Se você alterar algo no site e o visitante não ver a mudança, é porque o cache ainda está ativo. Ele só atualiza após o tempo definido (ex: 1 mês). Para testar, faça um refresh forçado (Ctrl + F5 no Windows ou Cmd + Shift + R no Mac).

Pronto! Seu site está mais rápido!

Parabéns, Sensei do Desempenho! Você acabou de dar um passo poderoso para tornar seu site mais leve, mais rápido e mais agradável para o visitante.

Se precisar de ajuda com qualquer outro ajuste — como melhorar o cache com CDN, otimizar imagens ou usar o mod_deflate para compressão — é só pedir. Estamos aqui para ajudar, com carinho e tecnologia.

Até a próxima, com um sorriso e um bom desempenho!


Was this answer helpful?

« Back