Comment

In HTML, a Comment is used to write notes or explanations that are not displayed on the webpage.

It is commonly used to record explanations about the code, information for modifications, or author details within the code.

CodeFriends' web coding practice environment utilizes comments in key parts of HTML code to help learners understand the code more easily.

How do you use comments?

HTML comments start with <!-- and end with -->.

Anything enclosed within a comment will not be visible on the webpage.

HTML Comment Basic Structure

<!-- This line is a comment. It does not appear on the webpage. -->
<p>This sentence is shown on the webpage.</p>

When should you use comments?

Comments are mainly used in the following situations.

Code Explanation

You can add explanations to complex code or parts that may need modification later.

Code Deactivation

When you want to temporarily disable a part of the code, you can wrap it with comments. The code within the comments will not be displayed on the webpage.

Deactivating Code with Comments

<!-- Temporarily disabling the image below.
<img src="example.jpg" alt="Sample Image">
-->

Section Separation

Comments can also be used to distinguish different sections of a webpage.

For example, you can use comments to separate sections of a website as follows:

• Header : The top part of the webpage, including the logo, main menu (navigation), and search bar.

• Main : Contains the core content of the website.

• Footer : Contains site information (such as social media, copyright information) at the bottom of the webpage.

Separating Sections with Comments

<!-- Start of Header -->
<header>...</header>
<!-- End of Header -->

<!-- Start of Main -->
<main>...</main>
<!-- End of Main -->

<!-- Start of Footer -->
<footer>...</footer>
<!-- End of Footer -->

In this way, HTML comments enhance code readability and facilitate collaboration with other developers.

Practice

Follow the highlighted sections of the code to input them yourself.