Blog de SEO, Interfaces e Comércio Eletrônico

Não importa o tamanho do seu site, se você quer que ele tenha um tempo de carregamento menor, com certeza você deverá seguir este pequeno tutorial.

Para fazer os passos a seguir é necessário um conhecimento médio/avançado, pois você irá mexer em arquivos de configuração críticos que podem tirar o seu site do ar.

Só fiz testes com hospedagens em ambiente Linux/Apache e tive boas experiências chegando a reduzir o tamanho dos arquivos em até 400%.

Passo 1

Crie um arquivo na raiz do site com seguinte trecho de código:
Arquivo js-gzip.php

<?  ob_start('ob_gzhandler');
  header ("content-type: text/javascript; charset: UTF-8");
  header ("cache-control: must-revalidate");
  $offset = 60 * 60;
  $expire = "expires: " . gmdate ("D, d M Y H:i:s", time() + $offset) . " GMT";
  header ($expire); ?>

Este código além de fazer a compressão do arquivo, irá também forçar o navegador a fazer o cache do mesmo, otimizando o desempenho do seu site no navegador do cliente.

Passo 2

Agora vamos mexer no .htaccess e aconselho fazer um backup antes de salvar o arquivo, pois este é um arquivo crítico que pode tirar o site do ar.
Se seu site não possuir, crie um e publique na raiz do site, qualquer problema basta removê-lo.
.htaccess

<FilesMatch "\.(js)">
    ForceType application/x-httpd-php
    php_value auto_prepend_file "/caminho/completo-do-js-gzip.php"
</FilesMatch>

Mesmo sem fazer a versão Minify você já terá um ganho de performance. Nos meus testes reduzi um arquivo de 200kb de JavaScript para apenas 35kb.
Para seu usuário fará diferença no tempo de carregamento do site e no fim do mês você terá economizando mais banda do seu servidor.

O mesmo processo pode ser feito para arquivos CSS também, ficaria assim:
gzip-css.php

<?
ob_start('ob_gzhandler');
    header("Content-type: text/css; charset: UTF-8");
    header("Cache-Control: must-revalidate");
    $offset = 60 * 60 ;
    $ExpStr = "Expires: " .
    gmdate("D, d M Y H:i:s",
    time() + $offset) . " GMT";
    header($ExpStr);
?>

e no .htaccess , adicionar:

<FilesMatch "\.(css)">
    ForceType application/x-httpd-php
  php_value auto_prepend_file "/caminho/completo-do-css-gzip.php"
</FilesMatch>

O caminho completo onde está o arquivo seria algo parecido com “/home/site/login/public_html/arquivo-gzip.php”.
Se você não sabe o caminho completo, pode pegar rodando o seguinte comando php

echo $_SERVER['DOCUMENT_ROOT'] 

Existem diversos métodos para efetuar esta operação, vou citar mais um e você escolhe qual utilizar.

No .htaccess, adicione as linhas :

<IfModule mod_deflate.c>
<FilesMatch "\.(js|css)$">
SetOutputFilter DEFLATE
</FilesMatch>
</IfModule>

Em ambos os casos, é necessário que o seu servidor esteja com o gzip habilitado.

Para servir o conteúdo HTML otimizado também, você pode colocar no cabeçalho do seu site em php a chamada

<?	ob_start('ob_gzhandler'); ?>

Para o WordPress existem um plugin chamado WP Super Cache que comprime os arquivos e gera versões estáticas dos arquivos de conteúdo, economizando as consultas ao banco de dados e também há o WP Minify que gera versões reduzidas de Javascript e CSS

Por que é importante otimizar?
Por que além de melhorar a experiência do seu usuário navegando em um site mais rápido, o Google também leva em conta o tempo de carregamento do site como um dos fatores de ranking.

Também é interessante otimizar as imagens que são servidas em seu site, recomendo o uso de um plugin do Firefox, o ySlow que já integra o serviço do Yahoo Smush.it! que citei em um post anterior. Através do ySlow você consegue ir medindo os resultados de suas ações através de um score que vai até 100, cada item tem um peso e Compressão de arquivos com gzip é uma das princípais.

Espero que tenha ajudado a deixar seu site mais rápido e que você não tenha tirado seu site do ar.