Big Picture #2:
- She clicks and goes somewhere else you want her to go.
- She clicks and gives you permission to follow up by email or phone.
- She clicks and buys something.
- She tells a friend, either by clicking or by blogging or phoning or talking.
ThatÂ’s it.
If your site is attempting to do more than this, youÂ’re wasting time and money and,
more important, focus.
A Web page isnÂ’t a place the way Starbucks is a place. A Web page is a step in a process.
The steps on the stoop in front of your house understand (if steps understand anything)
that they exist in order to get you up or down. If you asked the architect what any
particular step is for, she wouldnÂ’t hesitate. The answer is obvious. The purpose of this
step is to get you to the next step. ThatÂ’s it.
So whatÂ’s that Web page for? What about this one?
It seems really simple, doesnÂ’t it? ItÂ’s not. ItÂ’s not simple because many Web pages are
compromises, designed to do three or six or a hundred different things. HTML is a
powerful tool, constantly misused by people who believe that just because they can do
something, they should.
So bear with me for a moment, and pretend you have a Web page that does just one
thing.
And that it leads to another page that does just one thing.
And soon (as soon as possible), your Web pages lead people to do the thing you wanted
them to do all along, the reason you built your Web site in the first place.
OK, so what do we get out of that? Well, its very important in the
pre-design part of the process to be completely sure what the site is
supposed to do. Then, break it down into pages, what should our viewer
do next?
I recommend writing this out on a separate piece of paper:
Page Title: ______
Viewer response:_________
Content on page:_________
Notice how I think about the response before the actual content of
the page. Once you have figured out you goals, you can then think about
the criteria.
Here are the goals of the web site we will be designing:
- Create a site that can be easily revised
- Create a site that provides useful information and tools
- Create a site that encourages users to return
- Create a site that allows two-way communication with the community
We will be identifying what specific tools will be added on to this
site later. Obviously ones that involved communication will be
emphasized. Based on these goals, I have come up with the following
criteria.
- Fast browser load times
- Browser Compatibility
- Professional look
- Accessibility
- Design to web standards
- Interactivity
Let’s look at these one at a time.
1. Fast browser load times
The biggest single reason visitors do not stay at a Web site is that
it takes too long to load – that is the time it takes for the page to
appear on the computer screen. The site needs to be designed around the
premise of ‘loading’ as quickly as possible. This issue is important
for this site as most users connect with dial-up which is especially
slow (compared to broadband).
To achieve this we will ensure a strong text base for the pages
(text loads very, very quickly). When photographs are used, we will
tailor them to be the appropriate size and structure to ensure that
they load within an appropriate timeframe. From a technical standpoint,
the sites will be designed with Cascading Style Sheets (CSS) in order
to further minimize the date being received.
2. Browser compatibility
Let’s take a look at what browsers people are actually using:
Gecko-Based Browsers (AOL-Compuserve, AOL for OS X, Camino, Firefox, IBM for OS/2, Mozilla, Netscape 6+, etc.) | ~10% |
KHTML-Based Browsers (Konqueror, OmniWeb 4.5+, Safari, etc.) | ~2% |
Microsoft Internet Explorer IE5 or lower | ~3-4% |
Microsoft Internet Explorer IE6 or higher | ~80% |
Netscape 4.x | <1/2% |
Opera | ~1-2% |
Source: http://www.upsdell.com/BrowserNews/stat.htm
I don’t try too hard to accommodate IE5 or less. It represents only
a small fraction, and adds significant complications to the CSS coding
through hacks (more on that later). You might think that this runs
counter to any philosophy of accessibility, and you might be right.
Besides, what are you doing using IE5 anyway?
3 Professional look
A professional “design look” is critical in how a web site is
perceived by the user. A study conducted by a non-profit research
group, Consumer WebWatch found that the leading factor about the
credibility of a site was “Design Look” (cited by 46.1% — the largest
percentage by a factor of almost 2). A siteÂ’s credibility is a major
factor in how much they use the site and how much they would return to
it.
4. Accessibility
We discussed this in the last article, we want the site to be fully
accessible to all. This requires additional attention is paid to the
design and structure of the site. The Web Accessibility Initiative
(WAI) (http://www.w3.org/WAI/) describes accessibility:
“Web accessibility means that people with disabilities can use the
Web. More specifically, Web accessibility means that people with
disabilities can perceive, understand, navigate, and interact with the
Web, and that they can contribute to the Web. Web accessibility also
benefits others, including older people with changing abilities due to
aging.
Web accessibility also benefits people without disabilities. For
example, a key principle of Web accessibility is designing Web sites
and software that are flexible to meet different user needs,
preferences, and situations. This flexibility also benefits people
without disabilities in certain situations, such as people using a slow
Internet connection.”
5. Design to web standards
Designing a web site to standards means having a site that will
benefit the greatest number of web users while ensuring the long-term
viability of the site itself. This means that a site can be viewed in
an array of browsers, or other Internet devices such as PDAÂ’s. The World Wide Web Consortium
(W3C) is the international organization that develops web standards,
directed by Tim Berners-Lee the inventor of the World Wide Web.
When I think about it, to me meeting web standards for design
essentially means separating content from presentation with Cascading
Style Sheets. One advantage of the CSS-based layout is its flexibility
— the content can be accessed regardless of the type of browser that is
being used. It allows sites to work on many kinds of devices instead of
just the personal computer.
Other advantages include:
- smaller file sizes and faster page loads,
- less bandwidth usage
- faster development and maintenance,
- easier to redesign.
It is worth noting that the design principles contained within
accessibility and web standards also lead to sites that are more
usable. Along with credibility, usability is a major factor in why
viewers return to a site.
6. Interactivity
Without interactivity, a Web site is purely a book online.
Interactive sites capture user details online and monitor what users do
inside the system. The more visitors can interact and ‘do things’ on
the site, the more likely they are to revisit. Using a content
management system allows the easy integration of many interactive tools
such as:
- forums
- newsletters
- polls
- media galleries
- event calendars
- document managers
All of these allow varying degrees of user interaction with the site.