Join 18,800+ Readers

The 5 Foundation Stages in Web Design

by brantwilson

on November 20, 2010

in Tips

Learn how to earn $125 or more per hour as a freelancer - Click Here
Looking for hosting?. We recommend MediaTemple for web hosting. Use Code MTLOVESDESIGN for 20% off

This articles will help you understand how you can take your clients through the entire process of making a new web site. This is a general article which will help anyone understand the basic steps involved in web design. We hope you use it as a quick reference if you are just beginning on your web design skills.

The 5 Foundation Stages in Web Design

The process of creating a web site involves various design and development stages, from the initial gathering of the information to the actual creation of the pages and ultimately keeping the site updated with relevant fresh information. The fine tuning of these steps will vary depending on individual preferences, but the basic stages remain the same. They include – information gathering, planning the site, designing the site, the development of the pages, quality checks and finally maintenance.


1. Information Gathering

The initial step to making a successful web site is gathering relevant information. You need to keep certain things in mind to help define the look and feel of the site. The first thing you should do (and it is also the most important) is to get a good understanding of the company that the site is going to promote. This involves getting to completely understand the company’s business goals, and how a web site can be utilized to help the company get closer to those goals. Here are some of the questions a good designer may ask his or her clients:

  • What is the purpose of having a web site? Are you looking to simply be informative, or are you promoting your services or selling your products on the web?
  • What end goal do you hope to reach, with the help of the site? Usually this would include making more profits, or simply sharing information.
  • Are you aiming at a niche group of users who could help reach the goals of the company? Try and picture this niche group, or even one ideal user of the site – the age, sex and interest of this ideal group can help you design the site better.
  • What information would the audience be looking for on the site? Maybe information on how they can order a product?

2. The Planning Stage

After stage one you have certain information in hand, which you will use in the stage two. Now you would need to design a site map. The site map is nothing but a list of basic topics and subtopics that need to go up on the site, which serves as a blueprint to help design the site. You will use this to create a site where navigating is easy and simple. Of course you need to keep the target audience in mind when actually designing the pages. After all, the end user is the person who, along with others from the group, will eventually decide on whether the site provides sufficient information on a service or product – and maybe then go ahead and place an online order! To put it in a nutshell, a good user experience is essential. During this planning stage, you also need to decide what technologies could be incorporated into the site. Interactive forms, flash animations and audio files are a few technologies you may need to put into the site.

3. Design

Using the information that you have gathered so far, you would now need to decide on the feel of the web site. ALWAYS keep the target audience in mind when planning on the design. If you were designing a site for kids, for instance – it would need to look very much different from a site where the end users are to be chartered accountants! You get the point! You will need to keep in mind the company logo, or maybe even their color scheme.

Next, you would want to make mock designs to show the client. 2 or 3 jpg files of what the final site could look like is a great idea. Clients love to be involved and updated throughout the design stages, so they can make suggestions on the look and feel of the site. Needless to say, an open line of communication between the designer and the client is imperative at this stage. A few discussions, a few exchanges of ideas and a little tweaking here and there can make the difference between a satisfied client and one who is not!

4. The Development Stage

This is where you start to actually make the web pages of the site. You need to use all the graphic elements from the approved mock design, and put them into functional web pages. Usually, a designer would first work on the home page of the site, after which a basic shell is created for the inner pages. The shell is nothing but the template, and it has the navigational structure of the site. Once this shell is ready, you need to simply put in relevant information on the pages – text, flash, audio, images and so on. It is good to keep the clients involved in the development stage. Let them see the different pages of the site as they are created, so they can advise on tweaks and changes as you go along. As far as technicalities go, the front end of the site involves the writing of apt XHTML and CSS codes which complies to current standards, maximizing usability and accessibility to as large an audience as possible.

5. Delivery

This is the final stage of the development process. You need to quality check the site end to end. test out the complete functionality of the site, all forms included, as well as last minute compatibility issues on different browsers. A good designer keeps himself abreast with current design standards and all technologies incorporated into the site. As a part of quality checking the site, the designer needs to ensure that all codes created for the site are validated. A valid code simply means that the site meets current web standards. It is important to keep this in mind when looking for bugs such as compatibility across different browsers.

Once the designer gets the final approval, it is time to deliver the site and probably get paid! A File Transfer Protocol (FTP) is usually used to transfer or upload the web pages from a server. Most designers would also offer domain name registration services, while some stick to the design aspects alone. Once the pages are uploaded, the site is put through a final run-through. This is simply a precaution to ensure all files have uploaded successfully from the server, and full functionality is evident. Now the site would be available to the public!

6. Maintenance

So your job is done with? No! One strategy to ensure that users return to the site at periodic intervals is to offer them fresh information from time to time. A designer can therefore remain involved with the maintenance of the site. Apart from just updating information on the site, the client could also want to seasonally add or remove entire pages. Maintenance is less of an ordeal when compared to creating a site from scratch, so designers usually offer subsidized rates for maintenance services. If information is all that needs to be updated, the company may require access to a CMC, or content management system, which helps them change content (not design but only information), on the site. the CMS is nothing but a back end system where changes are made, and these changes reflect on the front end of the site. Further, a lot needs to be put in to ensure that the site shows up in relevant search engines. There is again, a specialist’s job and something that most clients would not be able to do on their own. Search Engine Optimization, or SEO is an area of expertise by itself, and most major companies have an SEO specialist on their own payrolls, as well as dedicated designers of course. So, the maintenance of a site eventually requires the involvement of a designer.

So, designing a site is one thing, and ensuring it shows up in relevant searches on search engines; quite another. SEO specialists, design specialists, hosting services and content specialists all work together to maintain a successful web site. When a team of dedicated professionals work together, the site works as it should! Moreover, the client may well have the adequate skills to take on responsibility of a certain maintenance segment, say for instance content writing, which is an ideal scenario for the client to stay involved with keeping the site alive and updated.

Final Word – All said and done, the client and the web designer need to work very closely together to make a truly successful and effective web site. Communication needs to be open, and a healthy work relationship is crucial to both parties if they are to walk away from the project with a sense of accomplishment. When communication is substandard, the end result is substandard, period!

Have you applied the above process? Feel free to share your experiences in the comment below.

Powered by Shutterstock

About brantwilson

Brant Wilson is a staff writer for the DesignMag network. Brant enjoys all things design and development, dogs, and candy. Brant is passionate about training freelancers. Learn how you can earn $125+ freelancing. Start learning for free now! Connect with Brant on google+