Compressão GZIP: Técnica Simples Para Acelerar

📚 Relacionado: criacao de sites em ribeirao preto sp • criacao de sites no parana • publico alvo identificacao estrategia site

:::insight

variant=metric

title=Brotli comprime mais que Gzip

content=Gzip reduz arquivos de texto (HTML, CSS, JS) em cerca de 70-80%. O Brotli, sucessor mais moderno já suportado por todos os navegadores atuais, costuma comprimir de 15 a 20% a mais que o Gzip para o mesmo conteúdo — vale checar qual seu servidor está usando.

:::

:::case

title=Compressão desativada no servidor

image=

description=Um cenário técnico comum: o servidor está configurado corretamente, mas a compressão nunca foi ativada explicitamente para arquivos CSS e JS — só para HTML.

result=Ativar Gzip ou Brotli para todos os tipos de arquivo de texto normalmente reduz o peso total transferido em mais de metade, sem nenhuma mudança visual no site.

:::

O PageSpeed Insights deu nota vermelha pro seu site. Você já comprimiu as imagens, já ativou cache — e a nota continua baixa. Existe uma otimização técnica que ninguém vê, não envolve imagem nenhuma, e reduz o peso do próprio código HTML/CSS/JS em até 80% sem mudar uma vírgula do conteúdo visível. É a compressão GZIP.

O que é compressão GZIP, afinal?

GZIP é um algoritmo que comprime texto — como um "zip" automático e invisível. Quando um visitante acessa seu site, o servidor comprime o HTML, CSS e JavaScript antes de enviar. O navegador recebe o arquivo comprimido, descomprime automaticamente e mostra pro visitante. Tudo transparente, tudo instantâneo.

É como zipar um documento antes de enviar por email, mas o programa do outro lado deszipar automaticamente. O visitante nunca vê o .zip, só o documento pronto.

Por que arquivo de texto precisa de compressão?

Código HTML, CSS e JavaScript são texto puro. Texto puro tem muita redundância:

Tags HTML que se repetem (
,
)
Espaços e quebras de linha
Nomes de classes que se repetem
Código CSS com seletores longos

GZIP encontra esses padrões, identifica redundâncias e comprime tudo em um tamanho muito menor.

Exemplo prático:

Arquivo HTML original: 250 KB
Após compressão GZIP: 50 KB
Economia: 80%

Essa redução de 200 KB pode significar 2-3 segundos a menos de tempo de carregamento em conexões móveis.

GZIP vs Brotli: qual usar?

Existem dois algoritmos de compressão modernos:

AspectoGZIPBrotli IdadeMais antigo (1992)Mais novo (2015, Google) Compressão60-80%70-90% Velocidade de compressãoRápidoLigeiramente mais lento Suporte do navegadorQuase 100%95%+ Quando usarFallback seguroPrimeiro escolha PerformanceExcelenteMelhor que GZIP

Recomendação: Configure Brotli primeiro, com GZIP como fallback. Navegadores modernos usam Brotli. Navegadores antigos caem para GZIP. Todos ganham compressão.

Dica: A maioria dos servidores modernos configura ambos automaticamente. Você só precisa verificar se está habilitado.

Redução real de tamanho: números que importam

Teste com seu próprio site:

Tipo de arquivoTamanho originalCom GZIPRedução HTML puro150 KB30 KB80% CSS (não minificado)200 KB40 KB80% JavaScript300 KB80 KB73% Fontes web (.woff2)Já comprimido100 KB0% Imagens (PNG, JPEG)Já comprimido500 KB0%

Repare: imagens e fontes já vêm comprimidas de fábrica. GZIP não ajuda em imagem, só em código.

Mas se seu site tem muito CSS e JavaScript, ganho é enorme.

Como GZIP funciona na prática: o ciclo

Você configura GZIP no servidor

Apache: ativa mod_deflate
Nginx: ativa ngx_http_gzip_module

Visitante acessa seu site

Navegador envia: "Aceito conteúdo comprimido com GZIP"
Servidor vê a solicitação

Servidor comprime HTML, CSS, JS

Compressão acontece em millisegundos
Arquivo vira 1/4 do tamanho

Servidor envia arquivo comprimido

Header HTTP diz: Content-Encoding: gzip
Navegador recebe menor quantidade de dados

Navegador descomprime automaticamente

Mostra HTML normal pro visitante
Visitante vê o site rápido

Visita rápida = menos abandono = mais conversão

Como configurar GZIP no seu servidor

Se você usa .htaccess (Apache)

Adicione isto no arquivo .htaccess na raiz:

