Back to course

Lesson 36: Essential Meta Tags for SEO and Social Media

The HTML Masterclass: From Zero to Web Developer

36. Essential Meta Tags for SEO and Social Media

Meta tags, placed in the <head>, provide crucial information to search engines and social media platforms about your page content.

36.1 Description and Keywords

  • description: The short summary displayed in search engine results. Crucial for click-through rate.
  • keywords (less important today): A list of related keywords.

html <meta name="description" content="Learn HTML from scratch with 40 detailed, beginner-friendly lessons."> <meta name="keywords" content="html, web development, coding, beginner">

36.2 Canonical Tag (Avoiding Duplicate Content)

If the same content exists at multiple URLs, the canonical tag tells search engines which URL is the 'original' or preferred version.

html

<link rel="canonical" href="https://www.example.com/preferred-page-url">

36.3 Open Graph Tags (Social Media)

These tags control how your links appear when shared on platforms like Facebook and LinkedIn.

html

<!-- Title shown in the link preview --> <meta property="og:title" content="The HTML Masterclass"> <!-- Image shown in the link preview --> <meta property="og:image" content="https://example.com/img/social-share.jpg"> <meta property="og:type" content="website">