Minificador de HTML

Cole HTML para remover comentários e espaços redundantes e minificar CSS e JavaScript inline. O conteúdo dentro de <pre> e <textarea> fica exatamente como foi escrito.

Roda no seu navegadorSem cadastroNada é enviado

Saída minificada

Como usar: Minificador de HTML

  1. Cole um documento ou fragmento HTML, ou abra um arquivo .html.
  2. Escolha o que remover: comentários, espaços e se os blocos inline <style> e <script> também devem ser minificados.
  3. Confira a linha de avisos: um script inline com erro de sintaxe é mantido sem alterações em vez de quebrar sua página.
  4. Copie o HTML minificado ou baixe-o.

O que é removido?

  • Comentários: <!-- … --> é removido, exceto comentários condicionais do Internet Explorer e comentários que começam com <!--!.
  • Espaços entre elementos de bloco: quebras de linha e indentação entre tags como <div>, <li> ou <head> nunca são renderizadas, então são totalmente eliminadas.
  • Sequências de espaços no texto: são reduzidas a um único espaço, que é exatamente como o navegador as renderiza de qualquer forma.
  • Espaços dentro das tags: <p class = "a"> vira <p class="a">.

O que é preservado?

Em alguns lugares os espaços são significativos, e o minificador os respeita. O conteúdo de <pre> e <textarea> é mantido byte a byte. Um único espaço entre elementos inline, como <b>bold</b> text, é mantido porque removê-lo juntaria as palavras. Valores de atributos e aspas nunca são alterados.

CSS e JavaScript inline

Blocos <style> inline são otimizados com CSSO e blocos <script> inline com Terser, os mesmos motores usados nas páginas do minificador de CSS e do minificador de JavaScript. JSON-LD e outros blocos de script JSON são compactados, e scripts de tipos desconhecidos (por exemplo, templates) ficam intocados.

Vale a pena minificar HTML?

Em páginas renderizadas no servidor e sites estáticos, o documento HTML é a primeira coisa que o navegador baixa, então cada byte economizado encurta o tempo até a primeira renderização. Economias de 10–25% antes da compressão são comuns, e maiores em templates muito indentados e páginas com scripts inline grandes.

Perguntas frequentes

Minificar o HTML vai mudar a aparência da minha página?
Não. Só são removidos os espaços que o navegador já agruparia, e o conteúdo de <pre>/<textarea> não é tocado. Se você estiliza elementos com white-space: pre no CSS, desative Compactar espaços.
Ele minifica JavaScript e CSS inline?
Sim, quando as opções estão ativadas. Se um bloco inline tiver erro de sintaxe, ele é mantido sem alterações e um aviso é exibido, para que a página nunca quebre.
Posso minificar arquivos de template como Handlebars, Jinja ou Blade?
Normalmente sim, desde que as tags de template apareçam em texto ou em valores de atributos. Templates que colocam lógica dentro de nomes de tags ou entre atributos podem exigir uma conferência manual.
Meu HTML é enviado para algum lugar?
Não. Tudo é processado localmente no seu navegador.

Ferramentas relacionadas

Minificador de CSS Reduza folhas de estilo: encurte valores e mescle regras duplicadas. Minificador de JavaScript Comprima e encurte nomes em JS com Terser, com estatísticas de tamanho e gzip. Codificador / Decodificador de Entidades HTML Escape caracteres especiais do HTML ou decodifique &entities;. URL Encode / Decode Codifique/decodifique texto com percent-encoding e analise query strings.