```apache

AddOutputFilterByType DEFLATE text/html

AddOutputFilterByType DEFLATE text/plain

AddOutputFilterByType DEFLATE text/xml

AddOutputFilterByType DEFLATE text/css

AddOutputFilterByType DEFLATE text/javascript

AddOutputFilterByType DEFLATE application/xml

AddOutputFilterByType DEFLATE application/xhtml+xml

AddOutputFilterByType DEFLATE application/rss+xml

AddOutputFilterByType DEFLATE application/javascript

AddOutputFilterByType DEFLATE application/x-javascript

AddOutputFilterByType DEFLATE application/x-font-ttf

AddOutputFilterByType DEFLATE font/opentype

Header append Vary Accept-Encoding

```

Se você usa Nginx

Adicione ao seu bloco http ou server:

```nginx

gzip on;

gzip_vary on;

gzip_min_length 1000;

gzip_types text/plain text/css text/xml text/javascript

application/x-javascript application/xml+rss

application/javascript application/json

font/opentype image/svg+xml;

gzip_disable "msie6";

```

Essa configuração:

Ativa GZIP
Comprime apenas arquivos maiores que 1000 bytes
Define quais tipos de arquivo comprimir
Desativa para IE6 (navegador antigo)

Se você usa Cloudflare

Cloudflare já comprime automaticamente. Você só precisa verificar:

Acesse seu dashboard Cloudflare
Vá em Speed → Optimization
Certifique-se que "Brotli" está ativado

Se você usa Vercel, Netlify, Render ou hospedagem moderna

Compressão já vem ativada por padrão. Você não precisa configurar nada.

Como verificar se seu site já usa GZIP

Opção 1: PageSpeed Insights

Acesse pagespeed.web.dev
Digite sua URL
Se não houver aviso sobre compressão, está ativado

Opção 2: Browser DevTools

Abra seu site
Pressione F12 → aba Network
Clique em qualquer arquivo HTML/CSS/JS
Olhe a aba "Headers"
Procure por: Content-Encoding: gzip ou content-encoding: br (Brotli)
Se aparecer, está funcionando

Opção 3: Ferramentas online

Acesse tools.keycdn.com/gzip-test e digite sua URL. Mostra se GZIP está ativado e quanto economiza.

Impacto na performance: números reais

Um site típico com muito CSS/JS:

CenárioTempo de carregamento Sem compressão5.0 segundos Com GZIP1.5 segundos Com GZIP + cache0.8 segundos (revisita)

Essa diferença de 3-4 segundos reduz abandono e melhora conversão.

GZIP impacta SEO?

Indiretamente, sim. O Google mede Core Web Vitals:

LCP (Largest Contentful Paint) — quando o site fica visível
INP (Interaction to Next Paint) — responsividade
CLS (Cumulative Layout Shift) — estabilidade visual

GZIP reduz o tempo de transferência, logo melhora LCP. Site mais rápido = melhor ranking.

A última peça do quebra-cabeça

Se você já:

✓ Otimizou imagens
✓ Ativou cache
✓ Minificou CSS/JS

Mas a nota no PageSpeed continua baixa, GZIP é o ajuste que falta. E é de configuração única — uma vez feito, nunca mais mexe.

Seu site está comprimindo código?

A Desenvolve Sites audita performance técnica completa: cache, GZIP, minificação, imagens, fontes. Configuramos tudo certo, validamos com PageSpeed Insights, entregamos relatório e números. Seu site fica rápido de verdade. Chame a gente.

Perguntas Frequentes

GZIP deixa o site inseguro?

Não. GZIP é compressão, não criptografia. É como zipar um arquivo público. Segurança é responsabilidade do HTTPS, não de GZIP. Use HTTPS + GZIP juntos.

Se eu comprimir TUDO, o servidor fica sobrecarregado?

Não. Compressão GZIP é computacionalmente barata. Servidores modernos comprimem centenas de requisições por segundo sem problema. O ganho de banda economizada compensa em muito o custo de CPU.

Qual nível de compressão devo usar?

GZIP tem níveis 1-9 (1=rápido, 9=melhor compressão). Recomendação: 6 ou 7. É o sweet spot entre compressão boa e velocidade. Nível 9 economiza pouco mais mas toma mais CPU.

Minificar CSS/JS ajuda em compressão?

Sim, mas GZIP já comprime de verdade. Minificar reduz redundância (espaços, nomes longos). GZIP comprime padrões. Ambos juntos são ótimos, mas se você tem que escolher um, GZIP primeiro.

Meu site usa WordPress/Drupal. Como faço compressão lá?

WordPress: Plugin WP Super Cache já ativa automaticamente. Se não tiver, ative no .htaccess. Drupal: ativa via admin → Performance. Drupal já vem com suporte.

Links Relacionados

Otimizar Imagens: Guia Para Acelerar Site