1

Wireframe Prototype Results:

Findings from Walkthrough

and Online Survey

at Annual Conference

July 6, 2007

Report to

the American Library Association

2

Overview - Process

• Walkthrough was performed using the wireframe prototype

developed by UserWorks.

• The walkthroughs occurred on June 25 and 26, 2007, at the

ALA Annual Conference.

• Two participants walked through the wireframes

simultaneously, with a usability specialist moderating.

• A total of 34 participants evaluated the prototype:

– Involved members (12)

– Uninvolved members (11)

– Nonmembers (11)

• An online survey was conducted simultaneously

3

Overview - Findings

• Overall response was fairly positive

– Not as much as was hoped

– But encouraging — site is moving in the right direction

• Participants/respondents made some specific comments

and suggestions

• The findings led to numerous recommendations for design

improvements

The following slides present the findings and

recommendations.

4

Participants liked seeing that they would be searching within ala.org

Utility Navigation

Participants thought that the items above the

search bar were appropriately located and labeled.

They made three comments:

• Dislike the term “giveALA”

• Find FAQ helpful

• Expect to find the sitemap here

Left Navigation

Participants liked having left navigation that

expanded and collapsed as they went down or up

(respectively) in the site structure. Some likened it

to a table of contents.

Participants thought that the bullets and

indentations clearly distinguished different levels of

information. They raised three issues on the

headings:

• Some participants thought Education and Jobs

should be separated.

• Some were unsure what would fall under

“Library Issues” and “Professional Resources.”

• Some observed that “Shop ALA” was a verb

while the other items were nouns.

Search

Participants liked seeing that they would be

searching within ala.org. Some wanted the search

more prominent.

They generally liked the location and content of the utility navigation items

They liked the expanding and collapsing navigation that appears along the left side of every page

On the whole, participants thought the left menu items were clear, concise, and comprehensive

Global Navigation (1 of 3)

5

Quick Links Bar

Participants were unsure why these particular items

were used on the top bar, which items were

dropdowns, and why the items were at different

levels.

Participants stated that they wanted to see the

most relevant and important items (Divisions and

Member Services) on the left.

Hardly anyone recognized “I Love Libraries”.

Many found the name “Washington Office”

confusing.

Several participants did not recognize “American

Libraries,” and some wondered whether it might

refer to a list of all libraries in America.

Most participants liked “Recommended Reading”

but some were unsure whether it referred to

professional recommended reading or to book lists

for readers of different ages.

The idea of making this row customizable as part of

the login or MyALA was discussed.

Participants liked the “text size” feature; some

commented that it was especially good for the

aging librarian population.

Participants were unsure about the meanings of several items in the quick links bar.

They liked the breadcrumbs, which show where they are and how to get back

They wanted some of the items moved to the beginning of the list.

Many liked being able to change the text size.

Global Navigation (2 of 3)

6

Dropdowns

Participants were unsure which items in the quick-

links bar were dropdowns and which were not.

They wanted the names of the Divisions spelled

out.

Some didn’t like having the dropdown menu cover

other page content. Participants weren’t sure what was a dropdown and what wasn’t.

Global Navigation (3 of 3)

They wanted the names of the Divisions spelled out in the dropdown.

Breadcrumbs

Participants liked having breadcrumbs to help them

know where they are within the site.

Some commented that the breadcrumbs show the

path they’ve taken to get where they are, but this is

usually not how breadcrumbs work.

They liked the breadcrumbs, which show where they are and how to get back

7

Recommendations for Global Nav (1 of 2)

Utility Navigation

Add a link to the site map.

Consider changing the name of “giveALA.”

Left Navigation

Reconsider separating “Education” and “Jobs”; at

the least, change it to “Jobs & Education”.

Look into clarifying “Professional Resources”.

Consider changing the name of “Shop ALA”.

Consider adding an explicit expand/collapse

mechanism for menu items, similar to that of

Windows Explorer or of Mac OS. This would allow

people to expand a menu item without going to the

page, and to expand more than one item at once.

Consider changing “Library Issues” to “Issues and

Legislation”; put the link to the Washington Office

at the level below it.

Change “Education & Jobs” to “Jobs & Education” or separate the topics

