HTML-101 #3. Comments & Naming Convention
Source: Dev.to
Introduction
I’m learning HTML and documenting the journey publicly as part of the HTML‑101 series. This series is a beginner’s exploration, sharing what I understand, what confuses me, and what I learn along the way.
In this post I’ll cover:
- What are HTML comments
- Syntax of HTML comments
- Basic examples
- Important rules & limitations
- HTML comments vs. CSS comments vs. JavaScript comments
- HTML file‑naming conventions (standard homepage name, common conventions)
All notes, examples, and practice code are available in the GitHub repository:
https://github.com/dmz-v-x/html-101
HTML Comments
Definition
Comments are text annotations within code that explain purpose, logic, or history. They are visible to developers, ignored during rendering, and do not appear on the rendered webpage. However, commented HTML is still sent to the browser, so avoid placing confidential data in comments.
Syntax
<!-- comment -->
Everything between <!-- and --> is ignored by the browser.
Basic Examples
<!-- My Website -->
<h1>Hello World</h1>
Important Rules & Limitations
-
No nesting – comments cannot be nested. The following is invalid and will break the HTML:
<!-- --> -
Not secure – comments are visible in the browser’s Developer Tools. Never store sensitive information (e.g., passwords) in comments.
-
Temporary disabling – use comments for explanations, not for permanently disabling large blocks of code.
Comment Syntax in Other Languages
| Language | Comment Syntax |
|---|---|
| HTML | <!-- comment --> |
| CSS | /* comment */ |
| JavaScript | // comment /* comment */ |
HTML File Naming Convention
Standard Homepage Name
The default homepage file should be named index.html (lowercase, no spaces).
Common File Naming Conventions
- Use lowercase letters only.
- Separate words with hyphens (
-) rather than underscores (_). - Avoid spaces in file names.
Examples
about-us.html✅contact-page.html✅
File Types Examples
| Type | Example(s) |
|---|---|
| Main page | index.html |
| CSS | style.css, main.css |
| JavaScript | script.js, app.js |
| Images | hero.jpg, logo.png |
Takeaways
- HTML comments are useful for documentation but are still transmitted to the browser; keep them free of sensitive data.
- Follow a consistent, lowercase, hyphen‑separated naming scheme for files, with
index.htmlas the homepage.
Next Post
The upcoming post will cover Headings, Paragraphs & Line Breaks and will continue updating the GitHub repository with new notes.
Repository: https://github.com/dmz-v-x/html-101