Encodage / décodage d'entités HTML

Qu’est-ce que l’encodage d’entités HTML ?#

Le HTML donne une signification spéciale à une poignée de caractères : < et > délimitent les balises, & amorce une entité ou une référence de caractère, et " et ' encadrent les valeurs d’attribut. Chaque fois que vous voulez qu’un de ces caractères apparaisse comme texte littéral sur une page — montrer aux utilisateurs la source d’un extrait de code, renvoyer une recherche dans un champ, afficher la chaîne Tom & Jerry — vous devez le remplacer par un remplaçant appelé une entité. Cette substitution est l’encodage d’entités HTML.

Il y a trois façons d’écrire le même échappement, et cet outil offre les trois via le sélecteur Options :

• Nommées — & devient &, < devient <, etc. Lisibles par l’humain, et la seule forme que les gens tapent normalement à la main. Dans ce mode, seuls les cinq caractères structurellement dangereux sont échappés ; tout le reste passe tel quel.
• Décimales — tout caractère non ASCII ou de contrôle devient &#N;, où N est son point de code Unicode en décimal (par exemple © devient ©). Utile quand vous voulez que chaque octet non standard soit visible et ASCII-safe.
• Hexadécimales — la même idée avec des points de code hexadécimaux : © devient ©. Compact et aligne naturellement avec la notation des points de code que l’on voit dans les tables Unicode.

Le décodage reconnaît les entités nommées d’un sous-ensemble HTML5 sélectionné, plus &#NN; (décimales) et &#xHH; (hexadécimales). Une entité nommée non reconnue est laissée telle quelle plutôt que d’être devinée — plus sûr que d’émettre silencieusement le mauvais caractère.

Mode d’emploi#

1. Choisissez Encoder ou Décoder avec le commutateur en haut à gauche.
2. Sous Options, choisissez Nommées, Décimales ou Hexadécimales.
3. Collez votre texte dans le panneau Entrée à gauche.
4. Lisez le résultat échappé (ou dééchappé) dans le panneau Sortie à droite et cliquez sur Copier.
5. Exemple charge une chaîne de démonstration ; Effacer réinitialise les panneaux.

Principales fonctionnalités#

• Trois styles d’échappement depuis un seul sélecteur. Basculez entre nommé, décimal et hexa sans recoller, ce qui rend la comparaison des sorties triviale.
• Correct pour les caractères astraux. L’itération se fait par point de code Unicode, pas par unité de code UTF-16, donc un emoji comme 🌍 est traité comme un seul caractère (🌍), pas comme une paire de substituts cassée.
• Décodeur sélectionné et sûr. La table d’entités nommées couvre les références HTML5 courantes (copyright, marque commerciale, lettres accentuées, symboles mathématiques, guillemets et tirets). Les noms inconnus passent intacts au lieu d’être altérés.
• Aucune implication du DOM. L’encodage et le décodage sont de pures opérations sur chaînes — aucune injection de <div> cachée — donc la logique est pleinement testable et il n’y a aucun risque que l’outil lui-même interprète votre entrée comme du balisage.

Exemple détaillé#

Prenez un fragment qui mêle balisage et symbole littéral :

<a href="x">Tom & Jerry</a> © 2026

En mode Nommées, seuls les cinq caractères dangereux sont échappés et le © est laissé tranquille (il n’est pas structurellement dangereux) :

<a href="x">Tom & Jerry</a> © 2026

Basculez sur Décimales et le © devient aussi son point de code, tandis que les caractères centraux passent en forme numérique :

<a href="x">Tom & Jerry</a> © 2026

En mode Hexadécimales, les mêmes caractères apparaissent en points de code hexadécimaux :

<a href="x">Tom & Jerry</a> © 2026

Le décodage inverse tout cela : collez n’importe laquelle des trois sorties en retour avec Décoder sélectionné et vous récupérez le fragment d’origine, © compris.

FAQ#

Quel mode utiliser pour rendre une chaîne sûre à insérer dans du HTML ?#

Nommées est presque toujours le bon défaut pour les cinq caractères dangereux — c’est lisible, compris par tous les navigateurs, et garde la sortie adaptée aux diffs. Réservez Décimales ou Hexadécimales au cas spécifique où vous voulez que chaque caractère non ASCII soit rendu ASCII-safe (par exemple, préparer du contenu pour un transport qui rejette les octets supérieurs), et non pour l’échappement ordinaire.

J’ai décodé © mais un nom bizarre comme &mytag; est resté inchangé. Pourquoi ?#

Le décodeur ne résout que les entités qu’il connaît réellement — un sous-ensemble HTML5 sélectionné des noms courants. &mytag; n’est pas une entité HTML réelle, donc l’outil la laisse intacte plutôt que de la deviner ou de la drop. Si vous avez réellement besoin de résoudre toutes les entités définies par une DTD, vous sortez du cadre d’un convertisseur de chaînes pour entrer dans la vraie analyse HTML.

L’échappement HTML suffit-il à rendre une saisie utilisateur sûre dans une chaîne JavaScript ou une URL ?#

Non. Chaque contexte a ses propres règles. L’échappement HTML protège contre l’injection de balisage, mais une chaîne comme '); alert(1); // est inoffensive en HTML et dangereuse à l’intérieur d’un <script>. La même entrée a aussi besoin d’un encodage d’URL avant d’entrer dans un lien. Échappez pour le contexte de destination, pas seulement une fois.

Pourquoi la sortie hexa utilise-t-elle des lettres minuscules (© au lieu de ©) ?#

Le hexa minuscule est la forme conventionnelle et plus nette, et elle est analysée à l’identique par tous les navigateurs. Si vous avez besoin de majuscules pour un guide de style, le mode décimal (©) élude complètement la question, ou passez la sortie par votre propre transformation de casse.