HTML Minifier

Plak HTML om commentaar en overbodige witruimte te verwijderen en inline CSS en JavaScript te minificeren. Inhoud in <pre> en <textarea> blijft precies zoals hij geschreven is.

Draait in je browserGeen account nodigNiets wordt geüpload

Geminificeerde uitvoer

Zo gebruik je de HTML Minifier

  1. Plak een HTML-document of -fragment, of open een .html-bestand.
  2. Kies wat er weg moet: commentaar, witruimte, en of inline <style>- en <script>-blokken ook geminificeerd moeten worden.
  3. Controleer de regel met waarschuwingen: een inline script met een syntaxfout blijft ongewijzigd, zodat je pagina niet breekt.
  4. Kopieer de geminificeerde HTML of download hem.

Wat wordt er verwijderd?

  • Commentaar: <!-- … --> wordt verwijderd, behalve conditionele commentaren voor Internet Explorer en commentaar dat begint met <!--!.
  • Witruimte tussen blokelementen: regeleinden en inspringing tussen tags als <div>, <li> of <head> worden nooit weergegeven en verdwijnen dus volledig.
  • Reeksen spaties in tekst: die worden samengevoegd tot één spatie, precies zoals de browser ze toch al weergeeft.
  • Witruimte binnen tags: <p class = "a"> wordt <p class="a">.

Wat blijft behouden?

Op sommige plekken is witruimte betekenisvol, en de minifier respecteert dat. De inhoud van <pre> en <textarea> blijft byte voor byte gelijk. Eén spatie tussen inline-elementen, zoals <b>bold</b> text, blijft staan, omdat de woorden anders aan elkaar komen. Attribuutwaarden en aanhalingstekens worden nooit gewijzigd.

Inline CSS en JavaScript

Inline <style>-blokken worden geoptimaliseerd met CSSO en inline <script>-blokken met Terser, dezelfde engines als op de pagina's CSS Minifier en JavaScript Minifier. JSON-LD en andere JSON-scriptblokken worden compact gemaakt, en scripts van onbekende types (bijvoorbeeld templates) blijven ongemoeid.

Loont het om HTML te minificeren?

Bij server-gerenderde pagina's en statische sites is het HTML-document het eerste wat de browser downloadt, dus elke bespaarde byte verkort de tijd tot de eerste weergave. Besparingen van 10–25% vóór compressie zijn gebruikelijk, en meer bij sterk ingesprongen templates en pagina's met grote inline scripts.

Veelgestelde vragen

Verandert het minificeren van HTML hoe mijn pagina eruitziet?
Nee. Alleen witruimte die de browser toch al samenvoegt wordt verwijderd, en de inhoud van <pre>/<textarea> blijft onaangeroerd. Geef je elementen in CSS white-space: pre, zet dan Witruimte samenvoegen uit.
Minificeert het ook inline JavaScript en CSS?
Ja, als die opties aan staan. Heeft een inline blok een syntaxfout, dan blijft het ongewijzigd en verschijnt er een waarschuwing, zodat de pagina nooit breekt.
Kan ik templatebestanden zoals Handlebars, Jinja of Blade minificeren?
Meestal wel, zolang de template-tags in tekst of attribuutwaarden staan. Templates die logica in tagnamen of tussen attributen zetten, moet je misschien handmatig controleren.
Wordt mijn HTML ergens naartoe gestuurd?
Nee. Alles wordt lokaal in je browser verwerkt.

Gerelateerde tools

CSS Minifier Stylesheets verkleinen: waarden verkorten en dubbele regels samenvoegen. JavaScript Minifier JS comprimeren en mangelen met Terser, met grootte- en gzip-statistieken. HTML Entity Encoder / Decoder Speciale HTML-tekens escapen of &entities; decoderen. URL coderen / decoderen Tekst percent-encoden/decoden en URL-querystrings parsen.