Change the name of Shop ALA to a noun

Add a link to the site map.

Revise the title of “Library Issues”; consider changing it to “Issues and Legislation”

Clarify the name of “Professional Resources”

8

Recommendations for Global Nav (2 of 2)

Quick-Links Bar

Review the content, names, order, and use of

dropdowns for the quick-links bar items.

Move “Divisions” and “Member Services” to the left

end to give them higher priority.

Make it clear that “American Libraries” is ALA’s

magazine.

Consider making dropdowns for “Member Services”

and “Recommended Reading.”

Consider making the quick-links bar customizable as

part of MyALA.

Consider changing “I Love Libraries” to

“ILoveLibraries.com” to show it’s a Web site.

Use an indicator to show which items are dropdowns.

Spell out the names of the Divisions. Put the acronyms first, to make them more distinguishable and recognizable.

Move the most important items to the beginning of the bar.

Consider adding a menu to “Recommended Reading” and changing the name to “Book Lists”.

Italicize “American Libraries” or enclose it in quotation marks to show that it’s a publication.

Dropdowns

Provide a visual distinction between items that are

dropdowns and those that aren’t.

Spell out Division names, and include acronyms at

the beginning of the items to make them visually

distinct and make scanning easier.

9

Mission

Participants thought it was important to explain ALA

and offer its mission statement prominently on the

home page. Participants thought it was important to explain ALA and feature its mission statement prominently on the home page.Overall Look

Participants were split between calling it “busy” and

“clean.” A few said they would like to see more

whitespace on the home page.

Right Column

Most participants thought the content in the right column was important for the home page.

Participants expected this content to remain current (upcoming conferences, award winners).

A couple of participants did not like the phrase “Get Involved!”

Participants thought that the right column presented valuable information; some were concerned it is repetitive.

Main (Center) Content Area

Participants liked that the center area changed to display current information. Some were unsure about giving so much space to news and upcoming events.

Suggestions included adding an expandable event calendar icon to “Latest News” and adding a link to “more” or to past “News & Events”

Participants liked that the center content changed to display current info, although some were unsure whether new and upcoming events needed so much real estate.

Home Page

Several participants thought the tag line sounded too much like “Voice of America.”

10

Recommendations for Home Page

Overall Look

Even though some participants thought the look

was busy, graphic design may be able to overcome

that without the need to remove anything. We

recommend deferring this issue for now and

addressing it with graphic design.

Right Column

Ensure that this content remains up to date (upcoming conferences, award winners).

Consider de-emphasizing the phrase “Get Involved!”

Main Content Area

Although some participants were unsure about giving so much space to news and upcoming events, enough of them liked it that we recommend keeping it as it is.

Consider adding an expandable event calendar icon to “Latest News” and a link to “More News” or to past “News & Events.”

Ensure that this content remains up to date.

Change tag line to sentence case: “The voice of America’s libraries”

Mission

Change tag line to sentence case, to reduce

confusion with the Voice of America.

Keep the news section as it is, and ensure that it content is salient and current.

11

Common Features of Lower-Level PagesMain Content Area

Participants generally felt that when additional

information was available, the page should link to

it.

Many prefer to have links in lists rather than in line

with the text.

Some want the “Showcase” items on specific

pages rather than at the top level.

Some participants thought that “Showcase” items should appear on deeper, more specific pages.

Participants thought that this area should contain a representative item from each section.

Secondary Content Area (right

side)

Participants expect this content to be targeted to

the specific page on which it appears.

When the page is at a high level, they want the

secondary content to include items from multiple

subtopics.

They want to see links to details of items that this

area highlights.

12

Recommendations for Common

Features

Provide links to items that are covered elsewhere.

Main Content Area

Ensure that all items that are covered on other

pages have links to those pages.

Where appropriate, present links in lists rather

than inside the paragraph text.

When the text mentions content that is addressed

elsewhere with more detailed information,

provide a link to that content.

Secondary Content Area

Ensure that this content is relevant to the page on

which it appears.

When the page is at a high level, include items

from multiple subtopics as appropriate.

Where these items highlight content that is

detailed elsewhere, provide links to it (even if it is

outside ala.org).

