Minificateur HTML

Collez du HTML pour supprimer les commentaires et les espaces superflus et minifier le CSS et le JavaScript inline. Le contenu des balises <pre> et <textarea> reste exactement tel qu’écrit.

Fonctionne dans le navigateurSans inscriptionAucun envoi de données

Sortie minifiée

Comment utiliser : Minificateur HTML

  1. Collez un document ou un fragment HTML, ou ouvrez un fichier .html.
  2. Choisissez ce qu’il faut supprimer : commentaires, espaces, et indiquez si les blocs inline <style> et <script> doivent aussi être minifiés.
  3. Vérifiez la ligne d’avertissements : un script inline contenant une erreur de syntaxe est conservé tel quel plutôt que de casser votre page.
  4. Copiez le HTML minifié ou téléchargez-le.

Qu’est-ce qui est supprimé ?

  • Les commentaires : <!-- … --> est supprimé, sauf les commentaires conditionnels d’Internet Explorer et ceux qui commencent par <!--!.
  • Les espaces entre éléments de bloc : les sauts de ligne et l’indentation entre des balises comme <div>, <li> ou <head> ne sont jamais affichés, ils sont donc entièrement supprimés.
  • Les suites d’espaces dans le texte : elles sont réduites à une seule espace, exactement comme le navigateur les affiche de toute façon.
  • Les espaces dans les balises : <p class = "a"> devient <p class="a">.

Qu’est-ce qui est préservé ?

Les espaces ont un sens à certains endroits, et le minificateur les respecte. Le contenu de <pre> et <textarea> est conservé à l’octet près. Une espace entre deux éléments inline, comme <b>bold</b> text, est conservée car la supprimer collerait les mots. Les valeurs d’attributs et les guillemets ne sont jamais modifiés.

CSS et JavaScript inline

Les blocs <style> inline sont optimisés avec CSSO et les blocs <script> inline avec Terser, les mêmes moteurs que ceux des pages minificateur CSS et minificateur JavaScript. Le JSON-LD et les autres blocs de script JSON sont compactés, et les scripts de type inconnu (des templates, par exemple) sont laissés intacts.

La minification HTML en vaut-elle la peine ?

Pour les pages rendues côté serveur et les sites statiques, le document HTML est la première chose que télécharge le navigateur : chaque octet économisé raccourcit le délai avant le premier affichage. Des gains de 10 à 25 % avant compression sont courants, davantage pour les templates très indentés et les pages avec de gros scripts inline.

Questions fréquentes

Minifier le HTML change-t-il l’apparence de ma page ?
Non. Seuls les espaces que le navigateur réduirait de toute façon sont supprimés, et le contenu de <pre>/<textarea> n’est pas touché. Si vous stylez des éléments avec white-space: pre en CSS, désactivez Réduire les espaces.
Le JavaScript et le CSS inline sont-ils minifiés ?
Oui, lorsque les options sont activées. Si un bloc inline contient une erreur de syntaxe, il est conservé tel quel et un avertissement s’affiche : la page ne casse jamais.
Puis-je minifier des templates Handlebars, Jinja ou Blade ?
En général oui, tant que les balises de template apparaissent dans le texte ou dans les valeurs d’attributs. Les templates qui placent de la logique dans les noms de balises ou entre les attributs peuvent nécessiter une vérification manuelle.
Mon HTML est-il envoyé quelque part ?
Non. Tout est traité localement dans votre navigateur.

Outils associés

Minificateur CSS Alléger vos feuilles de style : valeurs raccourcies, règles fusionnées. Minificateur JavaScript Compresser et raccourcir du JS avec Terser, tailles et gzip à l’appui. Encodeur / décodeur d’entités HTML Échapper les caractères spéciaux HTML ou décoder les &entities;. Encodeur / décodeur d’URL Encoder/décoder en pourcent et analyser les query strings d’URL.