HTML Comments and HTML Practices

What Are HTML Comments?

HTML comments are notes in the code that are not displayed in the browser. They are meant for developers to explain, organize, or remind themselves of something in the code.

Syntax:

<!-- This is a comment -->

Example 1: Basic HTML Comment

Code:

<p>This is visible text.</p>
<!-- This paragraph explains something important -->

Output:

This is visible text.

Example 2: Commenting Out a Line of Code

Code:

<!-- <h1>This heading is temporarily disabled</h1> -->
<p>This paragraph is active.</p>

Output:

This paragraph is active.

Best Practices for HTML Comments

Here are some HTML coding best practices when using comments:

1. Use Comments to Explain Sections

Add comments to separate sections of your HTML document.

<!-- ======= HEADER SECTION ======= -->
<header>
  <h1>My Website</h1>
</header>

2. Avoid Overusing Comments

Too many comments can clutter your code. Use them only where necessary.

3. Don’t Put Sensitive Info in Comments

Never write passwords, API keys, or private data in comments — they can still be seen in the browser's source code.

4. Use Clear and Concise Language

Good example:

<!-- Navigation links to main pages -->

Bad example:

<!-- links links links links navbar maybe who knows -->

5. Temporarily Disable Code for Testing

Use comments to disable a block of code temporarily:

<!--
<div>
  <p>This block is disabled during testing</p>
</div>
-->

6. Keep Comments Updated

Don’t leave outdated or misleading comments — they confuse everyone later!

Summary Table