∙ Chapter 18

What are HTML Comments?

HTML comments are notes written inside HTML code that are ignored by the browser. They help developers explain their code, organize sections, and leave reminders for themselves or other developers.

💡 Think of it this way

Imagine you are reading a book and you write a small note in the margin for yourself.

The note helps you understand the book, but it is not part of the actual story. HTML comments work in a similar way.

They are written inside the HTML source code, but the browser does not display them as webpage content.

HTML Comment Syntax

An HTML comment starts with <!-- and ends with -->.

<!-- This is an HTML comment -->

Simple Example

Here is a simple webpage containing a comment.

<h1>Welcome to ManaCoding</h1>

<!-- This paragraph explains the website -->

<p>
    Learn HTML step by step.
</p>

The browser displays the heading and paragraph, but it does not display the comment.

ℹ️ HTML comments are visible in the page's source code. They are not displayed as normal content on the webpage.

Why Use HTML Comments?

Comments are especially useful when HTML files become large or when multiple developers work on the same project.

📝 Explain Code

Add notes that explain what a particular section of HTML is doing.

📂 Organize Sections

Use comments to clearly separate areas such as header, navigation, main content, and footer.

👥 Help Your Team

Comments can help other developers understand your code more quickly.

🔧 Leave Reminders

Developers can leave notes about things that need to be changed later.

Using Comments to Organize HTML

Comments are often used to identify major sections of a webpage.

<!-- Header Section -->

<header>
    <h1>My Website</h1>
</header>


<!-- Navigation Section -->

<nav>
    <a href="#">Home</a>
    <a href="#">About</a>
</nav>


<!-- Main Content -->

<main>
    <p>Welcome to my website.</p>
</main>


<!-- Footer Section -->

<footer>
    <p>Copyright 2026</p>
</footer>

Temporarily Hide HTML Code

Comments can also be used to temporarily disable a section of HTML without deleting it.

<h1>Welcome</h1>

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

The paragraph inside the comment will not be rendered by the browser.

Multi-Line HTML Comments

You can place multiple lines inside one comment.

<!--
    This is a multi-line comment.

    It can contain several lines
    of explanation.
-->

What Does the Browser Do With Comments?

When the browser reads an HTML document, it recognizes the comment syntax and does not display the comment as webpage content.

💡 Comments are mainly for developers, not for webpage visitors.

Try It Yourself

Edit the HTML code and click Run. Try adding your own comments and see that they do not appear in the output.

html-comments.html
📝 Edit Code
👁 Live Preview
💡 Add, remove, or edit comments and click Run to see the result.

Common Mistakes

❌ Using incorrect comment syntax:
<comment>This is wrong</comment>
❌ Forgetting to close a comment:
<!-- This comment is not closed
❌ Putting sensitive information inside comments.

Never use HTML comments for passwords, API keys, private credentials, or secrets.
❌ Adding too many unnecessary comments.

Comments should help developers understand the code rather than make simple HTML harder to read.

HTML Comment Best Practices

  • Use comments to explain useful information.
  • Keep comments short and meaningful.
  • Use comments to separate large sections.
  • Keep the comment syntax correct.
  • Do not store passwords or secrets in comments.
  • Remove unnecessary temporary comments before production when appropriate.

Quick Summary

  • HTML comments are notes written inside HTML.
  • Comments are not displayed as normal webpage content.
  • HTML comments start with <!--.
  • HTML comments end with -->.
  • Comments can be used to explain and organize HTML code.
  • Comments can temporarily disable HTML code.
  • Never put passwords or sensitive information inside HTML comments.

Frequently Asked Questions

What is an HTML comment?

An HTML comment is a note inside HTML source code that is ignored when the browser displays the webpage.

What is the syntax for an HTML comment?

Use: <!-- comment -->

Are HTML comments visible on a webpage?

No. They are not displayed as normal webpage content, although they can be seen when viewing the page source or inspecting the HTML.

Can HTML comments contain multiple lines?

Yes. You can place multiple lines between <!-- and -->.

Can I store passwords inside HTML comments?

No. HTML source can be viewed by users, so never put passwords, API keys, or other sensitive information inside comments.

HTML Comments Interview Questions

Q1. What are HTML comments?

HTML comments are notes written in the HTML source code that are not displayed as normal webpage content.

Q2. What is the syntax of an HTML comment?

HTML comments use <!-- at the beginning and --> at the end.

Q3. Why are HTML comments useful?

They help developers explain, organize, and maintain HTML code.

Q4. Can HTML comments be seen by users?

They are not displayed on the webpage, but users can inspect the source code and see them.

Q5. Can comments be used to temporarily disable HTML?

Yes. HTML elements placed inside a comment will not be rendered by the browser.