Ratgeber

HTML formatieren und einrücken

Übergeben Sie HTML als Text, wählen Sie „beautify“ für eine eingerückte oder „minify“ für eine kompaktere Darstellung und starten Sie die Verarbeitung. Die Einrückung verwendet standardmäßig zwei Leerzeichen; bei nicht leerem Inhalt werden ungültige Angaben auf diesen Wert zurückgesetzt.

Tool HTML-Formatierer

Wofür die HTML-Formatierung geeignet ist

Der HTML Formatter bringt HTML-Text in eine eingerückte Darstellung, damit verschachtelte Elemente leichter lesbar werden. Das unterstützt Sie etwa beim Durchsehen eines längeren Ausschnitts oder bei einer manuellen Änderung, wenn die ursprüngliche Struktur schwer zu erkennen ist. Für eine kompaktere Ausgabe steht zusätzlich der Modus „minify“ zur Verfügung.

Die Eingabe erfolgt als Text. Eine leere oder nur aus Leerzeichen bestehende Zeichenkette ist ein eigener Fall: Sie wird erfolgreich verarbeitet und führt zu einer leeren formatierten Ausgabe. Bei nicht leerem Inhalt können Sie zwischen einer lesbaren und einer kompakten Darstellung wählen. Die Formatierung beurteilt dabei nicht, ob das HTML für Ihren fachlichen Zweck geeignet ist.

So gehen Sie beim Formatieren vor

  1. Fügen Sie den HTML-Code als Zeichenkette in das Eingabefeld ein. Achten Sie darauf, tatsächlich Text zu übergeben, denn andere Eingabetypen werden nicht formatiert. Wenn Sie zunächst nur prüfen möchten, wie das Werkzeug mit einem leeren Feld umgeht, können Sie eine leere oder aus Leerzeichen bestehende Eingabe verwenden.

  2. Wählen Sie für eine besser erkennbare Struktur den Modus „beautify“. Dieser Modus ist die Standardeinstellung und wird bei nicht leerem Inhalt auch dann verwendet, wenn kein Modus angegeben ist oder ein anderer als „minify“ gewählt wird. Die Schreibweise des Modus wird dabei in Kleinbuchstaben berücksichtigt.

  3. Entscheiden Sie, wie viele Leerzeichen eine Einrückungsstufe verwenden soll. Als Ausgangswert sind zwei Leerzeichen vorgesehen. Bei nicht leerem Inhalt werden mögliche Angaben, soweit möglich, in ganze Zahlen umgewandelt. Werte von 0 bis 8 werden verwendet; eine nicht umwandelbare oder außerhalb dieses Bereichs liegende Angabe wird stattdessen auf zwei Leerzeichen zurückgesetzt.

  4. Starten Sie die Verarbeitung und lesen Sie den ausgegebenen HTML-Text. Eine erfolgreiche Beautify-Ausgabe stellt die vorhandene Struktur eingerückt dar, wobei die gewählte Einrückung die sichtbare Ausrichtung beeinflusst. Im Modus „minify“ werden Kommentare entfernt, wenn ihr Inhalt nicht genau mit „[if“ beginnt.

  5. Berücksichtigen Sie beim Minify-Ergebnis außerdem die Leerraumregeln. Leerraum zwischen Tags wird zusammengezogen, wiederholter Leerraum wird reduziert und Leerraum am Anfang sowie am Ende wird entfernt. Diese Veränderungen ergeben eine kompaktere Darstellung nach den festgelegten Regeln, ersetzen jedoch keine Prüfung der für Ihr Projekt benötigten Inhalte.

  6. Reagieren Sie bei einer Ablehnung zunächst auf den Eingabetyp oder die Größe. Nicht als Zeichenkette übergebener HTML-Inhalt wird abgelehnt. Ebenso wird nicht leerer Inhalt zurückgewiesen, wenn er größer als 1.000.000 UTF-8-Byte ist. Ein Problem beim Einlesen oder Formatieren im Beautify-Pfad erscheint als HTML-Parsefehler.

Was das Ergebnis aussagt

Eine eingerückte Ausgabe zeigt die Struktur des eingegebenen HTML-Texts übersichtlicher an. Die Anzahl der Leerzeichen pro Stufe entspricht der gültigen Einrückungsangabe oder dem Ersatzwert zwei, falls die Angabe bei nicht leerem Inhalt nicht verwendet werden kann.

Bei „minify“ sollten Sie die Ausgabe als Ergebnis begrenzter Textänderungen an Kommentaren und Leerraum lesen. Kommentare mit einem Inhalt, der genau mit „[if“ beginnt, bleiben von der beschriebenen Entfernung ausgenommen; andere Kommentare können entfallen. Der Modus ist deshalb keine vollständige Komprimierung.

Eine leere Ausgabe nach leerer Eingabe ist kein Hinweis auf einen Verarbeitungsfehler, sondern das dokumentierte Ergebnis dieses Sonderfalls. Ein Parsefehler weist dagegen auf ein Problem während des Einlesens oder Formatierens im Beautify-Pfad hin. Die erfolgreiche Verarbeitung einer Zeichenkette bestätigt weder die Gültigkeit des HTMLs noch seine semantische Eignung für einen bestimmten Einsatz.

Praktisches Beispiel

Sie möchten eine kurze, schwer lesbare HTML-Struktur vor einer manuellen Bearbeitung übersichtlicher darstellen.

Geben Sie

Hallo

als HTML-Text ein, wählen Sie „beautify“ und setzen Sie die Einrückung auf 4. Prüfen Sie danach die sichtbare Ausrichtung der verschachtelten Elemente.

Die erfolgreiche Ausgabe ist eine formatierte HTML-Zeichenkette, in der verschachtelte Elemente sichtbar eingerückt erscheinen; konkrete Zeilenumbrüche hängen von der Verarbeitung ab.

Einschränkungen

  • Die Ausgabe formatiert HTML-Text, validiert ihn aber nicht und garantiert weder semantische Korrektheit noch eine vollständige Komprimierung.

Häufige Fehler

  • Ursache: Der übergebene Wert ist kein Text oder der nicht leere Inhalt überschreitet 1.000.000 UTF-8-Byte. Korrektur: Übergeben Sie den HTML-Code als Zeichenkette und teilen oder verkleinern Sie den Inhalt vor der Verarbeitung.

Häufige Fragen

Was passiert bei leerer Eingabe oder einem unbekannten Modus?

Bei leerem oder ausschließlich aus Leerzeichen bestehendem Text entsteht erfolgreich eine leere Ausgabe. Enthält die Eingabe dagegen Text, wird ein leerer oder nicht unterstützter Modus wie „beautify“ behandelt.

Welche Einrückung kann ich festlegen?

Für nicht leeren Inhalt können Angaben von 0 bis 8 als ganze Zahlen verwendet werden. Scheitert die Umwandlung oder liegt der Wert außerhalb dieses Bereichs, kommen zwei Leerzeichen zum Einsatz.

Was verändert der Minify-Modus?

„Minify“ entfernt Kommentare, deren Inhalt nicht genau mit „[if“ beginnt, und verändert zusätzlich festgelegte Leerraumfolgen. Daraus folgt eine kompaktere Darstellung, aber keine vollständige Komprimierung.

Tool

HTML-Formatierer