Website Design Process

Following are the general steps we take to create a website. Depending on the scope of the project, the entire process may take anywhere from a few days to few weeks.

  1. Requirements Gathering

First, we like to hear what the goals and intended audience are for the website.

  • Is the goal to market a company, sell a product, educate, or entertain?
  • To whom is the site targeted, e.g., CEOs, young couples, or students?
  • How fast are target users' connection to the Internet, and what screen resolution are they likely to be using?

Answers to these questions go a long way toward determining the content and organization of the site. Another key part of website planning understands where the client organization is coming from in terms of branding. I like to see what communications materials have been produced in the past (brochures, previous websites, annual reports), and hear what's been effective. What visual elements should be carried through to the proposed website, such as a logo or color palette? Do branding elements not even exist yet, and need to be created from scratch?

  1. Information Architecture

Information architecture can be thought of as creating the "blueprints" for a website. It's critical to establish the scope, structure, and navigational scheme for a site before graphic design issues. The two main deliverables out of this process are a navigation map (also known as a "site map" or "flowchart"), and wireframe document.

The navigation map is "tree" diagram that shows the hierarchical structure of the site-what the main content divisions are and how "deep" the site is.

A wireframe is essentially a sketch of each key page in the site. It shows the navigational scheme (links and buttons used to move around the site), general content scope, and how these elements are prioritized and positioned in relation to each other.

Jump to Landing Page...!

  1. Graphic Design

In web development circles, graphic design is technically known as "the fun part." Using the information architecture deliverables as guidelines, the graphic look and feel of the site is created.

1Elements such as page layout, colors, fonts, illustration, photography, animations, and navigational graphics are all addressed in this phase of the project.

1I usually begin by creating different home page treatments. While all treatments share the same content (as established in the information architecture process), they will differ in areas such as layout, color, and imagery. However, all treatments will be consistent with the client's established branding guidelines. I may also mock up an interior (second-level) page for each treatment. The client selects one of the design treatments with which to proceed. Sometimes, the chosen approach ends up being a combination of two treatments

  1. Production and Programming

The last step before website launch is putting it all together. All of the individual pages--and the code (HTML, CSS, JavaScript, PHP etc) that makes them work are produced. For dynamic websites back-end programming (such as database development or secure purchasing system) is done and tested.

All of the deliverables listed above from information architecture documents to the final working website are publish it to the live public server.

  1. Website Maintenance

To keep a site fresh, it should be updated on a regular basis. While some of our clients prefer to handle updates themselves, for others we continue to perform maintenance well after initial launch. These updates are usually billed on an hourly/weekly/monthly/yearly basis.

Jump to Landing Page...!