Vue d'ensemble
La Visionneuse HTML sert à relire du contenu après nettoyage et à comparer ce qui est rendu avec le code source nettoyé. Elle est utile pour vérifier ce qui a été conservé, ce qui a été supprimé et si le balisage restant garde une cohérence visuelle et structurelle. L’outil fonctionne dans le navigateur et permet d’inspecter du balisage collé directement. Vous pouvez contrôler les liens, les balises média, les attributs en ligne et les messages de validation avant d’intégrer le contenu dans une page, un champ CMS, un modèle ou un fichier exporté.
Cas d'usage
- Relire des fragments CMSContrôlez un bloc copié depuis un champ de contenu avant de l’insérer dans une mise en page ou un modèle.
- Inspecter du HTML importéVérifiez quels éléments subsistent après nettoyage d’un balisage provenant d’un autre système ou d’un export.
- Valider une sortie d’éditeurConfirmez les destinations de liens, les images et la mise en forme générées par un éditeur avant enregistrement.
- Auditer des contributions utilisateurAnalysez le balisage de commentaires, profils ou publications et repérez les parties dangereuses retirées.
Comment ca marche
- 1
Collez le HTML dans la zone de saisie.
- 2
L’outil nettoie le balisage localement.
- 3
Vérifiez l’aperçu et le code propre.
- 4
Inspectez les liens, les images, les attributs et les notes de validation.
- 5
Copiez le HTML nettoyé s’il répond à vos besoins.
Exemples
Supprimer un script en ligne
Entree: <p>Lire la suite <script>alert('x')</script><a href='https://example.com/post'>ici</a></p>
Sortie: <p>Lire la suite <a href="https://example.com/post">ici</a></p>
L’élément script est retiré tandis que le paragraphe et le lien sûrs restent visibles.
Retirer un attribut dangereux
Entree: <img src='avatar.png' onerror='alert(1)' alt='Avatar'><span>Profil</span>
Sortie: <img src="avatar.png" alt="Avatar"><span>Profil</span>
Les gestionnaires d’événements non sûrs sont supprimés de la balise image.
Corriger un balisage mal imbriqué
Entree: <div><strong>Titre<p>Contenu</strong></p></div>
Sortie: <div><strong>Titre</strong><p>Contenu</p></div>
L’aperçu affiche une structure nettoyée afin de repérer plus facilement les imbrications incorrectes.
FAQ
Que modifie l’outil dans mon HTML ?
Il supprime les parties dangereuses ou non autorisées pendant le nettoyage et affiche le balisage nettoyé obtenu, qui peut donc différer de l’original.
Pourquoi certains attributs disparaissent-ils ?
Les attributs susceptibles d’exécuter des scripts, d’ajouter un comportement ou de casser la sortie autorisée sont retirés, y compris les gestionnaires d’événements.
Puis-je considérer l’aperçu comme le résultat final ?
Utilisez-le comme étape de vérification, pas comme remplacement de la validation côté application. Les environnements peuvent autoriser des éléments ou attributs différents.
Pourquoi le HTML cassé change-t-il d’apparence au collage ?
Le navigateur et le nettoyeur normalisent le balisage invalide. Cela peut modifier l’ordre des balises, les fermer automatiquement ou déplacer du texte.