How to use this template

Using this template is very simple. It's simply a case of using the Photoshop template included in the directory, saving the image and modifying a little bit of XHTML to make it work.

A quick example:
When making a new header we need to give it a unique #id before we apply the image to the background. Say we wanted a new header named "How the west was won". We would start by putting in a <h1> tag to hold the header. We do this like so:

<h1>How the west was won</h1>

If we loaded the page now it wouldn't show anything. This is because we need to give it a special ID. We do this like so:

<h1 id="westwon_h1">How the west was won</h1>

We then need to create the image. Unfortunately it requires Adobe Photoshop to use the template but you can make your own image in any software package you like. Save this in the "/images/headers/". Save it as a GIF (transparent background), PNG (transparent background) or a JPEG with the background colour of this page.

We then need to pop in a small piece of CSS into the stylesheet.css file. Open it up and add onto the end:

#westwon_h1 {
background-image: url(images/headers/westwon_h1.gif);
}

The # icon in the CSS stands for the ID in the XHTML document. #westwon_h1 is simply CSS' version of id="westwon_h1". Simple.
Your document should now fully function. For the rest of your website simply edit the <p> tags with the text of your choice. If you are unsure of what to change or modify in your code head back to this page and copy/paste the code to make it easier.

A quick example of popping in a paragraph under the header:
Simply wrap any text you want in the paragraph with <p>Put your text inbetween here</p> and then every time you want to put in a line break within the paragraph insert <br /> at the end of the line within the <p> tags (see below).

<h1 id="westwon_h1">How the west was won</h1>
<p>There's a lady who's sure<br />
All that glitters is gold<br />
And she's buying a stairway to heaven.<br />
When she gets there she knows<br />
If the stores are all closed<br />
With a word she can get what she came for.<br />
Ooh, ooh, and she's buying a stairway to heaven.</p>

Welcome to Zero One Hundred Web Design

We here at Zero One Hundred pride ourselves on fresh designs (obviously), standards compliant websites (capable of viewing in ANY browser) as well as clean semantic code developed by hand in high complex web design applications (mainly notepad++) and to top it all off, accessable sites which even the UK Government would be proud of.

Have a flick through our pages, paying close attention to things such as our contact page (so you can speak to us) and our latest portfolio projects.

Established way back in the Fourth Crusade (1203), Zero One Hundred is one of the oldest and most predominant web design companies in the world.

We have built systems and drawn up designs for high proflie clients such as Alexius IV and Alexius III (both PHP projects) aswell as designing the logo's they wore on their chests during battle.

Latest News

  1. Zero One Hundred lands record breaking deal with the National Aeronautics and Space Administration (NASA) which could send Zero One Hundred CEO into space....
  2. Bring back Mr Blobby online petition and website started by Zero One Hundred, commisioned by Noel Edmonds.
  3. Zero One Hundred hires fifteen new employees. Chief of Design Robert Bigfoot, an in house promotion was chuffed with his new employees....