Zum Inhalt springen

HTML-Minifier

Whitespace, Kommentare und Anführungszeichen aus HTML entfernen - mit Vorher/Nachher-Bericht im Browser.

Vorher 220B → Nachher 162B (26% gespart)
<!DOCTYPE html><html><head><title>Hello</title></head><body><h1 class="greeting">Hello world</h1> <pre>
  this whitespace
  is preserved
    </pre> </body></html>

HTML einfügen, minifizierte Version erhalten - mit Byte-Anzahl und Prozent-Ersparnis. Kommentare und Whitespace standardmässig entfernt.

So funktioniert's

  1. HTML einfügen

    Beliebiges HTML5-Fragment oder vollständiges Dokument.

  2. Aggressivität wählen

    Standard entfernt Whitespace + Kommentare. Aggressiv entfernt zusätzlich überflüssige Anführungszeichen und optionale Tags.

  3. Minifizierte Ausgabe kopieren

    Byte-Zahlen vorher/nachher neben der Ausgabe.

Was ist das?

Ein HTML-Minifier spart Bytes, indem er Whitespace und Kommentare entfernt, die das Rendering nicht beeinflussen. Die grössten Gewinne gibt es bei handgeschriebenem HTML mit grosszügiger Einrückung; framework-generierte Ausgaben sind meist schon kompakt. Typische Einsparung: 15-30 % auf rohem HTML vor gzip.

Wann verwenden

HTML in eine JSON-Antwort oder ein E-Mail-Template inlinen, wenn jeder Byte zählt. Eine Critical-Path-Seite nach einem Lighthouse-Audit von Hand optimieren. Aus einem WYSIWYG-Editor exportiertes HTML bereinigen, das in jeder Zeile einen Kommentar hinterliess.

Häufige Fehler

Auf Jinja-/Handlebars-/Vue-Templates ansetzen - der Minifier versteht Template-Tags nicht, also überlebt {{ stuff }}, aber Whitespace drumherum verschwindet evtl. an unerwünschten Stellen. Kommentare entfernen, die die Build-Pipeline tatsächlich braucht (Build-Info-Pragmas, IE-Conditional-Comments). Und auf bereits gzipptem Output grosse Gewinne erwarten - HTML-Minifizierung stapelt sich mit gzip, gzip macht aber das meiste.

FAQ

Bleiben <pre>, <textarea> und <code> erhalten?
Ja. Whitespace innerhalb dieser Tags ist signifikant und bleibt unverändert. Dasselbe gilt für <script>- und <style>-Inhalte.
Ist die Ausgabe noch gültiges HTML?
Mit den Standardoptionen ja - wir entfernen Whitespace nur dort, wo es das Rendering nicht ändert. Mit «optionale Tags entfernen» ist die Ausgabe kompakter, hängt aber von den HTML5-Regeln für optionale Elemente ab; der Parser sollte HTML5-konform sein.

Dieses Tool bewerten

Teile deine Erfahrung, um anderen zu helfen.

Mehr in dieser Kategorie