HTML Comments (HTML Tutorial part 25)

A comment is a way for you as the web page developer to control what lines of code are to be ignored by the web browser.

There are three main reasons you may want your code to be ignored.

• Writing notes or reminders to yourself inside your actual HTML documents.
• Scripting languages such as Javascript require some commenting.
• Temporarily commenting out elements especially if the element has been left unfinished.

Use the last example place text inside your code and documents that the web browser will ignore. This is a great way to place little notes to yourself or to remind yourself what pieces of code are doing what.

HTML Code:

<!--Note to self: This is my banner image! Don't forget -->
<img src="http://www.tizag.com/pics/tizagSugar.jpg" height="100" width="200" />

Comment to self:

As you can see comment syntax may be a little complicated, there is an opening and a closing much like tags.

• <!-- Opening Comment
• -- > Closing Comment

Placing notes and reminders to yourself is a great way to remember your thoughts and to keep track elements embedded in your webpages. Also, your code may exist for many years, these notes to yourself are a great way to remember what was going on as you may not remember 5 or more years down the road.
All combinations of text placed within the comment tags will be ignored by the web browser, this includes any HTML tags, scripting language(s), etc.

HTML - <!-- Commenting Existing Code -->

As a web developer often times you may have many works in progress, or elements that aren't quite finished. In this case you may comment out an element until it is 100% ready for the site. Below we have commented out an input form element since we are not quite ready to receive input from our users.

HTML Code:

<!-- <input type="text" size="12" /> -- Input Field -->

Now when we are ready to display that element, we can simply remove the comment tags and our browser will readily display the element.

HTML Code:

<input type="text" size="12" />

Input Field:

Comment out elements and bits of code that you may want to recall and use at a later date. Nothing is more frustrating than deleting bits of code only to turn around and recode them.

HTML - <!-- Commenting Scripts -->

Scripting languages such as Javascript and VBScript must be commented out as well. You will learn that once they are placed within the <script> tags, only then does the browser correctly execute the scripts.

HTML Code:

<script>
<!-- 
document.write("Hello World!")
//-->
</script>

With this example we are jumping far ahead, just be sure you understand when to use comments and where to look for them. They are a very useful tool for any large project.