Le commentaire HTML est introduit dans une balise < !-- commentaire -- > : le texte renseigné s'affiche dans le code, mais il n'est pas visible par le visiteur de la page web. C'est un moyen utile au développeur pour annoter son code, pour travailler dessus sans affecter l'affichage de la page web, pour garder en mémoire un historique des modifications ou encore pour isoler des lignes de code suspectes. Lorsque le site est développé dans le cadre d'un travail collaboratif, les commentaires HTML sont particulièrement utiles.
Qu'est-ce qu'un commentaire HTML ?
Le commentaire HTML est une section de texte non-affichée par le navigateur web. Le commentaire est renseigné à l'intérieur des balises HTML < !-- -- > : lorsque le navigateur lit le code, il ne traite pas les informations contenues dans ces balises.
Exemple de commentaire HTML
Dans cet exemple, le développeur souhaite appliquer une mise en forme cohérente, pour faciliter la lecture et la rendre agréable. Il insère un commentaire pour se rappeler qu'à chaque élément « recette », le premier mot des étapes de la recette doit être mis en gras. Le cas échéant, son annotation est une information qui pourra en outre renseigner le développeur qui prend sa suite pour coder la page web. En tout état de cause, le commentaire HTML dûment inséré n'apparaît pas dans le texte de la page web.
See the Pen commentaire-html_exemple by HubSpot France (@HubSpot-France) on CodePen.
Quel est l'intérêt des commentaires HTML ?
Les commentaires HTML, invisibles des visiteurs de la page web, s'affichent dans le code à destination de tous les développeurs amenés à travailler dessus. Insérer un commentaire HTML présente plusieurs intérêts :
- Au moment de développer le site web : le commentaire HTML sert de rappel ou d'explication, pour clarifier le code et faciliter ainsi le travail du développeur. Exemple : le développeur laisse une note pour se rappeler d'insérer les liens HTML sur les images et non sur le texte ; si un autre développeur prend le relais, il comprend la stratégie et l'applique.
- Pour résoudre un bug : le commentaire HTML permet de bloquer temporairement l'affichage d'une ligne de code par le navigateur, pour identifier d'où provient le bug sans supprimer le code. Les balises de commentaire sont introduites successivement au début et à la fin de chaque ligne de code : le développeur observe les résultats successifs affichés sur le navigateur, jusqu'à identifier le bug pour le résoudre.
- Pour tester l'ergonomie d'une page web : en utilisant la balise de commentaire HTML, le développeur peut activer et désactiver du code à son gré. La balise permet également de mettre en attente une ligne de code, la retirer ultérieurement débloque la ligne de code pour afficher le contenu sur le navigateur. Exemple : le développeur veut tester deux emplacements pour un bouton d'appel à l'action ; il introduit deux lignes de code à cet effet, et en place une entre les balises de commentaires HTML pour n'afficher qu'un bouton sur la page web ; il mesure le taux de conversion sur ce bouton, puis le désactive et active l'autre en retirant ses balises de commentaire ; il mesure le nouveau taux de conversion, et choisit le bouton le plus performant.
- Lors de la refonte du site web : le développeur qui restructure le site web peut décider de mettre en commentaire des portions de l'ancienne version du code, dans l'hypothèse où elles devraient être restaurées ultérieurement. Ces portions ne s'affichent pas dans le navigateur, mais restent visibles sur le code source de la page web.
Comment insérer un commentaire HTML ?
Pour insérer un commentaire HTML, il faut utiliser la balise < !-- -- > et placer le texte entre les deux double-tirets. Exemples : < !-- je commente ici pour rappel -- > ; < !-- je mets le paragraphe < p > paragraphe suspendu < /p > en commentaire pour le désactiver temporairement -- >.
Exemple d'insertion d'un commentaire HTML pour activer et désactiver facilement une offre promotionnelle périodique sur un site de e-commerce :
See the Pen commentaire-html_offre-active by HubSpot France (@HubSpot-France) on CodePen.
See the Pen commentaire-html_offre-inactive by HubSpot France (@HubSpot-France) on CodePen.
Pour aller plus loin, découvrez comment effectuer des vérifications et des changements en masse dans votre code ou vos données en téléchargeant le guide sur les regex ; ou découvrez l’outil CMS de HubSpot.
Comment mettre un commentaire dans son code HTML ?
GUIDE ET MODÈLE GRATUITS : MAÎTRISER LES REGEX
Utilisez les regex de façon optimale pour rechercher des informations ou bien automatiser certaines opérations.
Télécharger gratuitementMis à jour :
Publié :
Le commentaire HTML est introduit dans une balise < !-- commentaire -- > : le texte renseigné s'affiche dans le code, mais il n'est pas visible par le visiteur de la page web. C'est un moyen utile au développeur pour annoter son code, pour travailler dessus sans affecter l'affichage de la page web, pour garder en mémoire un historique des modifications ou encore pour isoler des lignes de code suspectes. Lorsque le site est développé dans le cadre d'un travail collaboratif, les commentaires HTML sont particulièrement utiles.
Qu'est-ce qu'un commentaire HTML ?
Le commentaire HTML est une section de texte non-affichée par le navigateur web. Le commentaire est renseigné à l'intérieur des balises HTML < !-- -- > : lorsque le navigateur lit le code, il ne traite pas les informations contenues dans ces balises.
Exemple de commentaire HTML
Dans cet exemple, le développeur souhaite appliquer une mise en forme cohérente, pour faciliter la lecture et la rendre agréable. Il insère un commentaire pour se rappeler qu'à chaque élément « recette », le premier mot des étapes de la recette doit être mis en gras. Le cas échéant, son annotation est une information qui pourra en outre renseigner le développeur qui prend sa suite pour coder la page web. En tout état de cause, le commentaire HTML dûment inséré n'apparaît pas dans le texte de la page web.
See the Pen commentaire-html_exemple by HubSpot France (@HubSpot-France) on CodePen.
Gagnez du temps dans la gestion de votre code et de vos données
Téléchargez ce guide pour effectuer des vérifications et des changements en masse avec les regex et gagner en productivité.
Télécharger
Tous les champs sont obligatoires.
Merci d'avoir soumis le formulaire
Cliquez sur le lien pour accéder au contenu en tout temps
Quel est l'intérêt des commentaires HTML ?
Les commentaires HTML, invisibles des visiteurs de la page web, s'affichent dans le code à destination de tous les développeurs amenés à travailler dessus. Insérer un commentaire HTML présente plusieurs intérêts :
Comment insérer un commentaire HTML ?
Pour insérer un commentaire HTML, il faut utiliser la balise < !-- -- > et placer le texte entre les deux double-tirets. Exemples : < !-- je commente ici pour rappel -- > ; < !-- je mets le paragraphe < p > paragraphe suspendu < /p > en commentaire pour le désactiver temporairement -- >.Exemple d'insertion d'un commentaire HTML pour activer et désactiver facilement une offre promotionnelle périodique sur un site de e-commerce :
See the Pen commentaire-html_offre-active by HubSpot France (@HubSpot-France) on CodePen.
See the Pen commentaire-html_offre-inactive by HubSpot France (@HubSpot-France) on CodePen.
Pour aller plus loin, découvrez comment effectuer des vérifications et des changements en masse dans votre code ou vos données en téléchargeant le guide sur les regex ; ou découvrez l’outil CMS de HubSpot.
Partager cet article sur les réseaux sociaux
Articles recommandés
6 étapes pour intégrer un lien téléphonique HTML sur son site web
Le guide complet pour insérer ses vidéos en HTML
Insérer des espaces en HTML : comment faire ?
Balise : comment insérer un saut de ligne en HTML
"input" en HTML : un élément essentiel pour capturer et traiter les données utilisateur
Comment créer un compte à rebours en HTML
Liste des 13 meilleurs éditeurs HTML
Qu'est-ce qu'un Iframe et comment l'intégrer dans une page ?
Qu'est-ce qu'un doctype et comment l'écrire ?
Comment faire une liste HTML ? Balises et < ul> et < ol>