Softonic

Minificador de HTML

Etapa 1 / 3

Cole um trecho, o corpo de um e-mail ou uma página inteira, com até 1.000.000 caracteres.

Próximo: escolher as opções

Cole um HTML ou abra um arquivo HTML, escolha quanto remover e copie ou baixe uma versão menor que mostra quantos bytes você economizou. O nível Seguro nunca junta duas palavras, então a página continua com a mesma aparência e o mesmo funcionamento, e o CSS e o JavaScript embutidos também são minificados.

Como usar o minificador de HTML

  1. 1

    Adicione seu HTML

    Cole a marcação no editor ou abra um arquivo .html, .htm ou .xhtml salvo em UTF-8, com até 1.000.000 de caracteres.

  2. 2

    Escolha o nível e as opções

    Deixe Seguro para qualquer HTML ou escolha Máximo para uma página completa que você vai testar. Depois, decida se quer remover os comentários e minificar o CSS e o JavaScript embutidos.

  3. 3

    Copie ou baixe o resultado

    Confira o HTML minificado e os tamanhos e, depois, copie ou baixe como arquivo. Se você mudar as opções na página do resultado, a minificação roda de novo.

O que o minificador muda

A ferramenta usa o html-minifier-terser, um minificador de HTML de código aberto muito usado, junto com o clean-css para CSS e o Terser para JavaScript. Os dois níveis mantêm o espaço entre palavras e entre tags inline como <b> e <a>. O Máximo economiza mais em páginas completas.

Mudança Seguro Máximo
Quebras de linha e sequências de espaços Viram um único espaço Viram um único espaço e somem entre blocos como <div> e <li>
Espaço entre palavras e tags inline Mantido Mantido
Tags opcionais como </p>, </li>, <head> e <body> Mantidas Removidas
Aspas em volta dos valores de atributos Mantidas Removidas quando o HTML permite
Atributos booleanos como checked="checked" Mantidos Encurtados para checked
Atributos class, id e style vazios Mantidos Removidos
Barra de fechamento em <br/> Mantida Removida
type="text/javascript" e type="text/css" Removidos Removidos

XHTML: se você abrir um arquivo .xhtml, ou se o HTML começar com uma declaração XML como <?xml version="1.0"?>, os dois níveis mantêm as tags opcionais, as aspas em volta dos valores de atributos, os atributos booleanos como checked="checked" e as barras de fechamento, e o JavaScript não é minificado. Assim, o resultado continua legível como XML.

Opções

  • Remover comentários (ativada por padrão): os comentários comuns são removidos. Comentários que começam com <!--! (como avisos de licença), comentários de inclusão no servidor e comentários condicionais do Internet Explorer são mantidos.
  • Minificar CSS (ativada por padrão): o CSS dos elementos <style> e dos atributos style fica mais curto. Um @import continua como está e nada é baixado.
  • Minificar JavaScript (ativada por padrão): scripts embutidos e atributos de evento como onclick ficam mais curtos. Nomes de variáveis locais são encurtados, nomes globais continuam iguais e comentários de licença /*! ... */ são mantidos. O conteúdo de dados estruturados, como JSON-LD, não é minificado.

O que nunca muda

  • O texto dentro de <pre> e <textarea>, onde espaços e quebras de linha aparecem na página.
  • Referências de caracteres como &nbsp;, &amp; e &eacute;.
  • Blocos PHP (<?php ... ?>) e no estilo ASP (<% ... %>), e tudo o que estiver entre dois comentários <!-- htmlmin:ignore -->.
  • O doctype, as âncoras <a name>, o type="text" dos campos e as maiúsculas, minúsculas e barras de fechamento dentro de SVG.

