Saltar al contenido principal
LibraTool logoLibraTool

Embellecedor y minificador de HTML gratis

Da formato o minifica HTML con la sangría de anidación adecuada. Conserva el contenido dentro de los bloques <pre>, <script> y <style>.

Funciona sin conexión una vez cargado

Suelta un archivo aquí o haz clic para buscarlo

HTML, HTM · procesado en tu dispositivo

o pulsa Ctrl+V para pegar desde el portapapeles

Explorar archivos
HTML formateado
La salida aparecerá aquí…

Usos habituales

  • Depura HTML Renderizado en ServidorVe salida HTML raw de tu servidor (PHP, Rails, Django, Node) en formato indentado legible.
  • Formatea Plantillas de Email HTMLEl HTML de email es verboso (tablas, estilos en línea). Formatea para hacerlo editable y mantenible.
  • Formatea Páginas HTML EstáticasLos archivos HTML estáticos editados manualmente se benefician de formato consistente para edición colaborativa.
  • Limpia HTML Exportado de CMSWordPress, Wix, Squarespace exportan HTML con muchos artefactos. Formatea para hacerlo editable.
  • Minifica HTML para ProducciónReduce el tamaño del archivo HTML para cargas de página más rápidas al eliminar espacios en blanco y caracteres innecesarios.

Cómo funciona

Esta herramienta formatea o comprime HTML usando un tokenizador consciente de etiquetas escrito a mano e integrado directamente en la página: sin biblioteca de formato de terceros, sin ida y vuelta al servidor. Cada carácter de tu marcado se procesa localmente en el navegador en el momento en que lo escribes o pegas.

  1. 1
    El tokenizador escanea el marcado
    Un escáner personalizado carácter por carácter recorre la cadena HTML, identificando comentarios, declaraciones DOCTYPE, etiquetas de apertura, etiquetas de cierre, elementos vacíos autocierre (br, img, input, etc.), y nodos de texto en bruto. Un ayudante dedicado sigue los valores de atributo entre comillas para que caracteres como > dentro de un atributo (por ejemplo, value="a>b") nunca hagan que una etiqueta se divida antes de tiempo.
  2. 2
    La profundidad de sangría se sigue por etiqueta
    Para el modo embellecer, el tokenizador mantiene un contador de profundidad. Las etiquetas de apertura de nivel de bloque aumentan la profundidad; las etiquetas de cierre la disminuyen antes de escribirse. Los elementos en línea (span, a, strong, em, etc.) se mantienen en la misma línea que su contenido en lugar de pasar a su propia línea sangrada. Las etiquetas como pre, script, style y textarea tienen su contenido interno emitido literalmente para evitar corromper código sensible al espacio en blanco o ejecutable.
  3. 3
    El minificador colapsa el espacio en blanco de forma segura
    En modo minificar, el contenido de los bloques pre, script, style y textarea se sustituye por marcadores numerados antes de que ocurra cualquier colapso de espacio en blanco. Se eliminan los comentarios HTML, y se quitan las series de espacio en blanco entre etiquetas, excepto entre elementos en línea adyacentes, donde se conserva un único espacio para que las palabras no se fusionen. Luego se restauran los marcadores de posición a su contenido original.
  4. 4
    La salida se muestra y opcionalmente se guarda
    El resultado formateado o minificado aparece en vivo en el panel de salida junto con un porcentaje de cambio de tamaño. Puedes copiarlo al portapapeles o descargarlo como archivo .html, todo sin salir del navegador.

Herramientas relacionadas

🎨

Embellecedor de CSS

Da formato legible al CSS minificado con una sangría uniforme, o minifícalo. Ordenación alfabética opcional de las propiedades para obtener diferencias predecibles.

Probar
🗜️

Minificador y embellecedor de CSS

Minifica CSS para reducir el tamaño del archivo o embellece CSS minificado para facilitar la lectura. Instantáneo, en tu navegador.

Probar
📰

Formateador y validador de XML

Da formato y valida XML con el analizador DOM nativo de tu navegador. Incluye salida minificada para uso en producción.

Probar

Preguntas frecuentes