polyshFormateur HTML
Obtenez un HTML lisible et indenté de façon cohérente à partir d’un code minifié ou sur une ligne.
- Fonctionne dans votre navigateur
- Aucun envoi de fichier
- Aucun compte
Chargement de l'outil dans votre navigateur…
Ce que fait Formateur HTML
Les modèles minifiés, le HTML d’e-mail et le code copié depuis les outils de développement du navigateur arrivent souvent sur une seule longue ligne. Collez-le ici : chaque élément de bloc passe sur sa propre ligne, indenté sous son parent, pour voir la structure, relire une différence ou repérer où l’imbrication déraille.
Les éléments courts, comme un élément de liste contenant un seul lien, restent sur une ligne, et les balises en ligne dans un paragraphe restent dans le fil du texte. Choisissez « 2 espaces », « 4 espaces » ou « Tabulation » sous « Indenter avec » selon votre projet.
Exemple
Entrée
<nav><ul><li><a href="/">Accueil</a></li><li><a href="/docs/">Documentation</a></li></ul></nav><p>Bonjour <em>à tous</em></p>
Résultat
<nav>
<ul>
<li><a href="/">Accueil</a></li>
<li><a href="/docs/">Documentation</a></li>
</ul>
</nav>
<p>Bonjour <em>à tous</em></p>nav et ul passent sur leurs propres lignes, tandis que chaque élément de liste et le paragraphe restent sur une ligne car ils ne contiennent que du contenu en ligne.
Mode d'emploi : Formateur HTML
- Collez du HTML dans le champ « HTML », ou cliquez sur « Ouvrir un fichier ».
- Choisissez « 2 espaces », « 4 espaces » ou « Tabulation » sous « Indenter avec ».
- Cliquez sur « Copier », ou sur « Télécharger le .html ».
Bon à savoir
- L’outil met en forme mais ne valide pas. Les balises fermantes manquantes ne sont pas signalées ; elles apparaissent comme une imbrication inattendue dans le résultat indenté.
- Les suites d’espaces et de sauts de ligne dans le texte ordinaire sont réduites à un espace, comme le fait un navigateur à l’affichage.
- Il n’y a pas d’option de minification. Pour alléger du HTML en production, utilisez le minificateur de votre outil de build.
- Pour retirer aussi les styles, les classes ou les balises non sûres, utilisez plutôt le Nettoyeur HTML.
Questions sur Formateur HTML
Comment mettre en forme du HTML en ligne ?
Collez le HTML dans le champ : la version mise en forme apparaît aussitôt. Choisissez votre indentation, puis copiez-la ou téléchargez-la en fichier .html.
Mettre en forme le HTML peut-il changer l’aspect de la page ?
Rarement. Les navigateurs ignorent les espaces entre les éléments de bloc. L’exception concerne les éléments inline ou inline-block placés côte à côte, entre lesquels un retour à la ligne peut ajouter un petit espace visible.
Faut-il indenter le HTML avec 2 ou 4 espaces ?
Deux espaces est le choix le plus courant pour le HTML, car le code s’imbrique profondément et les lignes s’allongent vite. Quatre espaces ou des tabulations conviennent si votre projet les utilise déjà ; la cohérence compte plus que le nombre.
Peut-il mettre en forme des modèles d’e-mail HTML ?
Oui. Le code d’e-mail chargé de tableaux devient bien plus facile à suivre avec chaque tableau, ligne et cellule sur sa propre ligne, et les styles en ligne dont dépendent les clients de messagerie sont conservés tels quels.