More Web Design Tutorials

Website Design Battleplan

October 22, 2013

do it yourself web design

Building a website can be a daunting process … there is a lot to do. And sometimes, it’s hard to figure out where to start!

No worries though, after nearly 20 yrs experience, I’ve figured it out for you.

The steps:

1. Diagram the site:
Create a hierarchical map of the website. This will allow you to properly plan out all the pages and as an added bonus, the main menu for the website becomes easy to map out.

No need to use any special software … just a pen and paper will do! Draw boxes (that represent web pages) and connect them with lines that represent the links between pages.

2. Create the Content:
Write out the content (text only) for each page in the site diagram. Be sure to include sub headings and sections on the pages. You can use any simple text editor (MS Word, Apple Pages etc …) to do this.

3. Usability:
Once you have the websites content in place, it’s time to look at how you can rearrange the order/placement of page elements … to make it easier for people to find things.

Hint: logical menus can play a big role in this. So again, the quickest way to get this going is to draw out your pages on paper.

4. Design:
With the first three steps complete, you are ready to consider the design/look of the site. Though the design phase of the process is largely about making your site look good, a lot of consideration for usability has to be kept in mind – be sure that the design does NOT get in the way of how easy the site is to navigate.

In the PDF attached to this blog post I’ve included a couple of images that I was too lazy to link embed directly here.


If you want to learn much more about web design, you may want to check out my popular training package: Complete Web Designer