Head Metadata
📌 Covered in this chapter:
<title> · meta charset & viewport · Description & Author · Robots & Theme Color · Favicon · Canonical URL · Open Graph & Social Sharing
Welcome to Phase 9 (Chapter 23): Head Metadata! Master configuring document metadata inside the
<head> section for search engine indexing and social sharing card previews.
1Complete Metadata Template
HTML — Metadata & Open Graph Template
▶ Run in HTML Editor
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Learn HTML5 step by step.">
<meta name="theme-color" content="#f97316">
<title>HTML5 Masterclass | Our Compiler</title>
<link rel="icon" href="/favicon.png">
<link rel="canonical" href="https://www.ourcompiler.com/blog-html.html">
<!-- Open Graph Social Meta Tags -->
<meta property="og:title" content="HTML5 Masterclass">
<meta property="og:description" content="Learn HTML5 with live code examples.">
<meta property="og:image" content="https://www.ourcompiler.com/og-banner.png">
</head>