A Very Basic HTML5 Template

In the previous tutorial, we created a very simple webpage that displayed only one (short) line of text.
With a little cleanup, it can be used as a template for future projects.

Most of what we saw in the previous tutorial was the bare bones structure you need for an HTML51 document.
Stripping out the title and text we are left with:

<!DOCTYPE HTML>
<html>
  <head>
    <title></title>
    <meta charset="utf-8"  />
  </head>
  <body>

  </body>
</html>

Use this as the starting point for the next few projects. As we learn more, the framework will expand and become a little more complex. Nevertheless, it is good enough to start with for now.
The technical term for this is boilerplate code. You should understand what it does, but there is no need to write it every single time you create a new webpage – just copy & paste.
Save it as a file. I suggest putting it in a directory called templates and calling it basic-html5.html. Then when you want to create a new HTML file either:

  1. copy the contents of the file into your new file
  2. open the file, then Save as the new file you want to work on (this one is a little riskier because you might forget and overwrite your template file by accident).

It’s a good idea to make the template file read-only – if you know how. You can always search for instructions.
Reusing code or using templates is common practice in programming.


  1. This tutorial series is about HTML5 and not other versions. I may point out differences between different versions, but that is not my main focus.