Cómo formatear HTML con sangría o compactarlo

Introduce el HTML como texto, conserva beautify para obtener una presentación con sangría o selecciona minify para aplicar sus reducciones documentadas de comentarios y espacios. La sangría predeterminada es de 2 espacios.

Para qué sirve esta herramienta

Este formateador transforma texto HTML en una representación con sangría para que resulte más sencillo leer la relación entre etiquetas anidadas. También ofrece un modo compacto que aplica reducciones concretas de comentarios y espacios. Puedes utilizarlo al revisar una plantilla, inspeccionar un fragmento o preparar una versión más concentrada del marcado, pero conviene distinguir entre mejorar la presentación y comprobar si el HTML es correcto. La entrada prevista es una cadena de texto y la sangría inicial es de 2 espacios.

Pasos para elegir el formato

1. Prepara el contenido como texto HTML. Pega el fragmento que quieras revisar en el campo de entrada y comprueba que el valor sea una cadena, porque otros tipos de entrada se rechazan en lugar de formatearse. Si dejas el campo vacío o solo contiene espacios en blanco, la operación termina correctamente y devuelve texto formateado vacío.

2. Escoge la presentación que necesitas. Mantén beautify para obtener una disposición legible con sangría. Cuando el modo se deja vacío y la entrada contiene caracteres que no son espacios en blanco, se aplica beautify; además, un valor que, después de convertirse a minúsculas, no sea minify sigue la ruta de embellecimiento.

3. Ajusta la sangría si la estructura necesita otro nivel. Los valores se convierten a enteros cuando es posible. Para una entrada con contenido, un valor que no pueda convertirse o que quede fuera del intervalo inclusivo de 0 a 8 se sustituye por 2, así que conviene introducir un número dentro de ese rango.

4. Selecciona minify cuando prefieras una salida compacta. Este modo elimina los comentarios, excepto aquellos cuyo contenido empieza exactamente por [if, y también reduce los espacios situados entre etiquetas, agrupa los espacios repetidos y quita los espacios que rodean el texto.

5. Inicia la operación y examina el texto obtenido antes de incorporarlo a otro archivo. Si el HTML con contenido supera 1.000.000 de bytes UTF-8, la entrada se rechaza. El límite se refiere a entradas que contienen caracteres no blancos, por lo que no debe confundirse con el comportamiento de una entrada vacía.

Qué significa la salida

La salida de beautify debe leerse como una reorganización visual del HTML, con niveles de sangría destinados a hacer más visible la estructura. Si eliges un nivel admitido, se utiliza su conversión a entero; una cifra no convertible o situada fuera de 0 a 8 vuelve al valor de 2 espacios.

La salida de minify representa una reducción específica, no una compresión completa del archivo. La transformación documentada actúa sobre comentarios y espacios: los comentarios cuyo contenido empieza exactamente por [if quedan fuera de la eliminación indicada, mientras que otras separaciones pueden reducirse según las reglas del modo.

Una cadena vacía o compuesta únicamente por espacios produce texto formateado vacío sin seguir el tratamiento habitual de una entrada con contenido. En el embellecimiento de HTML con caracteres no blancos, el análisis puede fallar si no está disponible la dependencia necesaria, y una excepción durante el análisis o el formateo se devuelve como un error de análisis HTML. Por eso, utiliza el resultado para mejorar la lectura o compactar el texto, no como validación, sanitización ni garantía de cumplimiento de estándares.

Ejemplo práctico

Una persona quiere leer la jerarquía de una sección HTML y contrastarla después con una presentación compacta del mismo marcado.

Una persona pega el texto <section><p>Texto</p></section>, mantiene beautify y establece una sangría de 4; después selecciona minify para comparar la forma compacta que devuelve la herramienta.

Con beautify, el resultado adopta una representación HTML con sangría; con minify, aparece una cadena más compacta conforme a las transformaciones documentadas para comentarios y espacios.

Limitaciones

• Los valores que no sean texto y las entradas con contenido que superen 1.000.000 de bytes UTF-8 se rechazan; además, el embellecimiento puede terminar con un error si falla el análisis HTML o no está disponible la dependencia necesaria.

Errores frecuentes

• Si la sangría no coincide con la esperada, revisa que el valor pueda convertirse a entero y esté entre 0 y 8; un dato no convertible o fuera de ese intervalo se normaliza a 2.

Preguntas frecuentes

¿Qué ocurre si dejo vacío el modo de formato?

Con una entrada que contiene caracteres no blancos, dejar el modo vacío hace que se use beautify; también se embellece el contenido si el valor escrito no es minify después de pasarlo a minúsculas.

¿Qué sangría se aplica si introduzco un valor no válido?

Para una entrada con contenido, el valor se convierte a entero cuando es posible; si la conversión falla o el número queda fuera de 0 a 8, la sangría utilizada pasa a ser de 2 espacios.

¿Hay un límite para el tamaño del HTML?

Una entrada con caracteres no blancos que supere 1.000.000 de bytes UTF-8 se rechaza, mientras que una cadena vacía o formada solo por espacios se procesa correctamente y devuelve texto formateado vacío.