Sign In Sign Up

HTML Head

When you’re piecing together a webpage, the stuff you see—like text and pictures—lives in the <body>. But there’s a quiet hero working backstage: the <head> tag. It’s not flashy—it doesn’t show up on the screen—but it’s where all the setup happens. Think of it as the brains of your HTML file.

So, what goes inside <head>? It’s a little grab bag of essentials. You stick it right after the opening <html> tag, before <body>, like this:

<html>
<head>
<title>My Awesome Page</title>
</head>
<body>
<p>Hello there!</p>
</body>
</html>

That <title> inside? It’s the simplest thing <head> holds—it names your page. Open that file in a browser, and “My Awesome Page” pops up on the tab. Small but mighty!


But <head> can do more. Here’s what I’ve tinkered with myself:

  1. <meta> tags: These are like secret notes. One common one is <meta charset="UTF-8"> — it tells the browser to handle special characters (like é or ©) right. Without it, you might get weird symbols instead.
  2. <link>: This hooks up stuff like stylesheets (we’ll get to that later).
  3. <script>: For adding JavaScript, if you’re feeling fancy.
<head>
<title>Learn HTML</title>
<meta charset="UTF-8">
<meta name="description" content="Best Learning tutorials for HTML and web development">
</head>

That description? It’s not visible on the page, but search engines might snag it to show under your site’s link. Cool, huh?


I’ve learned this the hard way: skip <head> or mess it up, and your page feels half-baked—tabs unnamed, characters jumbled. It’s not the fun part of coding, but it’s the glue that holds it together. Next time you start a file, toss in a <head> with a <title> at least. It’s like naming your kid before showing them off!

← HTML Quotations HTML Favicon →

How-To Guides for HTML

No How-To Guide is available right now.
View All

Keep Learning & Level Up!

Enhance your HTML skills with our in-depth tutorials and interactive quizzes.

Explore HTML Quiz