HTML-minifierare & Formaterare Online — Gratis, Ingen Uppladdning

Klistra in HTML nedan för att antingen minifiera den — ta bort kommentarer, redundanta attribut och extra mellanslag — eller snygga till den till läsbar, indenterad markup. Båda riktningarna körs helt i din webbläsare med en riktig HTML-parser, inte ett regex-hack, så innehåll inuti <pre> och <textarea> förblir intakt.

Vad är detta verktyg?

En HTML-minifierare tar bort allt en webbläsare inte behöver för att rendera en sida korrekt: kommentarer, extra mellanslag mellan taggar, redundanta attribut som type="text/javascript", och valfria avslutande snedstreck. Resultatet är funktionellt identisk HTML som laddas ner och tolkas snabbare.

Det här verktyget bygger på html-minifier-terser, samma minifierare som används i populära byggverktyg, så det förstår HTML-strukturen istället för att blint ta bort mellanslag — det rör inte formateringskänsligt innehåll inuti <pre>, <textarea>, eller infogade <script>/<style>-block, och det minifierar också CSS och JS inbäddad i din markup.

Varför använda det?

Riktig parser under huven, inte regex — säker på specialfall som <pre>-block, infogade skript och villkorliga kommentarer.
Minifierar även inbäddat <style>- och <script>-innehåll, inte bara den omgivande markupen.
Se exakt hur många byte du sparat innan du levererar filen.
Formateringsläget gör om komprimerad, enradig HTML tillbaka till något en människa kan läsa och redigera.
100 % lokal bearbetning — din markup, och allt privat i den, lämnar aldrig din webbläsare.

Så använder du det

Klistra in din HTML i inmatningsrutan, eller klicka på "Ladda exempel" för att prova ett urval.
Klicka på "Minifiera" för att komprimera den, eller "Formatera" för att snygga till den med 2-mellanslags indentering.
Kontrollera meddelandet under rutorna — minifieringsläget visar storleksminskningen; om HTML:n inte kan tolkas ser du det exakta felet istället för trasig utdata.
Klicka på "Kopiera" för att hämta resultatet.

Exempel

Inmatning

<!DOCTYPE html>
<html>
  <head>
    <title>Example</title>
  </head>
  <body>
    <!-- greeting -->
    <p class="greeting">
      Hello, world!
    </p>
  </body>
</html>

Resultat

<!doctype html><html><head><title>Example</title></head><body><p class="greeting">Hello, world!</p></body></html>

Kommentarer, indentering och radbrytningar tas bort; doctype förkortas. Den synliga sidan renderas identiskt.

Praktiska tips

Minifiera precis innan lansering, inte under utveckling — behåll läsbar HTML i versionshanteringen och minifiera bara byggresultatet.
Om en sida beter sig konstigt efter minifiering, leta efter JavaScript som förlitar sig på exakta mellanslag inuti textnoder (ovanligt, men det händer med vissa äldre widgetar).
Att formatera minifierad HTML från en live-sajt är ett snabbt sätt att inspektera dess struktur innan du skriver en skrapare eller felsöker layoutproblem.
Kombinera med CSS- och JS-minifierarna nedan om din byggprocess håller stilar och skript i separata filer.

Var det här passar in i verkliga arbetsflöden

Statiska webbplatser, e-postmallar och landningssidor byggda för hand levereras ofta med samma indentering och kommentarer som användes under utvecklingen. Att minifiera innan lansering trimmar en verklig, om än måttlig, mängd överföringsvikt — och för e-post-HTML specifikt påverkar teckenantalet ibland Gmails avklippningsgräns, så mindre markup har en funktionell fördel utöver hastighet.

Formateringsriktningen är lika användbar åt andra hållet: att klistra in en minifierad sida från view-source och formatera om den är ofta det snabbaste sättet att förstå en konkurrents landningssidestruktur eller felsöka en tredjepartsintegrering.

→ CSS-minifierare · JS-minifierare

Vanliga användningsområden

Trimma bort byte från en statisk landningssida eller e-postmall innan den lanseras.
Formatera om ett minifierat HTML-utdrag hämtat från view-source för att förstå dess struktur.
Städa upp HTML som klistrats in från en WYSIWYG-redigerare eller CMS-export, som ofta bär på överflödiga mellanslag.
Snabbt kontrollera om ett handskrivet HTML-utdrag är korrekt utformat, eftersom ett tolkningsfel visas som ett tydligt fel.

Vanliga frågor

Laddas min HTML upp någonstans?

Nej. Både minifiering och formatering sker lokalt i din webbläsare med JavaScript. Ingenting du klistrar in skickas till en server, så det är säkert att använda med interna mallar eller osläppta sidor.

Kommer minifiering att förstöra min sida?

Det borde inte — verktyget använder en riktig HTML-parser (html-minifier-terser) som förstår taggstruktur, så det bevarar mellanslagskänsliga element som <pre> och <textarea> och slår inte ihop attribut felaktigt. Kontrollera alltid kritiska sidor efter minifiering, särskilt om du förlitar dig på ovanliga infogade skript.

Minifierar den även CSS och JavaScript inuti HTML:n?

Ja. Infogade <style>- och <script>-block minifieras på plats med samma motorer som de dedikerade CSS- och JS-minifierarverktygen, så du behöver inte extrahera dem manuellt.

Hur mycket mindre blir HTML vanligtvis?

Det beror på hur mycket mellanslag, kommentarer och formatering originalet hade — handskriven HTML med mycket indentering och kommentarer krymper vanligtvis 20–40 %. Ramverksgenererad HTML som redan är kompakt sparar mindre.

Kan jag konvertera minifierad HTML tillbaka till ett läsbart format?

Ja — klistra in den minifierade HTML:n och klicka på "Formatera" istället för "Minifiera" för att få tillbaka korrekt indenterad, läsbar markup.

HTML-minifierare & Formaterare