Web usability

Embed Size (px)

DESCRIPTION

Review of the excellent book on Web Usability: Don't Make Me Think by Steve Krug

Citation preview

8Rays

-by Mahesh Karipe

Book Review

Usability ?

An approach to make web sites easy to use

What is Usability?It is an approach to make things easy to use

Web Usability?It is an approach to make web sites easy to use

Web Usability - HOW?

Be consistent

Speak the user's language

Nothing important should ever be more than two clicks away

Don't Make Me Think!!

How do we make sure that a website is usable?

Be consistentSpeak the user's languageImportant things should not be more than 2 clicks away

To put them in ONE sentence

DON'T MAKE ME THINK

Things that make us THINK

For Example take a button

Its obvious that 1st one is clickable2nd one is not so obviousIt is very difficult to say that the 3rd one is clickable

Also, Don't use jargon in the websites

Use most common/simple language

Things that make us THINK

Also, Don't use jargon in the websites

Use most common/simple language

Things that make us THINK

Contd...

Consider a search box:

After all why should I have to think about how I want to search?

Contd...

Things that make us THINK

When you are creating a site, your job is to get rid of the question marks.

Create pages that are self evident or self explanatory

Contd...

Things that make us THINK

How we really use the Web?

Fact of Life #1:
We Don't read pages. We scan them.

Fact of Life #1:
We Don't read pages. We scan them.

FACT OF LIFE # 2 :
We dont make optimal choices. We satisfice.

We dont choose the best option

We choose the first reasonable option

FACT OF LIFE # 3 :
We dont figure out how things work.
We muddle through.

Have you ever seen people typing a URL in search box?

Why don't web users look for best option?

We are usually in a hurryWe have a lot of options (things) over the web

Billboard Design

Create a clear visual hierarchy

Take advantage of conventions

Breakup pages into clearly defined areas

Make it obvious what's clickable

Minimize noise

The more important something is, the more prominent it is.Things that are related logically are also related visually.Things are nested visually to show whats part of what.

Omit needless words
The art of not writing for the web

Get rid of half the words on each page, then get rid of half of what's left

Unnecessary use of long text messages makes it time consuming and irritating.

Be short and precise

Store Navigation

Web Navigation

You are trying to find something

You decide whether to ask first or browse firstSearch-Dominant users

Link-Dominant users

Eventually, if you can't find what you are looking for, you'll leave

Web Navigation

Web Navigation Conventions
Basic Elements

Site ID

Sections

Subsections

Utilities

Page name

Local Navigation

Small text version (footer)

Conventions Evolve over a period of time

Most of them listed here are taken from the print media

Web Navigation Conventions
Persistent Navigation

Set of navigation elements that appear on every page of the site

Exceptions Home page

Forms

Web Navigation Conventions
Site ID

Position:

Purpose:

Site ID is a building name for a website

The most important use is, it lets you know that you are in the same website

Web Navigation Conventions
Sections, Subsections and Utilities

Sections - primary navigation

Subsections - secondary navigation

Utilities important elements that are not part of content Hierarchy

Web Navigation Conventions
A way to Search

AvoidFancy Wording (Ex: Quick Find, Quick Search or Keyword Search etc)

Instructions (Ex: Type a keyword blah blah... )

Options (unless necessary)

Simple: a box, a button, and the word Search

Web Navigation Conventions
Page Names

Every page needs a name

Needs to be in right place

Needs to be prominent

Needs to match what I clicked

Site ID is like a city name

And page name is like a street name

Web Navigation Conventions
You are here

Breadcrumbs:

Just as You are here indicator is present in a shopping mall or a Park

On the web, this is highlighted by navigational bars, lists, menus etc

Put a pointerChange the text colorUse bold textReverse buttonChange button color

Web Navigation Conventions
Tabs

A very good navigational choice

Self-evident

Suggest physical space

Must be:Drawn correctly

Color coded

Always selected

Web Navigation Conventions
Finally

What site is this? (Site ID)

What page am I on? (Page name)

What are the major sections of this site? (Sections)

What are my options at this level? (Local navigation)

Where am I in the scheme of things? (You are here indicators)

How can I search?

If your page is well designed, you should be able to answer these questions

Designing Home Page

Site identity and mission

Site hierarchy

Search

Registration and sign in

Teases

Timely content

Deals

Shortcuts

One should admit that home page is beyond our control

Home page has to accommodate these things

Designing Home Page
Conveying the BIG Picture

Firstly, The home page has to answer these things

Designing Home Page
Get the message - Tagline

Nothing beats a good tagline!

Good taglines:Are clear and informative

Convey differentiation and a clear benefit

Personable, lively and clever

Bad taglines:Are vague

Sound generic

Onthru Local Advertising Made Easy

Designing Home Page
Get the message Welcome Blurb

Make it scan-able

Be precise

Don't use a mission statement

Designing Home Page
User Navigation

The fifth question - Where do I startIf I want to search

If I want to browse

Home page navigation can be uniqueDifferent orientation

Section descriptions

More space for identity (Site ID)

Designing Home Page
Trouble with pull-downs

Pull-downs save space. ButContent is hidden

Hard to scan

Most effective for known names like countries, states or products

Less Effective for unknown list (where we don't know the name)

Designers tend to create more out of the home pageOne approach Is using pull downs

The Farmer and the Cowman should be friends

Who cares if 80% of people don't like pull downs!!!

Pull downs have an advantage and100% of people will like it, if it is used in the right sense, in the right place

The question should be

Does this pull down in this context creates a good experience for most of the people who use this site?

Usability Testing

Focus Group Testing

Usability Testing

If you want a great site, youve got to test.

Testing one user is 100 percent better than testing none

Testing is an iterative process

Select a user from target audienceAllow him to use the website while you are watching it

Usability Testing

Questions ??

Questions are guaranteed in life; Answers aren't.