Comments and readability
Learn HTML comments and how to write readable code with indentation.
What is an HTML comment?
An HTML comment is a note the browser does not show but the code reader sees. It starts with <!-- and ends with -->. Comments can explain code, separate sections or hold code that is temporarily disabled.
For example, <!-- Main content --> is not shown by the browser. Avoid overuse; if the code explains itself, no comment is needed.
Indentation and readability
Indentation visually separates nested tags. A tag written one level in shows that it is the child of the tag above. The browser ignores indentation, but you and other developers read the code much faster.
Two or four spaces is a common measure. Keeping the same measure across a project makes the code look tidy.
Exercise Write a comment
Add a comment inside body. The comment should briefly describe where the main content goes; for example <!-- Main content goes here -->.
Show example solution
<!DOCTYPE html>
<html lang="en">
<head>
<title>Blog</title>
</head>
<body>
<!-- Main content goes here -->
</body>
</html>Test yourself
-
Which characters start an HTML comment?
- //
- #
- <!--
- /*
Show answer
<!-- — Correct. An HTML comment starts with <!-- and ends with -->.
-
Close the comment
<!-- a note ____Show answer
<!-- a note --> -
Match each symbol to its role
- <!-- -->
- Comment
- <html>
- Document root
- <head>
- Page information
- <body>
- Visible content