HTML Comments Tutorial with Stone River eLearning

Moving ahead with our blog post on good coding practices in HTML, today we are going to discuss about another important point that many programmers tend to ignore in their codes. As a beginner all of us must have been taught the lesson of putting comments in our code, however; majority ignores it, thinking that the teacher was just trying to make his job easier, only to realize in future that commenting our code only makes everyone’s job easier.  When you are working on an application or a big project, it is very likely that you will be working as a team with each member taking care of a certain functionality or section of the program. In such a scenario, having comments in the code allows the other programmer to understand your logic and idea behind the code that you have written. Since, ultimately the work of each programmer will be synchronized together to make the complete application, having comments gives the advantage of having the synchronization from the very start.

How do you insert comment into an HTML document?

Just like any other programming language, inserting comment inside an HTML document is extremely easy and beneficial. As explained in the video tutorial, all you need to do is:

  • Insert the less than symbol followed by the exclamation mark and two hyphens.
  • Put in your comment after this.
  • Once you are done with the comment, close it by two hyphens and a greater than symbol.

Eg:

<!DOCTYPE html>

<html>

<head>
<meta charset =”UTF-8”>
<title> Comments </title>
</head>

<body>
This is a simple text
<!--This is a comment -->
</body>

</html>

In the above example, a comment is included in the body section of the HTML document.

Points to Ponder:

1. Small and Precise:

    A comment must be as small and precise as possible. You do not want to write a long comment on a simple operation as it might distract the other programmer from the job in hand. On the flip side, the comments must not be so vague that they do not make any sense.

2. Do not pile up comments unnecessarily:

    Sometimes, in their quest to write comments on the code and make it self-explanatory, programmers write comments for each and every step of the code, making it unnecessarily long and inconclusive. A comment is there to aid the developer, not to make it difficult for him to find the actual code between the piles of comments that surrounds it.  Only write comments for the operations that might need an explanation and not for the each and every line of the code.

Bad Practice:

<!DOCTYPE html>

<html>

<head>
<title> Bad Practice </title>
</head>

<body>
Name: XYZ    <!--Name of Student -->
Age: 19   <!--Ageof Student -->
Gender: Male   <!--Gender of Student -->
Hobbies: Coding, Sports  <!--Hobbies of Student -->
Future Goals: To become the best Web Designer   <!--Future Goals of Student -->
</body>

</html>

Better Approach:

<!DOCTYPE html>

<html>

<head>
<title> Better Approach </title>
</head>

<body>
Name : XYZ    
Age : 19  
Gender : Male  
Hobbies : Coding, Sports 
Future Goals : To become the best Web Designer  
<!--Student Details -->
</body>

</html>

 

download the source code here: 

GET YOUR FREE HTML EBOOK!

(Visited 91 times, 1 visits today)