How To Create A Website Template

On the following pages you'll learn how to create a website template with a step by step tutorial.

You'll be able to easily customize the colors and styles to suit yourself, and you'll get the knowledge you need to make your own custom web site template. Then when you build a web page all you have to do is plug in the content, the page title, description, and keywords.

What You Need In A Website Template

If you have a five page website, making changes to every page isn't too bad. If you had 50 pages and you decided you didn't like the headline size and colors you'd have to think twice about changing them. It would be a mammoth task. What if you had 250 pages?

Or what if you wanted to put a notice on every one of those pages?
"5 Day Sale, 25% off Everything!"

It is possible to make those changes easily, and a good template will let you do that.

Here are some things that I look for in website template.

  • Easy to update navbar (essential)
  • Website navigation easy and intuitive
  • Fonts (color, size, style) for headlines and body text easy to change
  • Page colors easy to change
  • Header graphic easy to change
  • Easy to change the footer
  • Easy to add an ad, notice etc to every page

Laying Out Your Template

There are a couple of ways to create a website template. The more sophisticated way is to use Cascading Style Sheets (CSS) to lay everything out, but that is really for experienced web designers. There are still issues with web browser compatibility with CSS too. The latest browsers are pretty good, but there are still people using old browsers that can't use all the CSS commands.

I don't layout web pages with CSS, but my wife is a computer programmer, and she does. I think using cascading style sheets for the layout is a bit complicated for someone new to web design who just wants to get their business on the net.

Important Note: When I wrote the above it was true, and for a non-professional it was easier to build a website with tables than try to work with the idiosyncrasies of CSS. And yes, a website built with an HTML table layout still works fine.

But now it is easier to work with CSS tables. I am currently (October 2013) rewriting this tutorial using the latest CSS methods to make a website that is completely up to date and that is mobile and tablet friendly.

Sign up for my newsletter to be notified when the new tutorial is ready, or subscribe to my RSS feed (look below the menu).

Using Tables To Create A Website Template

The other way to lay out web pages is to use HTML tables, and that is very common. Creating a website template using tables is well within the capabilities of a newbie web site builder.

Use A Combination Of Tables and Style Sheets

I prefer to get the best of both worlds and use a combination of HTML tables, cascading style sheets, and virtual includes. It's a bit more complicated than plain HTML tables, but it is so easy to update and make changes to all your pages at once that it is well worth the extra effort.

The CSS can let you change font styles, font size, color etc, plus background colors, table colors, whether the table is centered or not, and a lot more.

With virtual includes you change the navbar, the header and the footer on every page easily, plus easily add an ad or notice or whatever on every page.

Web Page Software For This Tutorial

There is a lot of software you can use to create a web page template, from writing the code yourself with a text editor like WordPad, to buying an expensive high end program like Dreamweaver.

For this tutorial I'm using KompoZer, a free wysiwyg web page editor, so anyone can download the software, copy exactly what I'm doing, and learn enough to modify the template to suit themselves. KompoZer has a built in CSS editor, and it is quite good enough to build a complete website.

If you use other software, the actual commands will be different but the concept will be the same, so you'll still get a lot from this website template tutorial.

Next page: Step by step overview of the web template tutorial

Pages In The Template Tutorial

Return from How To Create A Website Template to Building A Website home page