HTML-Formatierer & -Minifier
Unordentliches HTML lesbar formatieren oder für die Produktion minifizieren
Über dieses Tool
Bring HTML in Form, das aus einem Bundler, einem Scraper oder einem WYSIWYG-Editor kam: Elemente werden auf deine gewählte Breite eingerückt, Attribute bleiben auf ihrer Zeile, und die Inhalte von pre/textarea bleiben Byte für Byte intakt. Der Minify-Modus entfernt Kommentare und kollabiert den Whitespace zwischen Tags — auf handgeschriebenen Seiten typischerweise 10–25 % Ersparnis.
Die Minifizierung ist bewusst konservativ: Inline-Skripte und -Styles sind geschützt, Conditional Comments überleben, und einzelne Leerzeichen zwischen Inline-Elementen bleiben erhalten, damit „klicke <a>hier</a> jetzt“ nicht zu „klickehierjetzt“ verschmilzt. Du bekommst ein sicheres Minify, kein maximal aggressives.
Beide Operationen laufen lokal in deinem Browser — unveröffentlichte Seiten und internes Admin-Markup verlassen deinen Rechner nie.
Häufige Fragen
- Macht das Minifizieren mein Inline-JavaScript oder -CSS kaputt?
- Nein — <script>-, <style>-, <pre>- und <textarea>-Blöcke sind vom Whitespace-Kollabieren vollständig ausgenommen. Nur Markup zwischen Tags wird angefasst. Um die Skripte selbst zu komprimieren, schicke sie separat durch den JavaScript-Minifier.
- Warum lässt sich Whitespace zwischen Tags gefahrlos entfernen?
- Meistens eben doch nicht ganz: Whitespace zwischen Block-Elementen hat keinen visuellen Effekt, zwischen Inline-Elementen aber schon — deshalb kollabiert der Minifier Folgen zu einem einzelnen Leerzeichen, statt sie zu löschen. Layouts, die auf Inline-Block-Whitespace-Hacks beruhen, sind die seltene Ausnahme, die einen Blick wert ist.
- Repariert der Formatter ungültiges HTML?
- Er formatiert, was du ihm gibst, ohne gegen die HTML-Spezifikation zu validieren — nicht geschlossene Tags bleiben offen. Browser verzeihen Tag-Suppe, und die Formatierung macht die Struktur gut genug sichtbar, um das Problem zu erkennen.
- Welche Einrückungsbreite sollte ich nehmen?
- 2 Leerzeichen sind die vorherrschende Konvention in Web-Codebasen und der Default der meisten Framework-Style-Guides. Nimm 4, wenn dein Team sich darauf geeinigt hat — die Wahl ist rein kosmetisch.