HTML formatieren & minifizieren – HTML online kostenlos formatieren

Füge beliebiges HTML ein – auch einzeilig minifizierte Ausgaben aus einer Build-Pipeline – und das Tool formatiert es mit sauberer Einrückung, einem Tag pro Zeile und einheitlichen Leerzeichen neu. Wähle eine Einrückung von 2, 4 oder 8 Leerzeichen. Die Ausgabe lässt sich direkt in deinen Editor übernehmen oder in einen Code-Review-Kommentar einfügen.

Prettify entzerrt HTML für bessere Lesbarkeit: jedes Tag in einer eigenen Zeile, verschachtelte Elemente eingerückt, Leerzeilen zwischen Abschnitten bleiben erhalten. Minify entfernt Kommentare, reduziert zusammenhängenden Leerraum und entfernt Zeilenumbrüche, sodass die Datei mit weniger Bytes auskommt. Nutze Prettify zum Bearbeiten und Prüfen, Minify für den Produktiveinsatz.

Nein – js-beautify (die Engine im Hintergrund) erkennt Script- und Style-Blöcke und formatiert deren Inhalte nach den passenden JS- bzw. CSS-Regeln, sodass Inline-Skripte gültig und Stylesheets lesbar bleiben. Selbstschließende Tags, leere Elemente und Attribute mit Namespace (svg:xmlns, xlink:href) werden alle korrekt behandelt.

Mit reinem HTML und HTML-ähnlichen Templates kommt es gut zurecht, doch reines JSX (Ausdrücke in geschweiften Klammern, Fragmente, großgeschriebene Komponenten-Tags) wird als HTML interpretiert und kann kleinere kosmetische Probleme aufweisen. Für Framework-spezifischen Code empfehlen wir Prettier mit einer auf Ihren Dialekt abgestimmten Konfiguration; für reines HTML, .htm und Template-Dateien ist unser Tool perfekt.

Es findet kein Upload statt. Der Formatierer läuft vollständig in deinem Browser mit js-beautify, sodass du interne Seitenvorlagen, E-Mail-Entwürfe oder HTML mit privaten Daten bedenkenlos einfügen kannst, ohne dass etwas dein Gerät verlässt.

Das Minifizieren entfernt HTML-Kommentare, reduziert jede Folge von Leerzeichen zwischen Tags auf ein einzelnes Leerzeichen und entfernt Zeilenumbrüche. Das Ergebnis ist HTML, das identisch dargestellt wird und in der Regel 10–30 % kleiner ist. In Kombination mit gzip auf dem Server verringert das auf inhaltsreichen Seiten das anfängliche Seitengewicht spürbar.

Ja – klicke auf „Herunterladen“, um die formatierte Ausgabe als output.html oder die minifizierte Ausgabe als output.min.html zu speichern. Die Datei ist UTF-8-codiert und funktioniert daher gleichermaßen mit englischen, kyrillischen, CJK- und rechtsläufigen Inhalten.

Es ist ein kleines, rein browserbasiertes Tool – ohne Hosting-Kosten – daher bieten wir es kostenlos als Teil unseres Entwickler-Toolkits an. Keine Werbung, kein Tracking der Ausgabe, keine Dateigrößenlimits außer dem, was Ihr Browser im Speicher halten kann.

Im Verschönern-Modus kannst du 2, 4 oder 8 Leerzeichen Einrückung wählen. Wähle die Breite, die dein Editor oder Code-Stil verwendet, kopiere dann das Ergebnis oder lade es als output.html herunter, damit die Formatierung direkt in dein Projekt übernommen wird.

The indent selector (2, 4 or 8 spaces) only applies in Prettify mode, since Minify strips all whitespace and line breaks by design — there is nothing left to indent. Switch back to Prettify to see the indent width take effect again.

Während Sie einfügen oder bearbeiten, führt das Tool automatisch eine Strukturprüfung durch und listet alle nicht geschlossenen, nicht übereinstimmenden oder überzähligen schließenden Tags direkt unter dem Ausgabe-Panel auf — ganz ohne separate Schaltfläche. Eine grüne Meldung „Keine strukturellen Probleme gefunden“ bestätigt, dass das Markup wohlgeformt ist.

Use Prettify mode with 2-space indent — it's the most common convention and keeps diffs compact — then check the structural-issues panel to confirm they haven't left an unclosed tag. Once reviewed, switch to Minify mode before shipping to production to strip the extra whitespace back out.

Yes — drag an .html, .htm or .xhtml file onto the upload area, or click it to browse, and its contents load straight into the input box exactly as if you'd pasted them. From there, Prettify, Minify, indent width and the structural checker all work identically whether the markup came from a file or a paste.

Yes — once there's output, a Copy button appears next to the output panel and the primary action area. Clicking it copies the current Prettify or Minify result to your clipboard instantly (it briefly shows 'Copied!' for confirmation), so you can paste directly into your editor or a code review comment without saving an intermediate .html file.