Joy Of Code - Web Design Training and Consulting
Joy Gems Newsletter

Think Before You Code

By Bud Kraus
bud@joyofcode.com
Joy Of Code
Creator And Instructor

v2 i14
Originally Published: September 14, 2007

To some web site creators, developing the ideas behind their site before any web pages are ever made, might seem obvious. But for others, such might not be the case. For those, the message is clear: Think Before You Code. Before you make that first .html file, there is much you need to do.

Way too often one runs to Dreamweaver (or other web page maker) and starts building a site long before the essentials of the site have been addressed. That's a blueprint for disaster.

Why do I advise "Think Before You Code?" The success - or lack of it - of a web site is set before any web page file is ever saved. I am convinced that the more time you spend in the development and pre-production of your site, the less time you will spend in its design and production. Being organized and thinking through your web site design is a faster path to launching it - and a less expensive one as well.

Web site design and production is a lot like producing a movie. On your first day on the job, do you go out and shoot your first scene? You better not!!

Many heart aches and budget troubles can be avoided if you follow some of these ideas I have discovered, usually the hard way.

1. Know Thy User

Of course this goes to what is the primary objective behind your site. Are you serving seniors , teens, security moms? (But can you make one site that's good for all? I say yes.)

2. Test Your Ideas

Take navigation, for example, arguably the most critical element of any site. Do not start by making web pages and seeing how the navigation works. Rather, try using note cards, each representing a web page. Arrange them in a hierarchy with the home page note card at the top, and succeeding pages (note cards) below as you'd make for a flow chart. Now you can see how the site will run even before you ever make one web page. Don't like how something will work? Just move the note cards around.

Everything, like navigation, should be tested before any page is made.

3. Build A Solid Template

The first page you should ever make is a template. This is usually a typical page layout that serves as the format of most - if not all - of your pages (except the home page which, in most cases, is unique to your web site). A finished template is a web page that you will use to make all of your site's pages. It is in the XHTML and CSS format with embedded and background graphics as needed.

Perfect the template. Streamline the code by getting rid of the tag soup you're probably making as you go along. Validate your code to check for mistakes.

(Another approach is to write your CSS file first. Of course, I don't recommend this unless you know CSS well and have an excellent understanding of layout and typography.)

Once you've got a perfect template, only then should you start thinking about building your site's pages.

4. Last But Not Least: Develop A Production Methodology

On this I could write forever because I am a true blue process person.

Not only should you develop a process to produce your deliverables but, if you are serving as a Project Manager/Producer, you need to articulate the process by which the site is to be made to everyone - client and design team.

You do have an articulated development, design and production process, don't you?