Mise en forme et minification HTML - Formatez votre HTML en ligne gratuitement

Collez n'importe quel HTML — même une sortie minifiée sur une seule ligne issue d'une chaîne de build — et l'outil le remet en forme avec une indentation correcte, une balise par ligne et des espacements cohérents. Choisissez une indentation de 2, 4 ou 8 espaces. Le résultat est prêt à être glissé dans votre éditeur ou collé dans un commentaire de revue de code.

L'embellissement déploie le HTML pour le rendre lisible : chaque balise sur sa propre ligne, les éléments imbriqués indentés et les lignes vides conservées entre les sections. La minification supprime les commentaires, compresse les suites d'espaces et retire les sauts de ligne pour que le fichier pèse moins d'octets. Utilisez l'embellissement pour l'édition et la relecture, et la minification pour le déploiement en production.

Non — js-beautify (le moteur sous le capot) détecte les blocs script et style et formate leur contenu avec les règles JS ou CSS appropriées, de sorte que les scripts en ligne restent valides et les feuilles de style lisibles. Les balises auto-fermantes, les éléments vides et les attributs avec espace de noms (svg:xmlns, xlink:href) sont tous gérés correctement.

Il gère parfaitement le HTML simple et les modèles de type HTML, mais le JSX pur (expressions entre accolades, fragments, balises de composant en majuscules) est analysé comme du HTML et peut présenter de légers problèmes cosmétiques. Pour le code propre à un framework, nous recommandons Prettier configuré pour votre dialecte ; pour le HTML brut, les fichiers .htm et les fichiers de modèle, notre outil est parfait.

Aucun téléversement n'a lieu. Le formateur fonctionne entièrement dans votre navigateur avec js-beautify, vous pouvez donc coller en toute sécurité des modèles de pages internes, des brouillons d'e-mails ou du HTML contenant des données privées sans que rien ne quitte votre appareil.

La minification supprime les commentaires HTML, réduit toute suite d'espaces entre les balises à un seul espace et élimine les sauts de ligne. Le résultat est un HTML au rendu identique au pixel près, généralement 10 à 30 % plus léger. Combinée à gzip côté serveur, elle réduit nettement le poids initial des pages riches en contenu.

Oui : cliquez sur Télécharger pour enregistrer le résultat mis en forme sous output.html ou le résultat minifié sous output.min.html. Le fichier est encodé en UTF-8, il fonctionne donc aussi bien avec du contenu anglais, cyrillique, CJK ou de droite à gauche.

Il s'agit d'un petit utilitaire fonctionnant uniquement dans le navigateur — sans aucun coût d'hébergement — c'est pourquoi nous le proposons gratuitement dans le cadre de notre boîte à outils pour développeurs. Aucune publicité, aucun suivi sur le résultat, aucune limite de taille de fichier au-delà de ce que votre navigateur peut conserver en mémoire.

Le mode Embellir vous laisse choisir une indentation de 2, 4 ou 8 espaces. Choisissez la largeur utilisée par votre éditeur ou votre style de code, puis copiez le résultat ou téléchargez-le sous output.html pour reporter directement la mise en forme dans votre projet.

Le sélecteur d'indentation (2, 4 ou 8 espaces) ne s'applique qu'en mode Embellir, puisque Minifier supprime par conception tous les espaces et retours à la ligne — il ne reste rien à indenter. Revenez à Embellir pour voir la largeur d'indentation reprendre effet.

À mesure que vous collez ou modifiez, l'outil effectue automatiquement une vérification structurelle et liste toute balise non fermée, mal appariée ou de fermeture superflue directement sous le panneau de sortie — sans bouton dédié. Un message vert « Aucun problème de structure détecté » confirme que le balisage est bien formé.

Utilisez le mode Embellir avec une indentation de 2 espaces — c'est la convention la plus courante et cela garde les diffs compacts — puis vérifiez le panneau des problèmes structurels pour confirmer qu'aucune balise n'est restée non fermée. Une fois révisé, passez au mode Minifier avant la mise en production pour retirer à nouveau les espaces superflus.

Oui — faites glisser un fichier .html, .htm ou .xhtml sur la zone d'import, ou cliquez pour parcourir, et son contenu se charge directement dans la zone de saisie exactement comme si vous l'aviez collé. À partir de là, Embellir, Minifier, la largeur d'indentation et le vérificateur de structure fonctionnent tous à l'identique, que le balisage provienne d'un fichier ou d'un collage.

Oui — dès qu'il y a un résultat, un bouton Copier apparaît à côté du panneau de sortie et de la zone d'action principale. Cliquer dessus copie instantanément le résultat actuel d'Embellir ou de Minifier dans votre presse-papiers (il affiche brièvement « Copied! » en confirmation), vous permettant de coller directement dans votre éditeur ou dans un commentaire de revue de code sans enregistrer de fichier .html intermédiaire.