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.

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 a partir de um formulário curto: defina o entry, a pasta de saída e o modo, e ative TypeScript, Babel, um loader CSS, HtmlWebpackPlugin e um servidor de desenvolvimento.

Gerador de Docker Compose

Gere um docker-compose.yml a partir de definições de serviços com imagem, portas e volumes, com padrões de boas práticas.

Conversor de base numérica

Converta números entre binário, octal, decimal, hexadecimal e qualquer base personalizada de 2 a 36, com o detalhamento posicional.

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.

Ferramenta disponível em outros idiomas