HTML: HTML Comments
Last updated: 2026-09-08
Comments are text notes written for developers. Browsers completely ignore them. Using comments wisely can dramatically improve code readability and facilitate team collaboration.
1. Comment Syntax
HTML comments begin with <!-- and end with -->. The content in between can be any text; the browser will not display it on the page:
▶ Example
▶ Try it Yourself📌 Note: Although comment content is not visible on the page, it still appears in the HTML source code — anyone can see your comments by viewing the page source. Never include passwords or sensitive information in comments.
2. Common Uses of Comments
Comments aren't just for writing notes — they're also very useful during development and debugging:
▶ Example
▶ Try it Yourself💡 Best Practice: Comments should explain why something is written a certain way, not how it's written. Good code should be self-explanatory; comments only supplement context that the code itself cannot express. Also, remember to clean up debugging comments before going live.
▶ Example
Multi-line comment block for section documentation:
▶ Try it Yourself❓ FAQ
Q Can users see HTML comments?
A Comments don't appear on the page, but anyone can see them by viewing the page source (right-click → View Page Source). So never put passwords, API keys, or sensitive logic in comments. Comments are for developers, not users. Clean up debugging comments before going live.
Q Can comments be nested?
A No. HTML comments don't support nesting — you can't write a
<!-- --> inside another comment. If you try, the browser treats the first --> as the comment's end, exposing everything after it on the page. If you need to comment out a block that already contains comments, consider using CSS display:none or JavaScript to control visibility.Q What can I put inside comments?
A Comments can contain any text, line breaks, and spaces, but cannot contain
-- (double hyphens) as it may be misinterpreted as the comment's end. Common uses: 1) Section markers (like <!-- Navigation Start -->); 2) TODO markers (like <!-- TODO: Add search feature -->); 3) Temporarily hiding code (for debugging); 4) Author info (like <!-- @John 2026-06-12 -->).📖 Summary
- Comments start with
<!--and end with-->; browsers do not display them - Comments can be used to explain code blocks, temporarily hide code, and add TODO markers
- Sensitive information in comments is visible to everyone — never put passwords there
- Clean up debugging comments before deployment to keep source code tidy
📝 Exercises
- Add comments to your code: Write a simple page with navigation and body content, adding section comment markers before and after each block (e.g.,
<!-- Navigation Start -->). - Comment-based debugging: Copy the code from a previous lesson and use comments to temporarily "hide" a section. Verify that the hidden section is indeed not displayed on the page.
