Sikau

HTML · Day 16 · about 25 min

The head

Titles, meta tags and how pages appear in search and shares.

Before anyone visits

Long before someone sees your page, they see its title in a search result or a link preview in a chat. The <head> controls that first impression — plus how the page behaves on phones.

What goes in the head

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Momo House · Fresh dumplings in Patan</title>
  <meta name="description" content="Steamed and fried momo made fresh every morning. Open daily 10am–9pm.">
  <link rel="icon" href="/favicon.ico">
  <link rel="stylesheet" href="/styles.css">
  <meta property="og:title" content="Momo House">
  <meta property="og:image" content="https://momohouse.example/share.jpg">
</head>

The rest of this lesson

  • Link previews with Open Graphexplain
  • Titles and search resultsexplain
  • Which title is better?predict
  • What each tag doesmatch
  • Your turnwrite code
  • Badge quizquiz
  • What you learnedrecap

Continue this lesson free — run real code in your browser

Continue with Google

See all 17 lessons of HTML