Cómo minificar o embellecer HTML
- Pega tu HTML en la caja de arriba, un documento completo, un fragmento de plantilla, o un solo bloque de marcado.
- Elige Minificar (el valor por defecto, para publicar una página más pequeña) o Embellecer (para dar formato legible a HTML ya minificado), y un tamaño de sangría si estás embelleciendo, luego haz clic en Minificar HTML.
- El resultado aparece instantáneamente debajo: tu HTML minificado o embellecido, seguido de un comentario de una línea reportando el tamaño en bytes antes/después y una estimación real de gzip.
- Haz clic en Copiar al portapapeles para obtener el resultado, o pega algo nuevo y vuelve a ejecutarlo.
Sin archivo que subir, sin herramienta de build que configurar, solo pega y lee.
Por qué minificar HTML
Cada byte de marcado que un navegador descarga antes de poder empezar a renderizar añade al tiempo que un visitante pasa mirando una pantalla en blanco, y el HTML escrito a mano, exportado, o generado por plantillas está lleno de bytes que no hacen nada por el renderizado: sangría, líneas en blanco, comentarios de desarrollador, y largas secuencias de espacio en blanco entre etiquetas. Nada de eso afecta a cómo se ve la página; todo cuesta tiempo de descarga, especialmente en conexiones móviles donde cada kilobyte importa tanto para la velocidad de carga como para el plan de datos del visitante.
Esta herramienta elimina esa sobrecarga en un clic, colapsando secuencias de espacio en blanco, quitando los comentarios normales, y reportando exactamente cuántos bytes ahorraste (y cuánto más pequeña se vuelve la página tras gzip), mientras tiene cuidado de dejar la salida renderizada de la página sin cambios.
Correcto por defecto, no agresivo
La minificación de HTML está llena de trampas, porque el espacio en blanco es significativo en más sitios de los que parece. Un espacio entre dos elementos en línea es texto real que se renderiza. El contenido de <pre> y <textarea> está preformateado y debe sobrevivir exactamente. El contenido de <script> y <style> no es HTML en absoluto, colapsar el espacio en blanco ahí podría romper una cadena de JavaScript, un literal de expresión regular, o una regla CSS. Los comentarios condicionales (<!--[if IE]>) son marcado sobre el que algunos navegadores actúan.
En lugar de perseguir los últimos bytes y arriesgarse a cambiar cómo se renderiza una página, esta herramienta toma el camino conservador: colapsa las secuencias de espacio en blanco del texto a un único espacio (sin eliminar nunca los espacios entre etiquetas de golpe), quita solo los comentarios normales (conservando los condicionales), y trata cada elemento <pre>, <textarea>, <script> y <style> como un bloque intocable. El resultado es una página más pequeña que se renderiza idénticamente, con la contrapartida de una salida ligeramente mayor que la de un minificador agresivo dispuesto a apostar con tu marcado.
Minifica para producción, embellece para leer
Un pipeline de build suele minificar el HTML automáticamente antes del despliegue, pero mucho marcado del mundo real nunca pasa por uno: una plantilla de email, un bloque de CMS, una página estática exportada, o un fragmento copiado de un tutorial. El modo Minificar cubre ese hueco sin instalar nada.
El problema inverso también surge, estás mirando una página minificada con todo en una sola línea y necesitas realmente leerla o depurarla. El modo Embellecer vuelve a sangrar esa misma línea ilegible en HTML correctamente formateado, con una etiqueta por línea, con el ancho de sangría que elijas, así que puedes ver la estructura antes de cambiar nada.
Privado, porque tu marcado nunca sale de tu dispositivo
El HTML de una página puede revelar más de lo que parece, comentarios internos, un diseño sin publicar, clases de feature flags, o texto en borrador que todavía no se ha lanzado. Muchas webs de “minificador de HTML online gratis” silenciosamente redirigen el contenido pegado a través de un backend. Esta herramienta ejecuta todo el paso de minificar/embellecer en tu propia pestaña del navegador, nada se transmite, registra ni almacena, y funciona idénticamente sin conexión una vez que la página ha cargado.
Usos habituales
- Reducir una página HTML escrita a mano o exportada, o una plantilla de email, antes de publicarla, sin configurar un pipeline de build solo para un archivo.
- Comprobar cuánto más pequeña (y cuánto más pequeña tras gzip) se vuelve una página antes de comprometerte con un paso de minificación en un build real.
- Reformatear una página de producción minificada de vuelta en código legible para depurar un problema de maquetación sin el código original disponible.
- Limpiar marcado pegado de un tutorial, una respuesta de Stack Overflow, o un asistente de IA antes de añadirlo a un proyecto.
- Combinarlo con el Minificador y Formateador de CSS para minificar la hoja de estilos que se publica junto a tu HTML, el Formateador de JavaScript para formatear los scripts, o el Optimizador de SVG para marcado SVG en línea.
- Escapar un fragmento para que se muestre literalmente en lugar de ser analizado, consulta las herramientas compañeras Codificador HTML y Decodificador HTML.
- Comparar dos versiones de una página para ver exactamente qué cambió, consulta el Comparador de Textos para comparar HTML antes y después de una edición.
