Comments

The word "comment" has a specific meaning in programmer-speak. A comment is a word, sentence, or group of sentences which, when embedded in a piece of code, explain something about that code, such as what it does or how it works. A comment does not itself have any effect upon a program or a web page. A comment is invisible to a user, and is meant as a note from a programmer to another programmer, or as a note to himself/herself. A comment should clarify something about the code (why has it been written the way it has been, what it does, what it is for, etc). Comments can also be used to mark significant starting and ending points in code, or for any number of other purposes.

In HTML, a comment is just another tag, although it follows special rules. Here is what an HTML comment looks like in code:

<!-- Here is a comment -->

A comment begins with "<!--" followed by a space, and ends with a space followed by "-->". The space just after the hyphens in the opening part of comment is required, as is the space preceding the hyphens in the closing portion of the comment (these spaces are required to support non-standard commenting in some versions of Internet Explorer). In addition, a comment must not contain any carriage returns in the middle of the tag if it is to support older versions of Internet Explorer; the entire comment must be made on one line.

Incorrect (multiple lines):

<!--
Here is a comment
-->

Incorrect (multiple lines):

<!-- Here is
a comment -->

Incorrect (missing spaces):

<!--Here is a comment-->

Correct:

<!-- Here is a comment -->

According to the W3C guidelines, any one of the above commenting styles ought to work; Netscape Navigator and Opera both support all commenting standards. Some versions of Internet Explorer, however, will only support the last example shown above; you must use very specific commenting syntax to prevent web pages breaking in IE.

Here is an example of some HTML comments in action:

<!-- begin article one -->

<h3>The Bandicoot</h3>

<p>The bandicoot is a ferocious creature, but is now rarely seen by civilized man. <!-- Sally, please check last known bandicoot attack in China, 1952? 1953? --> In the seventh century BC, the bandicoot was considered to be the greatest threat to man's survival since the sabre-toothed tiger, but, due to an epidemic of bandicoot coot-pox in the 1st century AD, <!-- Sally, could you check dates on epidemic, please? --> was almost entirely wiped out.</p>

<!-- end article one -->

Note how I have marked the beginning and ending points of "article one" above with comments; I've done this so that other people will be able quickly to figure out where to replace articles on the page. This sort of beginning/ending marker is probably the most common type of comment found in professional HTML code.

I have also added additional comments into the article text for editorial purposes, asking my mythical assistant, Sally, to run some factual checks for me.

Comments may be used for any purpose. Whenever you wish to place a note, a reminder, or a piece of information into HTML code that's invisible to a user and does not affect the HTML code, you may use a comment.

Comments are particularly valuable when creating tables in HTML, helping to mark main content areas within a large and oftentimes complex layout; we'll discuss more about commenting tables in a later module.

Main Menu