Minificador HTML

Pega HTML para eliminar comentarios y espacios sobrantes y minificar el CSS y el JavaScript en línea. El contenido dentro de <pre> y <textarea> queda exactamente como está.

Funciona en tu navegadorSin registroNo se sube nada

Salida minificada

Cómo usar: Minificador HTML

  1. Pega un documento o fragmento HTML, o abre un archivo .html.
  2. Elige qué eliminar: comentarios, espacios y si también se deben minificar los bloques <style> y <script> en línea.
  3. Revisa la línea de advertencias: un script en línea con un error de sintaxis se conserva sin cambios en lugar de romper tu página.
  4. Copia el HTML minificado o descárgalo.

¿Qué se elimina?

  • Comentarios: se elimina <!-- … -->, salvo los comentarios condicionales de Internet Explorer y los que empiezan por <!--!.
  • Espacios entre elementos de bloque: los saltos de línea y la indentación entre etiquetas como <div>, <li> o <head> nunca se muestran, así que se quitan por completo.
  • Secuencias de espacios en el texto: se reducen a un solo espacio, que es exactamente como el navegador las muestra de todos modos.
  • Espacios dentro de las etiquetas: <p class = "a"> pasa a ser <p class="a">.

¿Qué se conserva?

Los espacios son significativos en algunos lugares, y el minificador los respeta. El contenido de <pre> y <textarea> se conserva byte a byte. Un único espacio entre elementos en línea, como <b>bold</b> text, se mantiene porque quitarlo uniría las palabras. Los valores de los atributos y las comillas nunca se modifican.

CSS y JavaScript en línea

Los bloques <style> en línea se optimizan con CSSO y los bloques <script> en línea con Terser, los mismos motores que se usan en las páginas del minificador CSS y del minificador JavaScript. JSON-LD y otros bloques de script JSON se compactan, y los scripts de tipos desconocidos (por ejemplo, plantillas) no se tocan.

¿Merece la pena minificar el HTML?

En páginas renderizadas en el servidor y sitios estáticos, el documento HTML es lo primero que descarga el navegador, así que cada byte ahorrado acorta el tiempo hasta el primer renderizado. Es habitual ahorrar un 10–25 % antes de la compresión, y más en plantillas muy indentadas y páginas con scripts en línea grandes.

Preguntas frecuentes

¿Minificar el HTML cambiará el aspecto de mi página?
No. Solo se eliminan los espacios que el navegador colapsaría de todos modos, y el contenido de <pre>/<textarea> no se toca. Si aplicas white-space: pre a elementos en tu CSS, desactiva Colapsar espacios.
¿Minifica el JavaScript y el CSS en línea?
Sí, cuando las opciones están activadas. Si un bloque en línea tiene un error de sintaxis, se conserva sin cambios y se muestra una advertencia, para que la página nunca se rompa.
¿Puedo minificar plantillas como Handlebars, Jinja o Blade?
Normalmente sí, siempre que las etiquetas de plantilla aparezcan en el texto o en valores de atributos. Las plantillas que ponen lógica dentro de nombres de etiquetas o entre atributos pueden requerir una revisión manual.
¿Se envía mi HTML a algún sitio?
No. Todo se procesa localmente en tu navegador.

Herramientas relacionadas