Why Entities Exist
The browser uses < and > to identify HTML tags, and & to start an entity. If you type these directly as content the browser gets confused:
<!-- Problem: browser thinks <script> is a real tag -->
<p>Use the <script> tag for JavaScript.</p>
<!-- Solution: escape the angle brackets -->
<p>Use the <script> tag for JavaScript.</p>
<!-- Renders as: Use the <script> tag for JavaScript. -->Most Common HTML Entities
| Entity | Character | Description |
|---|---|---|
< | < | Less-than sign (tag open) |
> | > | Greater-than sign (tag close) |
& | & | Ampersand |
" | " | Double quote |
' | ' | Apostrophe / single quote |
| (space) | Non-breaking space — prevents line break between words |
© | © | Copyright symbol |
® | ® | Registered trademark |
™ | ™ | Trademark symbol |
— | — | Em dash |
– | – | En dash |
… | … | Ellipsis |
€ | € | Euro sign |
£ | £ | Pound sign |
→ | → | Right arrow |
← | ← | Left arrow |
Practical Examples
<!-- Copyright footer -->
<p>© 2026 ylearner. All rights reserved.</p>
<!-- Non-breaking space: prevents "10" and "km" splitting onto separate lines -->
<p>Distance: 10 km</p>
<!-- Displaying code in text -->
<p>The <div> tag is a block container.</p>
<!-- Price range with en dash -->
<p>Price: £10–£50</p>
<!-- Trademark -->
<p>ylearner™ — Learn to code for free.</p>
<!-- Numeric entity (decimal) -->
<p>© 2026</p> <!-- Same as © -->
<!-- Numeric entity (hex) -->
<p>♥</p> <!-- ♥ -->Entities vs Unicode in HTML5
With <meta charset="UTF-8"> (which every modern HTML5 page should have), you can type most special characters directly into your HTML file — your code editor saves them as UTF-8 characters the browser reads correctly. Entities are still useful for <, >, and & which are structurally significant, and for non-breaking spaces.
<!-- In HTML5 with UTF-8, these are equivalent: -->
<p>© 2026</p>
<p>© 2026</p> <!-- Direct Unicode character -->
<!-- But these MUST use entities: -->
<p><tag></p> <!-- Displaying < and > as text -->
<p>5 & 10</p> <!-- Displaying & as text -->HTML Entities: Displaying Characters HTML Reserves
Some characters mean something to HTML itself — a literal < starts a tag. To display them as text you use an entity: an escape code the browser renders as the real character.
| Character | Entity | Why escape it |
|---|---|---|
< | < | otherwise starts a tag |
> | > | closes a tag |
& | & | starts an entity |
| (space) | | non-breaking space |
| © | © | not on the keyboard |
<!-- To show: if (a < b && c > d) -->
<code>if (a < b && c > d)</code>The security angle: escaping <, >, and & in any user-supplied text is how you prevent XSS — if a user types <script> and you render it raw, their script runs; escaped, it just shows as text. Templating engines auto-escape for this reason.
Two handy ones: is a space where the line must not break (e.g. "10 kg"); overusing it for layout is a smell — use CSS margins. Entities come in named (©) and numeric (©) forms; named are more readable.
🏋️ Practical Exercise
- Display a literal less-than and greater-than sign using
<and>. - Show the copyright symbol in a footer using
©. - Write
5 < 10and confirm the operator displays literally instead of being parsed. - Add a non-breaking space between two words with
so they never wrap apart. - Display a price using the euro entity
€and the pound entity£.
🔥 Challenge Exercise
Create a small "HTML cheat sheet" page that visibly shows the code for an anchor tag — for example <a href="..."> — as literal text on the page (not a working link). You will need entities for the angle brackets and quotes. Then add a copyright footer with the © symbol and the current year.
📋 Summary
- HTML entities start with
&and end with;— e.g.&,<,©. - Must-escape:
<(<),>(>),&(&) — these are structurally reserved in HTML. — non-breaking space, prevents unwanted line breaks.- In HTML5 with UTF-8, you can type most symbols directly. Entities are mainly needed for the reserved characters.
Interview Questions
- What is an HTML entity and when do you need one?
- How do you display a literal
<character on a page? - Why must a literal ampersand be written as
&? - What does
do and when is it useful? - What is the difference between a named entity and a numeric entity?
Related Topics
FAQ
A lone & can be read as the start of an entity. Always write & for a literal ampersand, especially inside text and URLs, to avoid parsing surprises.
With UTF-8 encoding (the modern default) you can type accented characters directly. Entities are mainly required for the reserved characters <, >, and &.