Where relevant, use lists (e.g., “Top Ten”s) in this

space.

Reserve “Showcase” items for specific pages.

Where appropriate, present links in lists.

Make sure to use a “title”attribute for accessibility of links with short or duplicate link text.

13

Awards“Awards” Navigation

Participants thought that the four topics under

Awards were clear and comprehensive.

Some disliked the word “governance.”

Main Content Area

Participants wanted more links on this page (e.g.,

children’s book lists, Lippincott Award).

A few felt that a link to “scholarships” would be

appropriate on this page.

Some thought the “Showcase” items should

appear on more targeted pages.

Participants thought these categories broke up the awards section successfully.

Participants thought that “Showcase” items should appear on deeper, more specified pages.

Participants thought that this area should contain a representative item from each section.

Secondary Content Area

Participants liked that some of the “premier

awards” such as the Newbery and Caldecott

Medals were accessible from this page.

Some wondered why this area did not include

other premier awards as well.

14

Participants were not sure that this was the best breakdown for these awards.

Participants expected to see the premier “Professional Recognition Awards”in this area.

Library & Professional AwardsMain Content Area

Participants expressed doubt that the breakdown

shown here is the best one for this content.

Secondary Content Area

Participants expected the special area in the upper

right to show the premier awards for its category.

15

Recommendations for Library and

Professional AwardsMain Content Area

Conduct further analysis to study the

decomposition of this content.

Revisit the categorization of this content.

16

Main Content Area

Participants were confident that the categories

under “book and media” cover all awards.

Some participants expressed doubt that

“reference” and “adult” belong together.

Some were unsure what would be listed under

“Articles, papers and research.”

Participants were mixed about the categories under “Book and Media”

Participants liked the content in this area, although they wanted links too.

Secondary Content Area

Participants felt that the secondary content

areas were most appropriately filled with lists,

ideally “Top Ten”s.

Participants thought that anything present in

the secondary content area should be

annotated and linked.

Book and Media Awards

17

Recommendations for Book and Media

AwardsMain Content Area

Consider separating “reference” and “adult”

books, if it can be done without changing the

structure of ALA’s awards program. If not, at

least clarify the category.

Separate these two or clarify the category.

18

Main Content Area

Participants expect to find a comprehensive list of

awards at this level of the site.

Participants expressed a desire to have a printable

list or brochure available from this page. (e.g., a PDF

document)

Participants wanted a link to a printable list of all awards.

Secondary Content Area

This area of this page needs to include the

Newbery and Caldecott Medals.

Children & Young Adults

19

Main Content Area

Participants liked the navigation in the main content

area.

Participants expressed a preference to see links

displayed in lists rather than embedded in text.

A few participants were not convinced that

“Education” should be coupled with “Jobs.”

Others felt that “Jobs” was more important than

“Education” and should therefore be displayed more

prominently on the page.

Some participants commented that they liked the

way the navigation was arranged according to the

career life cycle.

Education & Jobs

Participants thought that categories under “Education & Jobs”worked very well.

Some participants thought that Education and Jobs should be separated; others thought that Jobs should be more prominent.

20

Recommendations for Education & JobsMain Content Area

If “Education” and “Jobs” are retained in the same

category, make “Jobs” the more prominent part of

the content.

If “Jobs” is kept in the category with “Education”, make it more prominent.

21

Participants liked the content on this page.

Participants were split on how best to display the schools.

Main Content Area

Participants thought that the amount of contextual

text beneath each navigation link was ideal.

Participants liked seeing the “Alphabetical List of

Institutions” but felt that the list is probably too

long to put in the secondary content area.

One participant mentioned that it would be nice to

be able to search for library schools by region (in

addition to state).

Secondary Content Area

Library Degrees & Programs

22

Very

DissatisfiedDissatisfied

Slightly

DissatisfiedUndecided

Slightly

SatisfiedSatisfied

Very

Satisfied

0 0 1 0 10 23 0

Q: Based on what you have seen in the wireframes, how would you rate your overall experience or lasting impressions?

These ratings (numbered 0-6) are encouraging:• Mean = 4.6 (between slightly satisfied and satisfied)• Mode = 5 (satisfied)

