Correctement commenté HTML le balisage est une partie importante d'une page Web bien construite. Ces commentaires sont faciles à ajouter, et toute personne devant travailler sur le code de ce site à l'avenir (y compris vous-même ou les membres de toute équipe avec laquelle vous travaillez) vous remerciera pour ces commentaires.
Comment ajouter des commentaires HTML
Le HTML peut être créé avec un éditeur de texte standard, comme Notepad++ pour Windows ou TextEdit pour un Mac. Vous pouvez également utiliser un programme centré sur la conception Web comme Adobe Dreamweaver ou même une plate-forme CMS comme Wordpress ou ExpressionEngine. Quel que soit l'outil que vous utilisez pour créer du code HTML, si vous travaillez directement avec le code, vous ajouteriez des commentaires HTML comme celui-ci:
Ajoutez la première partie de la balise de commentaire HTML:
Après cette première partie du commentaire, écrivez le texte que vous souhaitez voir apparaître pour ce commentaire. Il s'agira probablement d'instructions pour vous ou un autre développeur à l'avenir. Par exemple, si vous souhaitez indiquer où une certaine section d'une page commence ou se termine dans le balisage, vous pouvez utiliser un commentaire pour le détailler.
Une fois le texte de votre commentaire terminé, fermez la balise de commentaire comme ceci:
Donc au total, votre commentaire ressemblera à ceci:
C'est vraiment si simple.
L'affichage des commentaires
Tous les commentaires que vous ajoutez à votre code HTML apparaîtront dans ce code lorsque quelqu'un affiche la source de la page Web ou ouvre le code HTML dans un éditeur pour apporter quelques modifications. Ce texte de commentaire n'apparaîtra cependant pas dans le navigateur Web lorsque des visiteurs normaux se rendront sur le site. Contrairement à d'autres éléments HTML, y compris les paragraphes, les en-têtes ou les listes, qui ont un impact réel sur la page dans ces navigateurs, les commentaires sont vraiment des éléments "en coulisses" de la page.
Commentaires à des fins de test
Étant donné que les commentaires n'apparaissent pas dans un navigateur Web, ils peuvent être utilisés pour « désactiver » des parties d'une page pendant le test ou le développement de la page. Si vous ajoutez la partie d'ouverture d'un commentaire directement avant la partie de votre page/code que vous souhaitez masquer, puis vous ajoutez le partie de fermeture à la fin de ce code (les commentaires HTML peuvent s'étendre sur plusieurs lignes, vous pouvez donc ouvrir un commentaire sur, disons, la ligne 50 de votre code et fermez-le à la ligne 75 sans problème), alors tous les éléments HTML qui entrent dans ce commentaire ne seront plus affichés dans le le navigateur. Ils resteront dans votre code, mais n'auront pas d'impact sur l'affichage visuel de la page. Si vous devez tester une page pour voir si une certaine section pose problème, etc., il est préférable de commenter cette zone plutôt que de la supprimer. Avec les commentaires, si la section de code en question s'avère ne pas être le problème, vous pouvez facilement supprimer les éléments de commentaire et ce code s'affichera à nouveau. Assurez-vous simplement que ces commentaires utilisés pour les tests ne se retrouvent pas dans les sites Web de production. Si une zone d'une page ne doit pas être affichée, vous souhaitez supprimer le code, pas seulement le commenter, avant de lancer ce site.
Une grande utilisation des commentaires HTML pendant le développement est lorsque vous construisez un site responsive. Parce que différentes parties de ce site changeront d'apparence en fonction de différentes tailles d'écran, y compris certaines zones qui peuvent ne pas être affichées du tout, l'utilisation de commentaires pour activer ou désactiver des sections d'une page peut être une astuce simple et rapide à utiliser pendant le développement.
Concernant les performances
J'ai vu des professionnels du Web suggérer que les commentaires soient supprimés des fichiers HTML et CSS afin de réduire la taille de ces fichiers et de créer des pages à chargement plus rapide. Bien que je convienne que les pages doivent être optimisé pour les performances et devrait se charger rapidement, il y a toujours une place pour l'utilisation intelligente des commentaires dans le code. N'oubliez pas que ces commentaires sont destinés à faciliter le travail sur un site à l'avenir, aussi longtemps que vous n'en faites pas trop commentaires ajoutés à chaque ligne de votre code, la petite taille de fichier ajoutée à une page en raison des commentaires devrait être supérieure à acceptable.
Conseils pour l'utilisation des commentaires
Quelques points à prendre en compte ou à retenir lors de l'utilisation de commentaires HTML:
- Les commentaires peuvent être sur plusieurs lignes.
- Utilisez des commentaires pour documenter le développement de votre page.
- Les commentaires peuvent également documenter le contenu, les lignes ou les colonnes du tableau, suivre les modifications ou tout ce que vous souhaitez.
- Les commentaires qui « désactivent » des zones d'un site ne doivent pas être mis en production à moins que ce changement ne soit un temporaire qui sera inversé rapidement (comme avoir un message d'alerte allumé ou éteint comme nécessaire).