Wainwright BuildingThis is the first post in a series. Subsequent posts will be linked from here and will dig into these ideas much more deeply.

Much like designing a building, there are effectively 5 major considerations for developing most websites.:

  1. User (who)
  2. Purpose (why)
  3. Content (what)
  4. Function (where, when, how much)
  5. Form (how)

The User and the Purpose

Everything about a website begins and ends with who is using it, and why. All you really need to begin designing a website are two very simple questions:

Who will be using this website?

Why will they be using this website?

There will likely be more than one classification or group of users, and each group is likely to have multiple reasons, but the clear, concise, and pithy answers to those questions are the best guidance you’ll have in designing the site. The better those answers are stated, the easier the rest of the process will be.

More complex sites often serve multiple purposes, but for ease of understanding during early planning it is best to think of each unique purpose as a separate site for design purposes.

Think carefully about who will be using the site, what circumstances will bring them there, what they’ll want at the site, and how you can provide it to them.

The value, or utility of the site, sometimes referred to as the “value add” is what defines the Purpose of the site. It is tied closely to the User that is there to fulfill that Purpose.

The User(s) and the Purpose(s) should be kept clearly in mind as you develop the site and as it evolves over time, but you’d really be best served by getting these two defined as close to perfect as possible before proceeding to the following three considerations. In other words, “Know the Who and the Why before you consider the What, Where, When, How and How Much.”

Content, Function, and Form

These three considerations will be ones you cycle through not only as you develop the site, but later as you maintain it with minor changes, and finally anytime you make major changes or additions.

Content is the actual information that the site delivers or communicates. Text, pictures, links, audio, video, etc. These are the “what” of the website and are the most important consideration for building a site.

Function is how the site works, referring mostly to the major way information is divided into pages, how those pages are accessed, and the means by which the user interacts with the site. In the big picture scheme of this, function addresses issues like how many pages comprise the site, by what menuing system are they accessed, are there search functions, can information be accessed by author or category, are parts available by RSS feed, by what means does the user interact with different content (click, drop-down menus, onscreen forms, etc.) This is the “where, when, and how much” of the site and is extremely important for the usability of the site. We’re concerned here with the ease of finding content, # of clicks required, page length, etc.

Form is how the site looks including shape of the pages, colors, graphics, fonts, sizes, etc. This is often what many people that need to build a site consider to be most important but what in fact tends to be least important. This is the “how” of the site.

A typical site design process might look like this:

Phase 1

  • Content: determine the scope of content, primarily type and quantity
  • Function: complete all functions based on scope and division of content
  • Form: build site shaped / sized for the content and function with little regard to fine details

Phase 2

  • Content: complete content
  • Function: tweak only if/as needed
  • Form: tweak shape / size only as needed to accommodate content, continue to ignore details

Phase 3

  • Content: tweak only if/as needed
  • Function: tweak only if/as needed
  • Form: complete form until ready to go live

It is fair to say, at any stage in the process of building or maintain a site, that the considerations are “content, function, form” pretty much in that order. The saying that “form follows function” gets adapted a bit for website design to “Content is king and form follows function in serving the king.”

That’s enough for now, there will be a lot more to come on this and when it’s available it’ll be linked right here.