Section 6: Comments, Entities, Unicode and Special Characters
Welcome to Section 6 of Codementrix HTML5 Mastery. In this lesson, you will learn how to write HTML comments, display reserved characters safely, use named and numeric character references, understand Unicode and UTF-8, and avoid common encoding problems when building multilingual websites.
These concepts are particularly important when writing code examples, displaying prices and mathematical symbols, creating technical blogs, supporting Odia and other languages, and preventing HTML characters from being interpreted incorrectly.
1. Learning Objectives
By the end of this lesson, you will be able to:
- Write valid HTML comments and understand their limitations.
- Explain why character references are needed for certain characters.
- Use named, decimal, and hexadecimal character references.
- Display reserved characters such as less-than, greater-than, and ampersand.
- Understand Unicode, code points, and UTF-8 encoding.
- Display symbols, emoji, accented characters, and multilingual text correctly.
- Recognize common character-encoding problems such as mojibake.
- Distinguish HTML character references from CSS escapes and JavaScript escape sequences.
- Use safe output techniques when displaying user-provided text.
2. HTML Comments
HTML comments allow developers to add notes to the HTML source. They can explain a section of code, identify a temporary development area, or leave instructions for another developer.
Basic Syntax
<!-- This is an HTML comment -->The browser does not normally display the comment as visible page content.
Example: Comments in a Web Page
<!-- Main page heading -->
<h1>Welcome to Codementrix</h1>
<!-- Introduction section -->
<p>Learn practical web development tutorials.</p>The comments explain the purpose of the following elements. The visible page contains the heading and paragraph, but not the comment text.
Commenting Out HTML During Development
You can temporarily comment out a section of markup while testing a page.
<h2>Available Courses</h2>
<!--
<ul>
<li>HTML5 Mastery</li>
<li>CSS Mastery</li>
</ul>
-->The list inside the comment is not parsed as ordinary visible HTML elements while the comment remains intact.
However, commented-out content is still present in the delivered source. Do not use comments to protect confidential information, API keys, passwords, or private business data.
Important Comment Rules
- Begin a comment with
<!--. - End a comment with
-->. - Comments are not displayed as ordinary page content.
- Comments can be inspected in the page source or Developer Tools.
- HTML comments cannot be nested reliably.
- A comment must not contain the character sequence
--internally. - Avoid placing comments inside a tag's attribute list.