Skip to main content
Practice

Comment

In HTML, comments are used to add notes or explanations that are not displayed on the web page.

They are mainly used to document explanations or notes about the code, such as modifications or author information.

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


How to use comments?​

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

All content wrapped in comments will not be visible on the web page.

Basic Structure of HTML Comments
<!-- This is a comment. It will not be displayed on the web page -->
<p>This sentence will be displayed on the web page.</p>

When to use comments?​

Comments are mainly used in the following situations.

Code Explanation​

You can add explanations for complex code or parts that might be modified later.


Disabling Code​

You can wrap certain parts of the code in comments if you want to temporarily disable them. The commented-out code will not be displayed on the web page.

Disabling Code with Comments
<!-- Temporarily disable the image below.
<img src="example.jpg" alt="Sample Image">
-->

Section Separation​

You can also use comments to separate different sections of the web page.


For instance, you can separate the following sections of a website with comments.

  • Header: The upper part of the web page containing the logo, primary navigation, search bar, etc.

  • Main: The core content of the website

  • Footer: The lower part of the web page containing site information (social media links, copyright, etc.)

Separating Sections with Comments
<!-- Header Start -->
<header>...</header>
<!-- Header End -->

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

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

By using HTML comments, you can increase the readability of your code and facilitate collaboration with other developers.


Practice​

Follow the parts marked with asterisks in the code and type them in.