Function and Usage of the HTML Comment

HTML Comment Explained

A comment in HTML is a section of code that is not rendered and shown in the browser display. While a visitor of your website can see text, videos, and pictures, they are not able to look at what you have commented:

<!--This is an example text that won't be displayed in the browser-->
<p>This will be shown in the browser.</p>

Generally, HTML comments are for you or other developers who might be looking at the source code. Their purpose is to help the author of the code and other developers understand it better. Using HTML comments, you can explain your choices to a colleague reviewing your code or even debug a program quicker.

Syntax for Comments in HTML

The tags used to separate HTML comments from the rest of the text are simple:

<!-- comment text -->

You can also use them for multiline HTML comments:

<!--
comment line 1
comment line 2
comment line 3
-->

When looking at how to comment in HTML, you may come upon a <comment> tag – however, it's an experimental element which was never in the HTML specification. No modern browser supports it:

This tag is <comment>NOT</comment> supported.

Pros

• Easy to use with a learn-by-doing approach
• Offers quality content
• Gamified in-browser coding experience
• The price matches the quality
• Suitable for learners ranging from beginner to advanced

Main Features

• Free certificates of completion
• Focused on data science skills
• Flexible learning timetable

GET 25% OFF

Pros

• Simplistic design (no unnecessary information)
• High-quality courses (even the free ones)
• Variety of features

Main Features

• Nanodegree programs
• Suitable for enterprises
• Paid Certificates of completion

UP TO 70% OFF

Pros

• A wide range of learning programs
• University-level courses
• Easy to navigate
• Verified certificates
• Free learning track available

Main Features

• University-level courses
• Suitable for enterprises
• Verified certificates of completion

FREE COURSES

Commenting Code Blocks Out

Using the HTML comment tags, you can also comment out a complex or a long piece of HTML code to disable it:

<div>
<p>This text is visible. Check the source code for multi-line comment.</p>
<!--  
Hello, world! I am a comment and I am
displayed in multiple lines!
--> 
</div>

Being able to comment out in HTML helps in easy debugging or testing. Sometimes you find errors in your code but aren't sure where or what is the exact problem. In such a case, you can comment parts out to temporarily deactivate your code and find out which bit is causing the issue.

Unusual Types of HTML Comments

There are two other types of comments in HTML which are a little more complex and serve a different purpose: conditional and software comments. Both of them belong to old technologies that you should not use now. However, it's good to understand what they are in case you come upon them in older documents.

The conditional HTML comment feature was applicable in the Internet Explorer (IE) browser versions 5–9. As the name suggests, it gave conditions on what to display:

<div>
  <!--[if IE 5]>
  Add special instructions for the Internet explorer browser here
  <![endif]-->
</div>

Note: IE 10 and newer versions do not support conditional comments.

A software comment could be included in an HTML editor called FrontPage to deliver a specific message:

<!--webbot bot-->

Note: FrontPage is discontinued: the extended support for it ended in 2014.

HTML Comment: Useful Tips

• Unlike most HTML elements, comments cannot be nested.
• Make sure to delete every unnecessary comment in HTML before publishing the site: a smaller file will be loaded quicker by the browser.