Saltar al contenido
Español
Todas las herramientas

Categorías

Herramientas para desarrolladoresCodificación y decodificaciónJSON y datosHash y checksumHerramientas de textoFecha y horaHerramientas de redHerramientas de archivosMarkdown y diagramas

Minificador HTML

Reduzca su HTML con un minificador prudente que deja intacto el contenido de <pre>, <textarea> y <script>.

Procesado localmente en tu navegador

Opciones
0 caracteres · 0 líneas
El resultado aparecerá aquí.

¿Qué es Minificador HTML?

Minificar HTML es quitar los bytes que los navegadores no necesitan: comentarios, sangría y saltos de línea entre etiquetas. Los documentos más pequeños se descargan y analizan antes, algo importante en páginas de aterrizaje y plantillas de correo.

Este minificador es seguro a propósito. Elimina comentarios (conservando si se desea los comentarios condicionales de IE), reduce cualquier serie de espacios a uno solo y lo suprime junto a etiquetas de bloque, pero deja tal cual el contenido de <pre>, <textarea>, <script> y <style>. Una opción quita además espacios y comentarios del CSS en línea. El resultado indica el tamaño antes y después.

¿Cómo funciona?

  1. Pegue su HTML en el cuadro de entrada.
  2. Elija si quitar comentarios, conservar los comentarios condicionales de IE y reducir espacios.
  3. Si quiere, active la minificación del CSS en línea para bloques <style> y atributos style.
  4. Compruebe el tamaño ahorrado y copie o descargue el HTML minificado.

Casos de uso habituales

  • Aligerar una página de aterrizaje estática o un correo HTML.
  • Incrustar un pequeño fragmento HTML en una cadena de JavaScript o en una URL de datos.
  • Quitar los comentarios de desarrollo antes de publicar una plantilla.
  • Estimar cuántos espacios lleva una página antes de configurar un paso de compilación.

Ejemplos

Prueba esta entrada en la herramienta de arriba:

Entrada
<!DOCTYPE html>
<html>
  <head>
    <!-- page title -->
    <title>Demo</title>
    <style>
      body { margin: 0; /* reset */ }
      p    { color: #333; }
    </style>
  </head>
  <body>
    <!--[if IE]><p>Old browser</p><![endif]-->
    <h1>  Hello   <em>world</em>  </h1>
    <pre>  keep
    this   spacing </pre>
  </body>
</html>
Salida
<!DOCTYPE html><html><head><title>Demo</title><style>
      body { margin: 0; /* reset */ }
      p    { color: #333; }
    </style></head><body><!--[if IE]><p>Old browser</p><![endif]--><h1>Hello <em>world</em></h1><pre>  keep
    this   spacing </pre></body></html>

Privacidad

Minificador HTML se ejecuta por completo en tu navegador. El texto o los archivos que proporcionas se procesan en tu dispositivo y no se suben, registran ni almacenan en nuestros servidores.

Limitaciones

No reescribe atributos ni comillas, no elimina etiquetas opcionales ni minifica JavaScript, así que el ahorro es menor que con minificadores agresivos, y se conserva a propósito un único espacio entre elementos en línea.

Preguntas frecuentes

¿Puede minificar romper mi página?

Las reglas son prudentes: el texto preformateado, las áreas de texto, los scripts y los estilos se dejan como están. Los espacios entre elementos en línea se reducen a uno, no se eliminan, para que las palabras no se peguen.

¿Qué pasa con los comentarios condicionales?

Con "conservar comentarios condicionales de IE" activado, comentarios como <!--[if IE]>…<![endif]--> se preservan, porque los navegadores actúan sobre ellos. Desactive la opción para eliminarlos también.

¿Minifica JavaScript?

No. El contenido de los scripts se copia sin cambios. Use un minificador de JavaScript específico en su compilación si lo necesita.

Herramientas relacionadas

Más herramientas en Herramientas para desarrolladores →