| Testing your Websites for Usability

1. Using a re-direct link action to automatically
re-direct web users from an old URL to an new URL
- Here is the code for this aciton, which should
be placed in the head tag of the weblink that
you want to re-direct:
<META HTTP-EQUIV="Refresh"
CONTENT="0;URL=http://artinbethany.topcities.com/">
- See an example of two webpages that have a
simple re-direct on them:
http://www.colorado.edu/AmStudies/index.html
and
http://www.colorado.edu/AmStudies/index.htm
3. You can change the time the browser pauses
before re-directing the link by setting content
to equal 5, which means five seconds.
- Do NOT wrap this code, very few browsers can
deal with that. Do not wrap this code like this:
<META HTTP-EQUIV="Refresh" CONTENT="0; URL=http://artinbethany.topcities.com/">
Mainly because browsers cannot deal with whitespace
of any sort inside the CONTENT attribute, which
would include the space shown before the end of
the string. So the above should not work except in
ideal conditions, while this works all the time:
<META HTTP-EQUIV="Refresh"
CONTENT="0;URL=http://artinbethany.topcities.com/">
2. Adding video to Flash movies
- See my example of a simple Flash movie that
contains Mpeg video that I shot using my
digital camera: Flashmovie
- Notice that I have put three movies in this
Flash movie.
- I added the movies by first taking out the
sound that went with the movies. I want
to put the sound on another layer in
my Flash movie.
- Notice that I can make these movies
symbols and movie clips and fully
integrate them into my Flash movie
- However, Mpeg movies are very big. Be
careful about putting too long and too
big of a movie in your Flash movie.
- When you add the Mpeg movie into the Flash
movie using the "File menu" and selecting
"import," Flash gives you the option to
reduce the quality and size of your movie
so that it won't make such a big file.
- Notice that I made this movie an Mpeg movie
not a quicktime movie. You can run the movie
in Flash using quicktime, but this makes the
Flash movie a little clunky and dependent on
the Quicktime player.
- On Friday, I will demo a Flash website using
simple mpeg movies to add interest and
action to a Flash movie.
3. Two good books on Designing Web Usability
-
Jakob Nielsen, Designing Web Usability:
The Practice of Simplicity, (New York: New Riders, 2000).
-
Steve Krug, Don't Make me Think:
A Commonsense Approach to Web Usability,
(New York: New Riders, 2000).
- Jakob Nielsen and Marie Tahir, Homepage
Usability: 50 Websites Deconstructed,
(Indianapolis, IN: New Riders Publishing, 2002)
2. What is Web Usability?
-
Jakob Nielsen:
Useit.com (Usable Information
Technology)
"Usability rules the Web....If the
customer can't
find a product, then he or she will not buy it."
"The web is the ultimate customer-empowering
environment. He or she who clicks the mouse
gets to decide everything. It is so easy
to go
elsewhere; all the competitors in the world
are but a mouseclick away."
"The main goal of most web projects should be
to make it easy for customers to perform
useful tasks and satisfy their needs."
What are the top four reasons users come
to a site?
This can be summarized by the acronym "Home":
1) High-quality content
2) Often updated
3) Minimal download time
4) Ease of use
"The Ultimate test of web usability is
to
try to download and navigate a website
using or 28K or 56K modem. It can be
really frustrating waiting more than
30 or 40 seconds for a webpage to
download."
Chris Lewis
3. Jakob Nielsen on Web Usability Surprises for Web
Designers
-
Jakob Nielsen's Useit.com
-
Got
usability- Talking with Jakob Nielsen
-
Nielsen-
Print design vs. Web design
-
Simplicity
is priceless
-
Building
Really Annoying Websites.com
-
Webpagesthatsuck.com
-
Top
Ten Web Design Tips
- As
Simple as Possible
- All Things
Web- The Usable Web
- The Usable Web
- User
Testing Techniques: A Checklist
4. Basic Web Usability Principles
- Example
of a "Suckie" Flash website
- Examples
of 7 Suckie Websites
- Example
of Simple Flash movie banner ad
- Usability comes first even if a site is not trying
to sell anything. Users won't return to sites that
are too difficult to use and don't provide useful
content.
- Remember that sites are "naturally selected"
by
a user's mouseclick. The higher a site's usability,
the more likely users will return to it.
- This Design Darwinism will lead ultimately to the
survival of the most usable sites. High
usability means more users and more sales,
and thus makes sites thrive.
- You should design for all screen resolutions.
Design
resolution-independent pages that adapt to whatever
size screen they are displayed on. This can be done
with variable-length tables.
- Users have different preferences with respect to font
size, so ensure that your designs work well with both
larger and smaller fonts than your personal
preferences.
- Design for "late web adopters" and novice
users. Don't
assume that your users are like you and are
"early adopters."
- Design for the lower common denominator, not
the lowest common denominator. Most major
websites design for the lower common denominator.
- Hold off for a one-year waiting period before you use
the latest technologies on your website. If you use
new technologies, make sure to provide your
content in an alternative format for the sake of
users who have not yet upgraded and, therefore,
cannot use the newest and latest feature.
- Make sure pages download fast. The minimum goal
is to get pages to users in no more than 10 seconds,
because that's the limit of people's ability to keep
their attention focused while waiting.
- Graphics should be kept to a minimum, and multimedia
effects should be used only when they truly add to
the user's understanding of the information. Remove
graphics; increase traffic.
- Be sure that your pages include Width and Height
attributes on all images and table columns. The more
information a browser has the faster it can render a page.
- Links to a directory should include the final slash
in
the URL when embedded in web pages. The slash
should be left out when writing the URL for human
consumption. This decreases download time:
For example: http://www.useit.com/alertbox/
- Use link titles to help users predict what will happen
if
they follow a link. Link titles should be in simple,
plain
text that describes the destination of and the kind of
information available in a link. Link titles should rarely
ever exceed 60 characters. For example: Jakob Nielsen.
<A HREF="http://www.useit.com/jakob/"
TITLE="Author biography"> Jakob Nielsen</A>
- Make sure that you retain the standard color coding
for
links: blue for unopened links and purple or red for
opened links. If you use non-standard link colors,
some users can't determine which sites they have
visited and which sites they haven't visited.
- A firm rule for home page design is "more is less":
the more buttons you put on the home page, the less
users are capable of quickly finding the information
they need.
- If you insist on using frames, then at least provide
a
non-framed version for the many users who prefer
to avoid frames.
- If you use frames, make the frame borders invisible.
Users don't need to know how the design is implemented.
The design either works or it doesn't.
- One of the main goals of a great website is to establish
your credibility as a professionally run operation. Don't
fill your page with amateur junk like heavy backgrounds
and flashy animated gifs.
- Because a lot of users print out webpages that they
want
to read carefully, make sure you provide printable
versions of any long documents. Optimize the layout
for
easy printing by making it no bigger than 8.5 by 11 inches.
- Simplicity should be the goal of page design.
Users come
to a site not to focus on its design but on its content.
- Remember, going to a website is an experience.
If your
site is hard to use and users have a bad experience, then
users won't be back.
- Make sure that all pages work on two-year-old browsers
and two-year-old versions of all plug-ins and other
software.
- Web users scan text and pick out keywords, sentences,
and paragraphs of interest while skipping over those
parts of the text they care less about.
- Be succinct. Write for scannability. Use
short
paragraphs, subheadings, and bulleted lists. Use
links to split up long information into multiple pages.
- Start each page with a conclusion. Present
the most
important material up front, using the so-called
inverted pyramid principle. Readers should be
able
to tell in a glance what the page is about and what
it can do for them.
- Use "pull quotes" to add visual interest to
the page
and help users scan the page to pick out the parts
of the story that may interest them.
- Use hyperlinks to point to secondary arguments or
in-depth examples. Remember, chunk long articles into
shorter hypertext pages.
- For people using search engines, your page only exists
in the form of a title. Unless the title makes it absolutely
clear what the page is about, users will never open it.
- Titles do not need to be grammatical sentences; they
need to be more in the nature of billboard slogans.
Limit titles to between two and six words, or between
40 and 60 characters.
- Almost all text should be left-justified. Also,
remember
that small text is more readable in sans-serif typefaces
such as Arial and Verdana.
- No matter what multimedia technologies you use, it
is best to stay at least one year behind the evolution
in the play-back software.
- In general, it is best to minimize the use of animation.
Also, never make animations loop indefinitely. Almost
all users hate moving text and scrolling marquees.
- The web is an attention economy where the ultimate
currency is the users' time. What do they look at,
where do they decide to stay, and where are they
going to return to at a later date.
- From a usability perspective, website design is more
challenging and usually also more important than
page design.
- The first immediate goal of any site's home page is
to
answer the questions "Where am I?" and "What
does
this site do?"
- The most prominent design element on the home page
should be the name of the company or the site.
- Navigation interfaces need to help users answer the
three fundamental questions of navigation:
1) Where am I?
2) Where have I been?
3) Where can I go?
- The first rule of navigation is to include your site's
logo on every page, and make sure that it is placed
in the same spot on every page.
- Make your pages relatively short and make sure
that the most important links will be visible on most
common monitors without any scrolling.
- Limit your use of "within-page" links (bookmarks
anchors) because users expect links to take them
to a different page.
- Because underlining now has a strong perceived
clickability perception, it is best not to underline any
text that cannot be clicked.
- It is rare for users to spend more than a few minutes
at a time at any given site. Users often jump from
site to site. Because of this rapid movement, users
feel that they are using the Web as a whole rather
than any specific site.
- Usability studies show that slightly more than half
of
all users are search-dominant, about a fifth of the
users are link-dominant, and the rest of users
demonstrate mixed behaviors.
- If you plan to create an internal website search
capability for your site, make sure you use focused
and highly descriptive keywords in your META
tags for each page.
- The most important component of a URL is the
domain main. If users can remember your domain name,
they can at least get to your home page.
- Mobile access will be the third "killer application"
for
the internet, after e-mail and web browsing. So make
sure your web pages scale and work on many different
sizes of display.
- Remember, people read differently online, so writers
need to change their writing style. The rules of good
writing are a little different on the web.
- What are the top four reasons users come to a site?
This can be summarized by the acronym "Home":
1) High-quality content
2) Often updated
3) Minimal download time
4) Ease of use
- The web is not print. And a home page is not a
magazine cover. Don't simply repurpose print
and magazine materials onto the web.
- Always test your websites for usability by asking
your friends and users to "test your site for
usability." Is your site easy to use and full
of
useful, current content and information?





|