Laying Out an HTML Page

What We'll Be Building!

In the last section we said all web pages are made using HTML and those HTML pages are made up of HTML tags. We'll now look at the way all your HTML pages will look when you first create them.

Every HTML page uses the same basic, as shown in layout.html.

The version of html being used is specified in the <!DOCTYPE> tag, followed by a set of html tags that wrap all other tags. They also have a head tag and a body tag, that hold the website's settings and content respectively.

layout.html
<!DOCTYPE html>
<html>

    <head>
        <title>My Blog</title>
    </head>
    
    <body>
        Hello World!
    </body>

</html>

Your HTML page can be more complicated but at the very least this is what it will look like.

The Tags Used

  • <title>

    • The name of your page

  • <html>

    • Everything inside this tag is part of your HTML page

  • <head>

    • This contains important information about your page

  • <body>

    • This contains the content of your page

The DOCTYPE tag tells the web browser what version of html you're using. <!DOCTYPE html> just means you're using the latest version available.

Exercises

  1. Create an html page using the example above as a reference. Name it layout.html

  2. Change the title tag of your page to anything you'd like. Refresh your page and see the result.

Last updated

Was this helpful?