Minificateur de code HTML

Une page HTML plus légère, à l'identique

Le HTML que vous écrivez à la main ou exportez d'un éditeur est plein d'indentations, de lignes vides et de commentaires. Rien de tout cela ne s'affiche, mais tout est téléchargé à chaque visite. Le minificateur HTML de Jood supprime ce superflu, minifie au passage le CSS et le JavaScript écrits dans la page, et vous rend un fichier plus petit qui s'affiche exactement comme avant.

Mode d'emploi

1. Collez le code de la page dans le champ « Code source », jusqu'à 2 Mo.
2. Cliquez sur « Commencer ».
3. Copiez le résultat avec « Copier le résultat » et remplacez-en le code d'origine.

Ce que fait l'outil

• Il supprime les commentaires, mais garde les commentaires conditionnels dont Outlook et certains vieux logiciels ont besoin, comme <!--[if mso]>.
• Il réduit chaque suite d'espaces et de retours à la ligne à un seul espace, et retire les espaces autour des balises de structure comme div, p, li ou table.
• Il laisse un espace entre les balises qui se placent dans le texte, comme b, a ou span, pour que les mots ne se collent pas.
• Il ne touche pas au contenu de pre et de textarea, où les espaces font partie du contenu.
• Il minifie le CSS des balises style et le JavaScript des balises script, et laisse intacts les scripts d'un autre type, comme les données JSON-LD destinées aux moteurs de recherche.

Lors de notre essai, une petite page avec une indentation ordinaire, un commentaire, une balise style et une balise script est passée de 509 à 389 octets, soit environ un quart de moins.

Deux cas où l'affichage peut changer

• Des éléments en inline-block côte à côte : si votre menu est fait de li en display: inline-block, le petit écart entre eux venait des espaces du code. Après la minification, il disparaît : réglez-le avec margin ou gap dans le CSS.
• Des espaces conservés par le CSS : si vous utilisez white-space: pre sur un autre élément que pre, les espaces qu'il contient seront réduits. Placez ce texte dans une balise pre, ou ne minifiez pas cette page.

Conseils avant de l'utiliser

• Collez uniquement le HTML final, celui que reçoit le navigateur. Un fichier de gabarit contenant du PHP ou un autre langage de templates risque de ne plus fonctionner, car l'outil traite tout comme du HTML.
• Les e-mails en HTML en profitent beaucoup : Gmail coupe un message dont le code dépasse environ 102 Ko et cache la suite derrière un lien pour l'afficher en entier.
• Gardez la version d'origine pour les modifications et testez la page après la minification.

Pour des fichiers séparés, utilisez le minificateur CSS et le minificateur JavaScript. Le code est envoyé au serveur de Jood, minifié, et n'est pas conservé.