Chapter 20
Beginner
8 min read
Advanced Topics
Meta Tags & SEO
Meta tags sit in the <head> and are invisible to visitors but crucial for SEO, social sharing and browser behaviour.
🎯 What you'll learn
✓Add charset, viewport and
description meta
✓Use Open Graph for social
previews
✓Set the canonical URL
✓Write SEO-friendly page titles
Introduction to Meta Tags & SEO
This chapter covers Meta Tags & SEO in depth. Understanding this topic is essential for writing clean, modern HTML. Use the live editor below to experiment as you read.
💡 In This Chapter
You will see real code examples, clear
explanations, and a live editor to practice immediately — no setup needed.
Essential Meta
Core head tags.
HTML
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Learn HTML at K2infocom">
<title>HTML Tutorial — K2infocom</title>Open Graph
Social preview tags.
HTML
<meta property="og:title" content="HTML Tutorial">
<meta property="og:description" content="Free HTML tutorial">
<meta property="og:image" content="https://k2infocom.com/og.png">Try It Yourself
Edit the code below and click ▶ Run to see your changes live.
Live Editor
✎ Editor
👁 Preview
❓ Quick Check — Chapter 20
Which meta tag makes your site mobile-responsive?
📄 Chapter Summary
- Add charset, viewport and description meta
- Use Open Graph for social previews
- Set the canonical URL
- Write SEO-friendly page titles