Using HTML5 and CSS to Create a Website

How to Create a Website

Create a Website Template

When creating a website, using a website template will greatly speed and simplify the process.

What is a template?

A web page template or HTML template is a prebuilt web page that can be used repeatedly by copying to create other web pages.

A website template is usually a collection of prebuilt linked pages, which can be used to speed the process of building a complete website.

Advantages of Templates in Website Construction

Using a template:

Our method of building a template page.

We are going to build an HTML web page template using divisions and CSS ( style sheets). We have provided diagrams of several layouts using this method.

These layouts are provided for study purposes.

I highly recommend that you complete our basic tutorials (copy & paste) BEFORE you attempt to build your own template.

Start with Basics of HTML5

Then add columns with Basics of HTML CSS on this website.

CSS

It's amazing what you can do with CSS these days.

You should spend more time learning about it than you do on learning HTML code.

With a majority of designers building fixed width pages with black text on white backgrounds (1980s garb), I sometimes wonder why developers even bother.

Study these lessons in our HTML5 tutorial:
Style Sheets
Class Attribute

Color and Other Things

Read the section on choosing colors for your website.

You should also have any images or logos ready to place on your template page.

We recommend that you build several templates using different color schemes and layouts and then choose the one that pleases you most before you start building actual pages.

You should also explore the lessons on researching web sites before you start adding content to your pages.

You should have acquired your HTML editor by now. If you haven't download one, we recommend the free AlleyCode HTML editor among others.

If you'd like to learn to build websites using the same HTML editor that we use, HTMLPad 2014, download the free trial.

Next Stop

Website Design - Template Diagram