Chapter 13 of 17 · HTML for Beginners — Complete Free Tutorial
HTML Entities & Special Characters
Some characters have special meaning in HTML. To display them as literal text — or to write symbols that don't exist on your keyboard — you use entities: short codes that always render correctly.
Why entities exist
The parser treats <, >, and & as structural markers. If you literally type a < b in a paragraph, the browser sees < b as the start of a tag and your content breaks. The fix is an entity.
The essential entities (memorise these)
| Entity | Renders as | When you need it |
|---|---|---|
< | < | Inside code samples, comparisons |
> | > | Code samples, arrows |
& | & | URLs (?a=1&b=2), "R&D" |
" | " | Attribute values containing quotes |
' | ' | Apostrophes in attributes |
| non-breaking space | Prevent a line wrap: ₹ 499, 10 km |
Common symbols
| Entity | Result | Entity | Result |
|---|---|---|---|
© | © | ® | ® |
™ | ™ | ° | ° |
… | … | — | — |
– | – | • | • |
’ | ’ | “…” | “…” |
&rupee; | &rupee; | ∞ | ∞ |
× | × | ÷ | ÷ |
✓ | ✓ | ☆ | ☆ |
Numeric (Unicode) entities
Every character in Unicode has a numeric form — named when you don't know the name:
<p>Price: ₹299 <!-- ₹ via decimal code --></p>
<p>Price: ₹299 <!-- same, hexadecimal --></p>
<p>Café — open till 9 <!-- é and an em dash --></p>Emoji also work: 🎉 renders 🎉. And if your file is saved as UTF-8 with <meta charset="UTF-8">, you can simply type é, ₹, or 🎉 directly — entities are the safe fallback for characters your editor or pipeline might mangle.
Entities inside <code> blocks
This is where beginners hit trouble. Showing HTML to readers requires escaping everything:
<!-- What the source contains -->
<p>Use <a href="/"> for links.</p>
<!-- What the visitor sees -->
Use <a href="/"> for links.The <pre> element preserves whitespace
<pre>
Line 1
Indented line
</pre>Inside <pre>, spaces, tabs, and newlines are kept exactly as typed — which is why every code sample on the web sits inside <pre><code>.
Real-life use case
- Legal/footer text:
© 2026 – terms & conditions apply. - Comparisons in docs:
if (a < b). - Prices that must not break:
between number and currency in narrow columns. - Math and science pages:
≤≤,≥≥,±±,αα.
Common mistakes
- Typing
&raw in URLs —?a=1&b=2must be?a=1&b=2in HTML attributes. - Double-escaping — writing
&lt;shows the literal text<. - Using
<br>for spacing instead of — wrong tool; paragraphs have margins. - Forgetting the trailing semicolon —
©(no;) is non-standard; always end with;.
Best practices
- Memorise the six essential entities — you'll type them daily.
- Save files as UTF-8 and always declare the charset; then write symbols directly.
- When writing code samples, escape first, then paste into your editor — or use your editor's HTML-escape shortcut.
What's next?
Embed maps, widgets, and videos safely in iframes & Embedding, or jump to HTML Accessibility — our most career-relevant chapter.
Frequently Asked Questions
HTML (HyperText Markup Language) is the standard markup language that defines the structure and meaning of every web page. Learning HTML is the fastest way into web development: it is the foundation that CSS, JavaScript, and every framework build upon, and it directly affects SEO and accessibility.
Most beginners can build their first complete page in a day and become comfortable with the core tags within 1–2 weeks of daily practice. This 17-chapter series is designed to be completed in about 2–3 weeks at a relaxed pace, faster if you type out every example.
Only a plain text editor (VS Code is free and popular) and a web browser. No installation, no setup, no account — create a file called index.html, double-click it, and it opens in your browser.
HTML5 is the current generation of the HTML standard (published as the living standard by WHATWG). When people say "HTML5" they usually mean modern HTML: semantic elements like header, nav and article, native audio/video, canvas, and improved form input types — all covered in this tutorial.
No. HTML is a markup language — it describes content and structure but has no variables, loops, or conditionals. Those come with programming languages like JavaScript, which you would learn after HTML and CSS.
Right here: every chapter includes examples you can retype in your own index.html file, plus practice challenges. After this series, build small projects — a portfolio page, a recipe page, or a landing page for a local business — they exercise the same tags in real contexts.
Search engines crawl HTML first. Unique titles, a single clear h1, a logical heading hierarchy, descriptive alt text, valid markup, fast-loading responsive images, and a proper internal linking structure all come straight from HTML — see the HTML & SEO chapter for the full checklist.
Accessible HTML makes your site usable by everyone, including people who rely on screen readers or keyboards, and it is a legal requirement in many countries. The good news: proper labels, semantic elements, alt text, and keyboard-operable controls are mostly free HTML habits.
No — there are roughly 100 meaningful tags and you will naturally use about 30 of them regularly. Focus on understanding purpose and structure; editors and references (like MDN) handle the rest. This tutorial covers every tag beginners actually need.
CSS for visual design and layout, then JavaScript for interactivity, then a version control system (Git). With those three you can build complete websites; frameworks like React or Laravel Blade come after the fundamentals feel natural.