01
Proteger el original
Ejemplo y Limpiar muestran primero una vista de sustitución y el número de caracteres. Deshacer restaura una vez la entrada y el resultado.
- El ejemplo enseña espacios en línea y saltos dentro de pre.
Herramientas HTML
Formateador de HTMLLeer la estructura de etiquetas
Formato automático tras 350 ms; la minificación es manual. Cada aviso lleva a la línea original.
Formateador de HTML
Código HTML
Resultado
El HTML queda en esta pestaña. La vista estática bloquea scripts y recursos externos.
Pega HTML o carga el ejemplo.
Un fragmento exportado desde un CMS puede llegar comprimido en una sola línea. El Formateador de HTML muestra la jerarquía sin separar palabras en línea ni reescribir los bloques protegidos.
El árbol de etiquetas y los avisos llevan a la línea original. Sirven para investigar, mientras que la conformidad completa requiere un validador especializado.
Por qué usar este Formateador de HTML
Sangría con ubicación en el original
El Formateador de HTML separa etiquetas estructurales y permite volver a la línea de origen. Conserva comentarios y el contenido de pre, textarea, script y style.
Vista previa solo si la eliges
El Formateador de HTML abre un marco estático aislado para el resultado vigente; bloquea scripts, formularios y solicitudes externas.
Tres comprobaciones antes de exportar
02
Elegir cuándo actualizar
La sangría automática espera 350 ms tras editar. Al apagarla, Ctrl/Cmd+Enter ejecuta; minificar siempre requiere un clic.
- Al cambiar la sangría el resultado anterior caduca y no puede copiarse.
03
Volver a la línea sospechosa
Haz clic en una etiqueta o diagnóstico para localizar línea y columna. Compara los bytes y, si conviene, abre la vista aislada.
- Una lista vacía no equivale a una validación normativa.
Dar forma, reducir e investigar
Sangría conservadora
Inserta saltos solo entre etiquetas estructurales; mantiene palabras en línea y el orden de atributos.
Minificación explícita
Parte del código original, conserva comentarios y código incrustado, y muestra la diferencia de bytes UTF-8.
Árbol enlazado al origen
Presenta la jerarquía que analizó HTML5 y distingue nodos añadidos implícitamente.
Vista estática aislada
Solo muestra un resultado vigente y bloquea elementos activos y recursos externos.
Límites de la comprobación
- No valida toda la norma
- El Formateador de HTML señala errores del analizador con posición y posibles cierres ausentes. Para validar HTML conforme a todas las normas y reglas de accesibilidad, usa un verificador especializado.
- Los espacios pueden verse
- Se conservan huecos en línea y bloques protegidos, pero CSS white-space puede dar significado también a espacios entre etiquetas estructurales.
- No repara plantillas
- Vue, JSX y Liquid no se procesan con sus gramáticas. Los nodos que el navegador añade al árbol no se escriben en el archivo resultante.
- Sin captura ni limpieza adicional
- No obtiene URL, no procesa lotes, no borra comentarios ni minifica CSS y JavaScript incrustados.
Preguntas sobre el Formateador de HTML
¿Formatear HTML cambia cómo se ve la página?
Puede ocurrir si el CSS hace visibles ciertos espacios. Se mantienen huecos en línea y bloques protegidos; compara el resultado en la página real.
¿Puede el formateador corregir etiquetas mal cerradas?
No. Señala algunos problemas y posibles cierres ausentes con su ubicación, pero no modifica la fuente para repararlos.
¿Qué diferencia hay entre formatear y minificar HTML?
Formatear expande la jerarquía para leerla; minificar reduce espacios estructurales. Ambas salidas proceden del original sin sobrescribirlo.
¿Se modifica el contenido de script y style?
No. Su contenido se conserva literalmente; este sitio tampoco minifica el JavaScript o CSS que contiene.
¿Se envía mi código HTML a un servidor?
No. El análisis ocurre en esta pestaña. La vista previa aislada es opcional y no puede cargar recursos externos.
¿Algo no está claro?
Probar el Formateador de HTML
Pega un fragmento real, revisa las posiciones sospechosas y exporta solo el resultado actualizado.