However, there is room for improvement.

Overall Satisfaction Findings

23

Survey

• Implementation

– Wireframes were presented at two kiosks during the national

conference

– After browsing through the wireframes, people were given the

opportunity to complete a short survey about their experience

• Responses (194 collected during the conference period)

– 94% were from ALA members

– 57% are active members within ALA

– Well over 50% visit the site at least monthly

Survey Questions

• Were any terms unclear to you?

• Did the wireframes make it apparent how to find content?

• Were there any major topics that you did not see?

• Was there anything about the wireframes that you found

confusing?

• What aspects of the wireframes did you like the most?

• What aspects did you like the least?

• Do you have any additional comments or suggestions?

24

25

Survey Results

• Largely positive (rated good or very good)

– Organization and layout (80% good or very good)

– Ease of navigation (77%)

– Amount of content on each page (56%)

– Labels used in left navigation (72%)

– Labels across the area just under the ALA logo (62%)

• Respondent comments were consistent with walkthrough

findings

26

Were any terms unclear to you?

• “I love libraries” (8)

• Acronyms for divisions (3)

• “Washington Office” (2)

• “American Libraries” (2)

• “Professional resources” (2)

• “ReadWriteConnect” (1)

• “Library Issues” vs. “Advocacy” (1)

• “giveALA” (1)

27

Did wireframes make it apparent how to

find content?

• Positive

– Categorization of awards (2)

– Breadcrumbs (1)

• Negative

– Too much information on page (6)

– Should be one click for job listings (3)

– Took too many clicks (2)

– Separate education and jobs (1)

– Need clear links to state credentialing organization (1)

• Unclear whether positive or negative

– Better distinction between levels on left nav (1)

28

• Committees and roundtables (14)

• Divisions (5)

• Site map (2)

• International relations (2)

• www.librarycareers.org (2)

Any major topics that you did not see?(1 of 2)

29

Any major topics that you did not see?(2 of 2)

• Additional items (mentioned once each)

- ALTA

- Librarians

- Scholarships

- Book reviews

- MyALA

- How to join

- Advocacy

- Publications

- Local libraries

- Info about ALA

- ALA Midwinter 2008

- Get involved

- Trustees

- Marketing and PR tools

- Other ALA offices – e.g., IRO, OIF

- Certification for non-MLS staff

30

Anything about the wireframes that you

found confusing?

• Too crowded (9)

• Split between horizontal and vertical navigation frames (4)

• Links on navbar weren't “equivalent” (2)

• Organization categories (2)

• Divisions (1)

• Too many images (1)

31

What aspects of the wireframes did you

like the most? (1 of 2)

• Clean layout (31)

• Easy navigation (29)

• No scrolling necessary (9)

• Modern looking (5)

• Links to divisions (5)

• Choices on left navbar (4)

• Right side highlights (4)

• More information on each page (3)

• Breadcrumbs (3)

• Top navbar is single row (2)

32

• Additional items (mentioned twice or less)

What aspects of the wireframes did you

like the most? (2 of 2)

- centered

- dropdowns

- small graphics

- unified graphics

- text size adjuster

- smaller left navbar

- detailed submenus

- interactive options

- more information at top level

- jobs listing on first level

- combined side and top navigation

- easy-to-see search box

- removed big red ALA logo

- library technician information

- better for the visually impaired

- less "newsy", more specific

33

• Too cluttered (13)

• Difficult navigation (4)

• Blogs, wikis, online communities too far down (2)

• Dropdowns (3)

• Not enough pictures (2)

• Too wordy (2)

• Too much repetition of how to join ALA (2)

• Didn't notice right highlights box (1)

• Top navigation column choices (1)

• Prominence of useful items too low (1)

What aspects of the wireframes did you

like the least?

34

Additional comments/suggestions

• Allow customization (4)

• Have shorter URLs than current site (4)

• Be fully accessible to disabled (2)

• More info about events (1)

• Have pictures of real librarians (1)

• Allow users to print more easily (1)

• Use more Web 2.0 features (1)

• Focus on serving current members (1)

35

Summary of Survey Findings

• Survey results were largely positive

• Respondents made some specific suggestions

• Site design seems to be moving in the right direction