HTML-Kompressor

Fügen Sie Ihren HTML-Code unten ein, um ihn zu komprimieren und zu minimieren.

Original-HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Example HTML</title>
    <style type="text/css">
      /* This is a sample CSS comment */
      body {
        font-family: Arial, sans-serif;
        margin: 0;
        padding: 20px;
        background-color: #f4f4f4;
      }
      .container {
        max-width: 800px;
        margin: 0 auto;
        background: #fff;
        padding: 20px;
        border-radius: 5px;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
      }
    </style>
  </head>
  <body>
    <div class="container">
      
      <h1>HTML Compression Example</h1>
      <p>This is a sample HTML document to demonstrate the HTML compressor.</p>
      <ul>
        <li>Removes comments</li>
        <li>Collapses whitespace</li>
        <li>Removes optional tags</li>
      </ul>
      <button onclick="showMessage()" type="button">Click Me</button>
    </div>

Komprimiertes HTML

Komprimierungsoptionen

HTML-Kommentare entfernenOptionale HTML-Tags entfernenLeere Attribute entfernenUnnötige Leerzeichen entfernenBoolesche Attribute verkürzenCSS in <style>-Tags und style-Attributen minimieren (experimentell)JavaScript in <script>-Tags minimieren (experimentell)

So verwenden Sie HTML-Kompressor

1
HTML einfügen
Kopieren Sie Ihren Seitenquelltext oder HTML-Schnipsel in das Feld „Original-HTML“.
2
Auswählen, was entfernt wird
Aktivieren Sie die gewünschten Komprimierungsoptionen, etwa das Entfernen von Kommentaren, das Reduzieren von Leerraum, das Löschen leerer Attribute oder das Minifizieren von Inline-CSS und -JavaScript.
3
Code komprimieren
Klicken Sie auf „HTML komprimieren“, um das Markup zu minifizieren, und sehen Sie die Originalgröße, die komprimierte Größe und die prozentuale Einsparung.

4
Minifiziertes HTML kopieren
Verwenden Sie „Komprimiertes HTML kopieren“, um den optimierten Code für Ihre Website oder Build-Pipeline zu übernehmen.

Häufig gestellte Fragen

Was entfernt der HTML-Kompressor?

Je nach den aktivierten Optionen entfernt er HTML-Kommentare, reduziert unnötigen Leerraum und Zeilenumbrüche, entfernt leere und optionale Attribute, reduziert boolesche Attribute und kann optionale schließende Tags löschen, um die Dateigröße zu verringern.

Kann es auch Inline-CSS und -JavaScript minifizieren?

Ja. Es gibt experimentelle Optionen, um CSS innerhalb von <style>-Tags und style-Attributen sowie JavaScript innerhalb von <script>-Tags zu minifizieren, sodass Sie eine ganze Seite in einem Durchgang komprimieren können.

Wie viel kleiner wird meine Datei?

Das hängt davon ab, wie viel Leerraum und wie viele Kommentare Ihr Markup enthält, aber das Tool zeigt die genaue Originalgröße, die komprimierte Größe und den Reduktionsprozentsatz an, sodass Sie die für Ihre konkrete Datei eingesparten Bytes sehen.

Wird das Minifizieren meine Seite beschädigen?

Das standardmäßige Entfernen von Leerraum und Kommentaren ist für wohlgeformtes HTML sicher. Die Optionen zur CSS- und JS-Minifizierung sind als experimentell gekennzeichnet, daher ist es ratsam, die Ausgabe zu testen, besonders wenn Ihre Skripte auf eine bestimmte Formatierung oder Kommentare angewiesen sind.

Wird mein HTML an einen Server hochgeladen?

Nein. Die Komprimierung läuft vollständig in Ihrem Browser, sodass Ihr Code auf Ihrem Gerät bleibt. Das Tool ist kostenlos, erfordert keine Anmeldung und funktioniert auf Mobilgeräten.

HTML-Kompressor

So verwenden Sie HTML-Kompressor

Häufig gestellte Fragen

Verwandte Tools