09 October, 2007

Internet Librarian: Monday: New Rules of Web Design

New Rules of Web Design
Jeff Wisniewski - Maintains University of Pittsburgh Website.

Look at the assumptions surrounding Web Design, and which are still true and which may not be accurate for today's web environment.

Design is an Inexact Science!
Working with web design now is fantastic because there are many questions that are answered currently through decades worth of research in usability, credibility, interface design, and HCI.

Simplicity Rules - Simple is best -Is this true?
  • Google is a single purpose website; not the best model for a site with multiple functions.

  • Rich & Interactive, Personalizable websites are available out there.

  • Rich and interactive is probably a better choice than the religion of simplicity. Nielson - "the time of simplicity is over"


Content is King - Design matters ALOT

Research suggests that novice users judge superficially, and very quickly based upon the design and they will carry with them a negative or positive halo based upon the site design and will be likely to overlook usability issues if the design pleases them. Professional design equates to credibility for many users.

Content is Created Equal
  • Some content is more equal than others

  • Design for what your users are most likely to be doing on your website.

  • Nielsen - "emphasize the highest priority tasks so that users have a clear starting point." - Look at what people are actually doing on your website and arrange them accordingly.


2/3 of all users, regardless of various site interfaces, are coming to look for electronic resources.

Number thoughts:
Rule of Seven - Number of containers of information that people can focus on.
While evidence can point towards, there is also evidence that points the other direction as well. This is a rule, not a guideline.

3 Click "Rule"
This is not a relevant rule anymore. Design for SCENT; Users will happily click so long as they feel they are on the right path.

Design for 800x600
NO: Design interfaces should be optimized for 1024x768. More users are accessing with larger monitors.
Think about other platforms - iphones, handhelds, and use CSS properly and use the CSS media types for Handheld.
Flexible as opposed to fixed design - percentage based rather than an absolute is probably useful.

Colours
Majority of users browse with 24-bit color rendering - "We are not sure hor important this is now, since most computers today have the ability to displays millions of different colors" - WC3 Schools.
The More color information you embed in an image the larger the file size - so optimize images for the web.

For Redesign Inspirations...
Standards, conventions, and user expectations are established OUTSIDE of library land... see also Jacob's Law - What are users experiencing in general?
Jacob's Law says users spend most of their time on sites other than your website!

How often do we re-design?
Re-design is a constant process.
Iterative, evolutionary change is there - sites such as Amazon, EBay, etc, do not change dramatically.
Revolutionary Change is disruptive to users and should be avoided as much as possible however sometimes a tear down is required.
A/B testing - Testing one version of the page or another, i.e. does a heading work better than another heading, is the federated search box better to the left of the page or to the center of the page. Post one and track usage and then post the other and track usage - only the one element should change.

Follow your own conventions
Name things as they make sense to users - Reference might be 'Ask-a-Librarian' both real and virtual; Establish usable connections and use terms regardless of media.

Follow Established Web Standards and Conventions
  • "Home" link

  • Clickable banner

  • Contact us Link

  • Placement of Navigation.


Greater Bandwidth
Keep in mind that users are still impatient and there are still non-traditional devices on relatively slower networks such as an Apple iPhone.

Support all browsers
  • For all basic content... YES!

  • Accessibility is critical and right thing to do.

  • For value added content, style, and interactivity? (AJAX, FLEX, video content, etc - do these need to be accessible in all browsers? - Yahoo uses Graded Browser Support: Grade A browser user supports all content, Users with an older browser might not get all of the Value Added content, although the meat of the site is backwards compatible)


If content and presentation is separated, there is no need for a text-only version of the home page.

Anything at the top of the page is usually ignored: Banner blindness.
Nielsen: "People have a tendency to never look at a slim rectangular area that's above the page's main headline"
Links placed at the top of the page are redundant - don't put anything unique or mission critical into that spot.

Pop-up Windows:
These are likely be blocked by default so don't put anything mission critical into a pop-up window. Information about databases, for instance, placed into a pop-up might not be the best place for them.

Flash is Evil
Flash introductions are evil.
Flash can be used for effective animation and interactivity - is not evil if implemented correctly!


Mouseover menus: Raise usability considerations.

Opening links in a new browser window: Tell people that you're opening a new users! Content that is not web native, such as PDF, Word, Powerpoints, etc are excellent options for this.
With tabbed browsing, this is less of an issue.

Scrolling
Users scroll if there is a clue that there is something below the scroll.
Content is staggered so there is a visual clear that more information is available.
76% of users scrolled - a good portion of them scrolled all the way to the bottom, despite the height of the screen.
http://blog.clicktale.com/2006/12/23/unfolding-thefold/

Images of people
Increase trust
People, labeled, Increases credibility the most!
If they're really good looking users tend to think they're stock models/advertising


Questions from the Audience
Would you Alert Your Staff to A/B Testing?
Yes, probably, depending on how evil you feel!

Do pop-up blockers block javascript?
It would depend upon how someone has their pop-up blockers set.

What are your favourite websites?
CSS Zen Garden
Google Labs

Links will be available at the Internet Librarian Website for the presentations/powerpoints.

No comments: