Lately I’ve been working on a design for a site that I plan on launching on March 1st. Initially I just wanted to get something on screen so I could have something to work with. The problem was, when I stepped back and looked at the site, I didn’t like what I saw. The goals of the site weren’t being addressed properly, the design wasn’t my best work, and the overall layout wasn’t going to work with the design and content I wanted in the site. This got me thinking about the steps I normally take when I build a new website. I quickly jotted down my design process from start to finish and I realized I had skipped a few vital steps.
1. The first step in the design process is to meet with the client. You need to get from them a good understanding of what their website will be used for. You need to determine what the purpose of their site will be and who will be seeing it. It is impossible to build an effective website if you don’t know the goals of the site. Next, you need to get the content they want on the site. This makes it possible to decide how many pages they will need, what pages they will need, and an estimate of how long it will take you to create the site. With the site that I am currently working on I don’t have a client. I’m the owner of the site and that means I need to decide what the goals will be and how I want to present them. Fortunately I’m not the only one working on it and I have great people helping me decide what the main goals of the site should be.
2. Once you know the purpose of the site and have the content, the next step is to create a rough draft of the site with the goals in mind. What I like to do is get a pen and make a few thumbnail size sketches of what the site should look like in my notebook. It’s much easier then creating the design on the computer and if you don’t like it, you can always make a new one because it only took you 30 seconds to draw out the sketch. Once I create a design that I like and that meets the needs of the site I transfer my sketches onto the computer and decide what colors and fonts to use. I’m not that great with graphic design but once I make something I like I can begin with the next step.
3. After the design is complete it’s time for me to bring out my notebook again. For me the development process includes hand-coding the CSS, XHTML, and PHP. In the design step I used my notebook to draw sketches of the site and for the development process I like to use my notebook to draw how the site will be laid out. I don’t go into as much detail in these drawing. They usually consist of box drawings where each box represents a div or span tag. These drawing are easier because I already know what I want the site to look like and are mainly used for me to see what the code should look like in order to make the design work for the site. Throughout the development process it is also important to check your code for validity and browser support. I don’t think your code needs to be 100% valid but it should be close. Too often I spend an hour trying to get the CSS to work in one browser and when I finish I find out it doesn’t work in any of the other browsers. Constantly check for browser support so that your site will work well for anyone who views your site.
4. The last step before launch is to double check. Check your site to make sure that all forms work correctly, for spelling errors, bad links, incorrect title tags, validation, and all the little details that subtly contribute to a great design.
5. Once you’ve contacted the client, created the design, written the code, and double checked the site for errors, your site is ready for launch.
This process is different for everyone but the basics are the same for most freelancers. Before you do anything you need to know the sites goals and then word on designing and developing the site. Throughout the process you will need to maintain contact with the client (if you have one) and agree on a price for your work. Meeting with the client could be added in between each step because it is important to keep them informed. What are the steps you take when designing a website and how often should you contact the client?
Make sure to check back on March 1st to find out about the site I will be launching!