Chapter 16: HTML SEO & Metadata

16.1 Introduction

SEO (Search Engine Optimization) helps improve a website’s ranking on search engines. Proper HTML structure and metadata play a crucial role in SEO.

16.2 Meta Tags for SEO

Meta tags provide information about a webpage to search engines.

Basic Meta Tags

    <meta name="description" content="This is a brief description of the webpage.">
    <meta name="keywords" content="HTML, SEO, Metadata, Optimization">
    <meta name="author" content="John Doe">
        

16.3 Title and Heading Structure

The page title and headings should be properly structured for better SEO.

Example of Proper Heading Usage

    <h1>Main Title (H1)</h1>
    <h2>Subheading (H2)</h2>
    <h3>Sub-subheading (H3)</h3>
        

16.4 Semantic HTML for SEO

Using semantic elements helps search engines understand the content better.

Example of Semantic HTML

    <article>
        <h2>Article Title</h2>
        <p>This is an article content.</p>
    </article>
        

16.5 Open Graph and Twitter Meta Tags

These tags improve how your content appears on social media platforms.

Example: Open Graph Tags

    <meta property="og:title" content="Awesome Webpage">
    <meta property="og:description" content="Learn HTML SEO tips">
    <meta property="og:image" content="image.jpg">
        

16.6 Robots Meta Tag and Sitemap

Use the robots meta tag to control how search engines index your page.

Example: Allow Indexing

    <meta name="robots" content="index, follow">
        

Example: Block Indexing

    <meta name="robots" content="noindex, nofollow">
        

16.7 Summary

In this chapter, we covered:

• Importance of metadata in SEO
• Proper heading structure
• Semantic HTML for better ranking
• Open Graph and Twitter tags
• Robots meta tag and sitemap