HTML Entities & Symbols

HTML Entities & Symbols

HTML entities are special codes used to display reserved characters, symbols, or invisible spaces in a webpage. They are essential because some characters, like < or >, have a special meaning in HTML and cannot be used directly.

Why Use HTML Entities:

1. Display Reserved Characters: Some characters are reserved in HTML (like <, >, &) and need to be written as entities to appear correctly.
2. Add Special Symbols: Entities allow you to include symbols like ©, ®, ™, arrows, fractions, or accented letters.
3. Maintain Proper Formatting: Non-breaking spaces ( ) help control spacing without breaking lines.

Common HTML Entities:

Entity	Symbol	Description
&lt;	<	Less-than symbol
&gt;	>	Greater-than symbol
&amp;	&	Ampersand
&nbsp;	(space)	Non-breaking space
&copy;	©	Copyright symbol
&reg;	®	Registered trademark
&trade;	™	Trademark
&quot;	"	Double quotation mark
&apos;	'	Single quotation mark

Example: 

<p>5 &lt; 10 &amp; 10 &gt; 5</p>
<p>&copy; 2025 My Website</p>

Output:

Emojis in HTML (UTF-8)

HTML supports emojis using Unicode (UTF-8) encoding. Emojis can be added in two main ways:

1. Directly typing the emoji in your HTML content (if your file uses UTF-8 encoding).
2. Using Unicode numeric codes with &#code; or hexadecimal codes with &#xcode;.

Example:

<p>I ❤️ HTML ?</p>
<p>Smile: &#128512;</p>
<p>Thumbs up: &#x1F44D;</p>

Output :

Tips for Using Emojis in HTML:

• Ensure your HTML file has UTF-8 encoding

<meta charset="UTF-8">

• Use Unicode codes when you want consistent rendering across browsers and platforms.
• Emojis can enhance user engagement, highlight important points, or add a friendly touch to content.