Geek Slack

Introduction to HTML
About Lesson



HTML Comments


HTML Comments

HTML comments are used to insert notes or comments in the source code. These comments are not displayed by the browser and can be very useful for documenting your code.

Basic Syntax

HTML comments are placed between <!-- and --> tags. Anything placed within these tags will be treated as a comment.

<!-- This is a comment -->

Example Usage

Comments can be used in various parts of an HTML document to describe the structure, sections, or individual elements.

<!-- Header Section -->
<header>
    <h1>Welcome to My Website</h1>
</header>

<!-- Main Content -->
<main>
    <p>This is the main content of the page.</p>
</main>

<!-- Footer Section -->
<footer>
    <p>© 2024 My Website</p>
</footer>

Commenting Out Code

You can use comments to temporarily disable parts of your code for testing or debugging purposes.

<p>This paragraph is visible.</p>
<!-- <p>This paragraph is hidden.</p> -->

Best Practices

  • Use comments to explain the purpose and functionality of sections of your code.
  • Avoid excessive commenting. Only comment on code that may not be immediately clear.
  • Keep comments up-to-date as you modify your code.

Example of a Well-Commented HTML Document

<!-- Document Header -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Sample Page</title>
</head>
<body>

    <!-- Header Section -->
    <header>
        <h1>Welcome to My Sample Page</h1>
    </header>

    <!-- Main Content -->
    <main>
        <p>This is an example of a well-commented HTML document.</p>
    </main>

    <!-- Footer Section -->
    <footer>
        <p>© 2024 My Sample Page</p>
    </footer>

</body>
</html>

Join the conversation