HTML Comments

An HTML comment is a note written inside the code that the browser does not display. Comments help the people who maintain the page.

A comment on its own line

The comment gives a reminder to the author. Nothing from it appears on the page.

<!-- Remember to update this page. -->

A comment beside content

The paragraph appears on the page. The comment after it does not.

<p>Open daily.</p>
<!-- Hours may change in winter. -->

Commented-out code

The hidden paragraph sits inside a comment. Only the visible paragraph appears.

<!-- <p>Coming soon.</p> -->
<p>Open now.</p>

Example

<!DOCTYPE html>
<html>
<head>
<title>Library Hours</title>
</head>
<body>
<!-- Page updated in October. -->
<h1>Library Hours</h1>
<p>The library opens at nine.</p>
<!-- <p>The library opens at eight.</p> -->
<p>The library closes at six.</p>
</body>
</html>

Key points

Use <!-- to open a comment
Use --> to close a comment
Commenting out: hiding code inside a comment so it stops appearing
A comment can sit on its own line or beside content.
Notes inside comments stay in the code and off the page.

In this example, a comment sits before the heading. The heading and first paragraph appear on the page. An old paragraph sits inside a comment, so it stays hidden. The last paragraph appears after the comment.

Note

Anyone can view the page source, so never hide private information in comments.

Try it Yourself

Edit the code, then press Run.

Runs in your browser — the preview under the editor is the real result. Nothing is sent to a server. The code runner panel (right) does the same with more room.

<!DOCTYPE html>
<html>
<head>
<title>Library Hours</title>
</head>
<body>
<!-- Page updated in October. -->
<h1>Library Hours</h1>
<p>The library opens at nine.</p>
<!-- <p>The library opens at eight.</p> -->
<p>The library closes at six.</p>
</body>
</html>

Exercise

Which marks close an HTML comment?

--> </comment> --!> //