Aplica una sangría uniforme al HTML para leer mejor los elementos anidados, o compacta el marcado para reducir el texto. Elige el estilo de espaciado antes de copiar el resultado al archivo de origen.
Se ejecuta localmente en tu navegadorUn cuadro y dos botones. Formatear HTML reescribe el marcado con una etiqueta por línea y los elementos anidados sangrados, con el ancho elegido junto a los botones: tabulador, 2, 4 (por defecto) u 8 espacios. Comprimir HTML devuelve ese mismo marcado con los espacios comprimidos.
Los dos botones trabajan solo con el texto del cuadro: al pulsarlos no salió ninguna petición. Un documento de 716 KB tarda unos 2,4 segundos en formatearse y 2,1 en comprimirse, y el marcado que ya está escrito sin espacios redundantes vuelve del mismo tamaño, porque el minificador solo elimina espacios.
Formatear sirve para leer. Coloca cada etiqueta en su línea, sangra según la profundidad de anidamiento y normaliza los espacios del texto. Como la sangría añade espacios donde no había, una página formateada puede renderizarse de forma distinta al original: <div><span>a</span><span>b</span></div> se ve como "ab", y su versión formateada como "a b".
Comprimir sirve para publicar. Una serie de espacios se convierte en un espacio —tal como la lee el navegador—, así que el salto de línea entre dos elementos en línea sobrevive como un espacio en vez de desaparecer. Comprobado en los seis idiomas, la salida comprimida se renderiza igual que la entrada en series en línea, listas, tablas y bloques anidados.
El contenido de pre y textarea se copia byte a byte, porque sus espacios forman parte del documento y no del diseño. Lo mismo ocurre con el contenido de script y style, escrito en otros lenguajes: eliminar un salto de línea allí convertiría el resto de un comentario // en código o cambiaría lo que contiene una plantilla literal.
Los valores entre comillas se conservan exactos, incluidas las series de espacios, estén en value, title o en un atributo data-*. El texto de los comentarios, las entidades como y ©, las etiquetas autocerradas y el doctype también pasan sin cambios. Lo único que desaparece es el espacio entre las cosas.
Pulsar cualquiera de los botones dos veces no cambia nada la segunda: un documento formateado se formatea a sí mismo y uno comprimido se comprime a sí mismo. El panel de resultado es una vista previa con resaltado, así que el botón Copiar, y no una selección manual, es la vía fiable para sacar el texto.
En la salida formateada, una etiqueta cuyos atributos pasarían de 80 caracteres se parte en la línea siguiente, y el corte cae entre atributos, nunca dentro de un valor entrecomillado. El texto no se parte, y la salida comprimida no contiene ningún salto de línea fuera de los bloques protegidos.
Formatear y comprimir se ejecutan en la página: al pulsar los botones no salió ninguna petición del navegador, de modo que el marcado pegado no se sube y la herramienta sigue funcionando sin conexión.
El trabajo crece con la entrada. 176 KB se formatearon en unos 0,6 segundos y se comprimieron en 0,5; una página de 716 KB tardó 2,4 y 2,1 segundos. El minificador es una pasada de espacios y no un analizador HTML completo —no reescribe las comillas de los atributos ni elimina etiquetas de cierre opcionales—, y el mismo motor alimenta el formateador de JavaScript, por lo que un bloque script dentro del marcado se embellece como JavaScript.