Lesson 3

Head and Body

Does a website have a body?

Look at all these mirrors – kind of funny looking, huh? These fun mirrors make your body look pretty different from what you’re used to. Some body parts are way bigger or smaller than you’d expect. But every body still has the same basic structure even when they look different.

What are the head and body?

Websites have two main parts – the head and the body – just like we do. Both of these go inside the HTML tag. This tells the computer that the website is made of HTML.

The head is like the brain – it controls the inside things we don’t see.

The body is a lot like a regular body. It’s the part that everybody sees. Just like how our bodies have some basic things required, so do websites.

What are the required HTML tags?

There are six basic required tags for any HTML document:

<!DOCTYPE html>

This tells the computer the document type is HTML. This is the very first tag, and doesn’t have a closing tag.

<html>

This tells the computer the code is starting. It comes right after the doctype tag. It has a closing tag that is always the very last tag in an HTML document.

<head>

This is where all the behind the scenes information goes. This goes inside the HTML tag, and has a closing tag before the body tag.

<title>

This is the name of the website. It goes inside the head tag and has a closing tag.

<meta charset=”utf-8″>

This is the type of language to display. It goes inside the head tag and doesn’t have a closing tag.

<body>

This is everything you can see on the website. It starts right after the head section closes, and includes all the other HTML tags.

The <head> section can include other behind the scenes information, like links to other documents or descriptive information that web crawlers will use to help people find your website.

The body is the fun part – this is where there are so many possibilities. There are no required tags inside the body, so you can put whatever you want in the body section of each web page.

Are you ready to learn?

Oh no! Our HTML tags are all out of order. I need your help putting them back where they belong. Follow the hints in the information above to put these in the correct order.