Formatador de HTML
Transforme uma linha enorme de HTML em marcação bem indentada, fácil de ler e editar.
Formatar HTML online
O HTML que sai de um editor de e-mail, de uma exportação de CMS, de um construtor de páginas ou de um site de produção minificado costuma ser uma única linha gigantesca. Encontrar uma div ali é um sofrimento. Esta página é o Formatador de código configurado para HTML: cole a marcação e cada elemento vai para a sua própria linha, indentado conforme o nível de aninhamento.
A formatação é feita pelo js-beautify, um formatador de código aberto muito usado, que roda dentro da aba do seu navegador. Nada é enviado.
O que o formatador faz
- Elementos de bloco como div, section, ul e li começam cada um em uma nova linha, indentados abaixo do elemento pai.
- Elementos inline como a, b, span e em ficam dentro da linha de texto a que pertencem.
- Atributos são mantidos exatamente como foram escritos, na mesma ordem.
- Linhas em branco que você colocou de propósito são mantidas, até duas seguidas.
Quando formatar e quando minificar
Formate quando uma pessoa precisa ler ou editar o arquivo. Minifique quando um navegador precisa baixá-lo: remover comentários e indentação costuma economizar de 10 a 20% de uma página HTML antes do gzip. Para a maioria dos sites, o ganho maior vem da compressão no servidor, mas minificar ainda ajuda em templates embutidos em e-mails ou em outras páginas.
Ferramentas relacionadas
Para a folha de estilos que acompanha a página, use o minificador de CSS; para os scripts, o formatador de JavaScript. Para comparar a marcação antes e depois de uma edição, use o Comparador de textos.