HTML Minifier

Klistra in HTML för att ta bort kommentarer och överflödiga blanktecken och minifiera inline CSS och JavaScript. Innehåll i <pre> och <textarea> lämnas exakt som det är skrivet.

Körs i din webbläsareIngen registreringInget laddas upp

Minifierad utdata

Så använder du HTML Minifier

  1. Klistra in ett HTML-dokument eller fragment, eller öppna en .html-fil.
  2. Välj vad som ska tas bort: kommentarer, blanktecken och om inline <style>- och <script>-block också ska minifieras.
  3. Kontrollera varningsraden: ett inline-skript med syntaxfel behålls oförändrat i stället för att förstöra sidan.
  4. Kopiera den minifierade HTML-koden eller ladda ner den.

Vad tas bort?

  • Kommentarer: <!-- … --> tas bort, utom villkorliga kommentarer för Internet Explorer och kommentarer som börjar med <!--!.
  • Blanktecken mellan blockelement: radbrytningar och indrag mellan taggar som <div>, <li> eller <head> renderas aldrig, så de tas bort helt.
  • Flera mellanslag i text: de slås ihop till ett enda mellanslag, vilket är precis så webbläsaren ändå renderar dem.
  • Blanktecken inuti taggar: <p class = "a"> blir <p class="a">.

Vad bevaras?

På vissa ställen har blanktecken betydelse, och minifieraren respekterar dem. Innehållet i <pre> och <textarea> behålls byte för byte. Ett enskilt mellanslag mellan inline-element, som <b>bold</b> text, behålls eftersom orden annars skulle slås ihop. Attributvärden och citattecken ändras aldrig.

Inline CSS och JavaScript

Inline <style>-block optimeras med CSSO och inline <script>-block med Terser, samma motorer som används på sidorna CSS-minifierare och JavaScript-minifierare. JSON-LD och andra JSON-skriptblock komprimeras, och skript av okända typer (till exempel mallar) lämnas orörda.

Lönar sig HTML-minifiering?

För serverrenderade sidor och statiska webbplatser är HTML-dokumentet det första webbläsaren laddar ner, så varje sparad byte förkortar tiden till första rendering. Besparingar på 10–25 % före komprimering är vanliga, mer för kraftigt indragna mallar och sidor med stora inline-skript.

Vanliga frågor

Ändrar HTML-minifiering hur sidan ser ut?
Nej. Bara blanktecken som webbläsaren ändå skulle slå ihop tas bort, och innehåll i <pre>/<textarea> lämnas orört. Om du stylar element med white-space: pre i CSS bör du stänga av Komprimera blanktecken.
Minifieras inline JavaScript och CSS?
Ja, när alternativen är aktiverade. Om ett inline-block har ett syntaxfel behålls det oförändrat och en varning visas, så sidan går aldrig sönder.
Kan jag minifiera mallfiler som Handlebars, Jinja eller Blade?
Oftast ja, så länge malltaggarna står i text eller attributvärden. Mallar som lägger logik i taggnamn eller mellan attribut kan behöva kontrolleras manuellt.
Skickas min HTML någonstans?
Nej. Allt bearbetas lokalt i din webbläsare.

Relaterade verktyg

CSS-minifierare Krymp stilmallar: förkorta värden och slå ihop dubblettregler. JavaScript Minifier Komprimera och mangla JS med Terser, med storlek och gzip-statistik. HTML Entity Encoder / Decoder Escapa HTML-specialtecken eller avkoda &entities;. URL Encode / Decode Procentkoda/avkoda text och tolka URL-query strings.