Eingabe

Ausgabe

Was ist ein HTML-Formatierer?

Ein HTML-Formatierer nimmt unordentlichen, minifizierten oder schlecht eingerueckten HTML-Code und verwandelt ihn in sauberen, korrekt eingerueckten Code. Ob Sie mit einem Snippet oder einer ganzen Seite arbeiten, der Formatierer fuegt konsistente Einrueckung hinzu, richtet oeffnende und schliessende Tags aus und macht die Dokumentstruktur sofort sichtbar.

Gut formatiertes HTML ist leichter zu lesen, zu debuggen und zu warten. Der Formatierer respektiert die Konventionen des HTML-Standards: korrekte Verschachtelung von Elementen, Behandlung von Void-Elementen wie <br>, <img> und <input>, sowie Erhaltung des Inhalts in <pre>-, <script>- und <style>-Bloecken.

Alles laeuft in Ihrem Browser. Kein Server-Upload, keine Datenspeicherung. Fuegen Sie Ihr HTML ein, erhalten Sie die formatierte Ausgabe und kopieren oder laden Sie sie herunter. Ihr Code bleibt privat.

So verwenden Sie den HTML-Formatierer

Folgen Sie diesen drei Schritten, um Ihr HTML zu verschoenern.

Einfuegen, hochladen oder Beispiel laden

Fuegen Sie Ihr HTML in das linke Eingabe-Panel ein, oder klicken Sie auf Hochladen, um eine .html-, .htm- oder .txt-Datei zu laden. Klicken Sie auf Beispiel, um unordentliches Beispiel-HTML zu sehen.

<div class="wrapper"><h1>Hallo</h1><p>Welt</p><ul><li>Element 1</li><li>Element 2</li></ul></div>

Der Formatierer verarbeitet jedes HTML: vollstaendige Dokumente, Teilfragmente oder einzelne Elemente.

Formatierte Ausgabe ansehen

Das rechte Ausgabe-Panel zeigt das verschoenerte HTML sofort an. Verschachtelte Elemente erhalten 2-Leerzeichen-Einrueckung und die Tag-Hierarchie wird uebersichtlich.

Kopieren, herunterladen oder minifizieren

Klicken Sie auf Kopieren, um in die Zwischenablage zu kopieren. Klicken Sie auf Herunterladen, um als .html zu speichern. Kompaktes HTML benoetigt? Klicken Sie auf Minifizieren.

Anwendungsfaelle

Minifiziertes HTML bereinigen

Produktions-HTML ist oft minifiziert. Wenn Sie es inspizieren oder bearbeiten muessen, stellt dieser Formatierer die korrekte Einrueckung wieder her, damit Sie die Struktur verstehen.

E-Mail-Vorlagen formatieren

E-Mail-HTML ist bekanntermassen unordentlich mit tief verschachtelten Tabellen und Inline-Styles. Die Formatierung macht es handhabbar zum Debuggen von Rendering-Problemen.

CMS-Ausgabe bereinigen

Content-Management-Systeme erzeugen oft aufgeblaehtes, schlecht formatiertes HTML. Lassen Sie es durch den Formatierer laufen, um es vor der Bearbeitung oder Migration zu bereinigen.

Team-Code standardisieren

Wenn mehrere Entwickler HTML beitragen, variieren die Formatierungsstile. Verwenden Sie dieses Tool, um konsistente Einrueckung und Struktur in Ihrem Projekt durchzusetzen.

Haeufig gestellte Fragen

Aendert der Formatierer die Struktur meines HTML?

Nein. Er passt nur Leerzeichen und Einrueckung an. Er fuegt keine HTML-Elemente, -Attribute oder -Inhalte hinzu, entfernt oder ordnet sie um.

Wie werden Void-Elemente behandelt?

Void-Elemente wie <br>, <hr>, <img> und <input> werden als selbstschliessend erkannt und in einer eigenen Zeile platziert.

Werden meine HTML-Daten gespeichert?

Nein. Die gesamte Formatierung erfolgt mit JavaScript in Ihrem Browser. Ihr HTML verlaesst nie Ihren Computer.

Welche Einrueckung wird verwendet?

2 Leerzeichen pro Einrueckungsebene, die gaengigste Konvention fuer HTML.

Wird der Inhalt in script- und style-Tags erhalten?

Ja. Inhalte in <pre>-, <script>-, <style>- und <textarea>-Tags werden exakt erhalten.

Kann ich partielle HTML-Fragmente formatieren?

Selbstverstaendlich. Sie brauchen kein vollstaendiges HTML-Dokument. Der Formatierer funktioniert mit jedem HTML-Fragment.

HTML-Formatierer