Learn how to insert HTML comments in your website code quickly, easily and with examples. In our guide you will discover: What HTML comments are, how you can integrate them into your code and the best tips to use them. Read on and learn like a professional programmer
What is an HTML comment?
The first step, knowing what an HTML comment consists of. This is a snippet of HTML code that does not affect the execution of the code. In other words, everything you include in the comment will not modify the content or the operation of the web page.
Comments in HTML5 will only be annotations with additional information about the code, so that the same programmer knows how everything is structured, or, even more important, so that the developer who takes over the project, which happens many times, has a guide on how the web has been built.
As you can imagine, comments are a very important element when it comes to teamwork, since it is the way to understand another developer's code and be able to work with it. If you want to learn more about programming, we have a post explaining what programming is and what it is for.
How to insert comments in HTML 5?
Now that we know what HTML comments are, let's see how to quickly and easily add them to our code.
To make comments in HTML, use the tag <!– and –>, “<!– COMMENT –>”. At the beginning and end of the comment.
HTML comment example:
<!DOCTYPE html>
<html>
<head>
<title>My website</title>
</head>
<body>
<!–This is a comment–>
<h1>Welcome to my website</h1>
<p>This is a sample page</p>
</body>
</html>
This code would execute all of the HTML except for the part highlighted in red, which is the HTML comment included in this code. So this comment will only be relevant to developers who stop to read it and understand the code.
How to comment on multiple lines of code in HTML?
Now you may wonder: Does this work for multiline comments? The answer is Yes, and now we will explain it better with an example.
To comment on several lines of code in HTML5, the HTML tags mentioned above are used “<!–” “–>” with the comment between the two tags.
Example of HTML comment on several lines of code:
<!DOCTYPE html>
<html>
<head>
<title>My website</title>
</head>
<body>
<!–
<h1>Welcome to my website</h1>
<p>This is a sample page</p>
–>
</body>
</html>
In this example, the <h1> tag and the <p> tag would be inside the comment. These would be two lines of code within a comment.
You can comment as many lines of code as you need, as long as the entire comment is inside the corresponding tags. It doesn't matter if you want to comment on one line of code or 200, the method is the same, and the entire comment must be included within the open and closed comment tags.
Tips for using HTML comments in your code
Discover how to generate code understandable by other programmers using HTML5 comments.
- Explain your code in words: The essential use of comments is to explain your code in sections, so the programmer who deals with your code in the future will know how you worked on it. If you're working with a team of programmers on the same project, feedback is essential.
- Test your code: HTML comments are very useful for testing different parts of the code, using the comments to temporarily disable a certain part of the code. This works very well to detect if there is an error in a specific section.
- Update the comments: Keep in mind that the code of a project is constantly changing, so if something that is previously commented on is changed, the comment must be changed Explain the current code.
- Do not hide code with comments: Although the code is hidden using comments, if we want a bot to read it, we should not use comments, we should use other tags such as "style" or "script". Since if we comment on it, these comments, quite possibly, will be ignored or deleted.
Similar to other languages: For example HTML and CSS
You are already an expert in HTML comments, and surely in HTML5 code. The good news for you is that comments in different programming languages are very similar, and in most cases, you will have to put two elements, one to open the comment and one to close it, be it HTML, CSS, or PHP ...
Comments are used by all programmers, the language doesn't matter and it doesn't matter if they are backend or frontend.
For example: let's compare HTML comments and CSS comments:
In the case of HTML comments, we have seen that the element to open the comment is the tag “<!–”, and to close it we use the tag “–>”.
In the case of the CSS language, instead of using tags, we use the symbol/* to open the comment and to close it we use */ .
Example CSS comment:
We have given the CSS language as an example because comments work the same as in other programming languages, such as JavaScript.
The next step is to be a professional in HTML and web programming
Congratulations programmer! Now you know how to insert comments in an HTML code to have the code of the project organized.
Do you want to work as a professional programmer in 7 months? With the Master of Software Development from the Assembler Institute, you will train in software programming and get your first job as a professional programmer.
Bionic eye, robots and other inventions In Science And Technology info TV