Avisos que podem aparecer

  • Não foi possível ler um script: um script embutido ou atributo de evento que não é JavaScript válido por si só fica sem minificar, e a ferramenta mostra a linha e a coluna do erro. O restante da página é minificado mesmo assim.
  • Não foi possível ler um bloco de CSS: esse CSS fica sem minificar.
  • Um conjunto de caracteres diferente de UTF-8: o download é sempre salvo em UTF-8, então mude o <meta charset> da página para UTF-8 ou copie o resultado para o seu próprio arquivo.
  • Sem ganho: o HTML já está tão pequeno quanto essas opções permitem.

Se um elemento <script> ou <style> nunca for fechado, nada é minificado e a ferramenta mostra a linha e a coluna onde esse elemento começa. Seja qual for o nível, abra a página minificada e navegue por ela antes de publicar.

Perguntas frequentes

Com Seguro, sim. Os espaços são reduzidos a um, mas nunca removidos, então <b>Olá</b> <i>mundo</i> continua sendo lido como “Olá mundo” e elementos lado a lado mantêm o espaço entre eles. Só pode mudar o texto que o CSS exibe mantendo os espaços, por exemplo com white-space: pre.

Em páginas completas que você testa antes de publicar. Ele economiza mais bytes ao remover os espaços entre blocos e tags opcionais como </p>. Confira duas coisas: elementos lado a lado com display: inline-block podem perder o espaço entre eles, e um fragmento que perdeu o último </p> pode absorver o HTML adicionado depois dele.

Com Remover comentários ativada, os comentários comuns somem. Comentários que começam com <!--!, comentários de inclusão no servidor como <!--#include virtual="/footer.html" --> e comentários condicionais do Internet Explorer como <!--[if IE]> são mantidos. Para manter uma seção exatamente como está, coloque-a entre dois comentários <!-- htmlmin:ignore -->. Os dois marcadores são removidos.

O JavaScript só é minificado quando pode ser lido como código válido. Se um script embutido tiver um erro de sintaxe ou contiver código de template que não é JavaScript por si só, esse script fica sem minificar, o restante da página é minificado e a ferramenta mostra a linha e a coluna do erro.

Não. O HTML que você cola ou abre fica no seu navegador. Ele não é enviado para os nossos servidores nem adicionado ao link da página. Entre as etapas, ele fica guardado nesta aba do navegador até você fechar a aba ou escolher Recomeçar. A página baixa o código do minificador quando você pede um resultado e avisa ao nosso servidor que uma minificação foi feita, sem o HTML.

Até 1.000.000 de caracteres, colados ou abertos de um arquivo salvo em UTF-8. Se um arquivo usar outra codificação, a ferramenta avisa: abra-o em um editor, copie o HTML e cole aqui. Uma minificação que leva mais de 30 segundos é interrompida. Nesse caso, tente com uma parte menor do HTML.

Ferramentas relacionadas

Gerador de cards CSS

Crie um card com seu título, texto e link opcional. Ajuste cores, borda, espaçamento, sombra e efeito ao passar o mouse. Depois copie ou baixe o HTML e o CSS.

Contador de FPS

Meça o FPS do navegador com requestAnimationFrame: suavização, taxa de quadros mínima e máxima, limite de alerta e gráfico opcional. Roda localmente, sem upload nem API.

Gerador de textura de ruído

Gere uma textura de ruído em SVG que se repete sem emendas, com opacidade, frequência do grão, tipo de ruído e cor de fundo ajustáveis, e copie o CSS já pronto.

Gerador de Configuração Webpack

Crie um webpack.config.js para webpack 5 com JavaScript puro, React ou Vue: TypeScript, Babel, CSS ou Sass, imagens, HtmlWebpackPlugin, servidor de desenvolvimento e a linha de npm install.

Conversor de Tamanho de Arquivo

Converta entre bytes, KB, MB, GB, TB e as unidades binárias IEC (KiB, MiB, GiB, TiB), combinando decimal e binário como preferir.

Desofuscador de JavaScript

Desofusque JavaScript minificado ou empacotado com renomeação de variáveis, decodificação de arrays de strings, reversão de achatamento de fluxo de controle e embelezamento.

Ferramenta disponível em outros idiomas