Building a template file:

Jorge Blanco
Webmaster

Other articles written by this author

Related Articles

+ Build your own website from scratch
+ Define a site in Macromedia Dreamweaver MX

Related Links

Little Boxes
W3Schools HTML
W3Schools CSS

Building a template file.
By Jorge Blanco

Introduction

First of all, in case you still don't know, a template file is the base to construct multiple web pages that share a common layout, content distribution, colors, etc. It's the cast, the mold from which all the pages related to it will be built. Using a template file you can cut your developing time in half by reusing the code and not retyping it. A template file can be as easy or as complicated as the developer needs it. In here I will show you how to build an easy, yet useful template, step by step. If you are wondering how it will look like, here is the finished product, and a page developed from it. So let's get to it right away.

NOTE: For this tutorial you will need to have a basic understanding of HTML coding and also some knowledge of CSS styling. If you don't fully understand these topics visit the Related Links section at the left.

Here's a quick list to all the steps:

STEP 1: Setup - Just start the program and prepare it for coding.
STEP 2: Startup Code - Basic code to start the template.
STEP 3: Layers and Layout - The layers are the foundation of our layout, they are first stated here.
STEP 4: CSS Styles PART I - The first CSS code, used to position the layers properly.
STEP 5: Basic Elements - A minimalist approach to what can be added to this layout.
STEP 6: CSS Styles PART II - Just to add the necessary formatting styles.
STEP 7: Final Product - Put everything together and voila!

<Previous Index Next>