How to create a comment in HTML
By Flavio Copes
Learn how to add comments in HTML using the opening and closing comment tags, why they stay visible in page source, and how too many can slow your page.
You create a comment in HTML by wrapping text between <!-- and -->. Anything inside is ignored by the browser and never rendered on the page.
<!-- a comment -->Comments can also span over multiple lines:
<!--
a
comment -->You can put a comment anywhere in the document: between elements, inside an element’s content, in the <head>. The only place a comment can’t go is inside a tag itself, like between an attribute and its value.
What are comments useful for?
You can use comments in HTML for yourself, to indicate for example why some HTML is present:
<!-- spacer needed for the sticky header -->
<div class="h-16"></div>They also help in team projects, to mark where a section starts and ends in a long page.
You can also use them to remove a portion of HTML you wrote but now you don’t want to display. For testing purposes, perhaps:
<!-- <aside class="promo-banner">Summer sale!</aside> -->The banner is still in your file, but the browser skips it. Uncomment it later and it’s back.
Most editors do this for you. In VS Code, select the lines and press cmd-/ (or ctrl-/ on Windows) to toggle the comment.
Comments are visible in the page source
In both cases, the person visiting the site will not see the text you commented in the rendered page, but comments are still visible if they try to view the source of the page.
So, don’t keep anything secret or anything you don’t want users to see in there. No credentials, no internal notes about clients, nothing sensitive.
Comments can’t be nested
Here’s a mistake that will bite you at some point. You can’t put a comment inside another comment:
<!-- outer <!-- inner --> this text is rendered! -->The browser closes the comment at the first --> it finds. Everything after it leaks onto the page. If you need to comment out a block that already contains a comment, remove or edit the inner one first.
One last thing: comments still count toward the size of the HTML file the browser downloads. Page size matters for speed, so you should not have lots of comments in your HTML in production. Little comments are fine, I am more talking about hundreds of lines of commented HTML.