Erica Gamble Advanced Web Design Doctor K.

Marek 18 March 2011 Website Usability Study The Plan To practice critiquing websites based on universal usability guidelines and Jakob Nielsen's Ten Usability Heuristics, I selected the LocalHarvest (localharvest.org) metasite a directory to other organizations products and/or websites. I chose this website because I have used it once to order looseleaf tea and was curious to find out how they organized other products and information on the site. The homepage (see Appendix A) features a lot of good and unique information, but seemed a bit disorganized and I did not completely understand why until conducting this study. In order to conduct each survey in a consistent manner, I used the handout with a usability Test Script from Steve Krug's Rocket Surgery Made Easy to fashion a script (see Appendix B) that I would read to each of my participants (P1, P2, and P3). My three study participants were to complete three tasks that I designed by exploring the LocalHarvest website. The three tasks are: 1) Find beeswax candles under $5.00; 2) Find chamomile tea from Owens Acres; and 3) Find the dates of the FamilyFarmed EXPO in Chicago, IL. Finally, I created a Response Questionnaire (see Appendix C) with open-ended questions that encourage participants to comment on: ease of website use, website design layout, and the usefulness of site features.

Usability Heuristics The LocalHarvest website tries to sort and display their content in too many different ways and tries to fit too much information into too little of a space. Looking at a screenshot of the homepage in Appendix A, anyone can see that there is a lot of information on this page, but the small font size and 60% screen width prevent me from freely enjoying the exploration experience the shopping page is 1

Gamble better for that because of the many thumbnail images for products with descriptions. The following paragraphs provide a brief critique of the LocalHarvest website based on Jakob Nielsen's Ten Usability Heuristics: Visibility of system status is the first rule and LocalHarvest addresses this item by allowing users to subscribe to the LocalHarvest Newsletter (published monthly), the Keep Me Posted emails

sent weekly after March, and speaking from personal experience when I placed my order for looseleaf tea they immediately notified me via email that my order had been placed; then a few hours later, they informed me that my order had been shipped from Owens Acres farm in California! LocalHarvest has a seemingly efficient email system and people can also visit them on Facebook and Twitter. Match between system and the real world is the second rule that is used to gauge whether the website's language matches the language of site visitors. The initialism CSA is thrown around quite a bit. Users can subscribe to CSA programs, but the link only says subscribe; people may click without knowing what they're getting into. New membership for farmers and other users is linked to at the top of each page, but these links are not appropriately distinguished from each other. I mistook the featured item advertised in the top left corner for the website's logo, so I largely ignore that section of the sidebar. LocalHarvest misses the Aesthetic and minimalist design rule due to the broad range and large quantities of information on each page. The map on the homepage and most other pages leads the user to a list of local organizations, but does not locate specific products from the Shop categories the Shop pages are the most unique pages viewable to visitors via the search engine. User control and freedom is not too much of an issue because the user can click the back button or the Home button at anytime while browsing the website. Flexibility and efficiency of use is not really an option on the LocalHarvest website, meaning that they do not remember user preferences or allow for profile or homepage customization; in contrast, websites like Netflix remember user preferences and makes recommendations based on previous choices.

Gamble Consistency and standards on the LocalHarvest website are not labeled and organized so that new users can easily find and relocate information. For example, product categories have been organized in a way that is logical to the website creators and frequent visitors; store categories may be as specific as Christmas Wreaths or as broad as Garden. Some categories have hundreds items in them, so unless users remember exactly how they sorted and scrolled through category results, they may not be able to relocate information found earlier during the site visit. An additional confusing

feature - browsing the store categories and using the search box lead the user to different search results. Finding consistent search results seems to require a small learning curve, which speaks to the website's Recognition rather than recall. Experienced users must browse and sort products as if it were their first visit to the LocalHarvest website. Help users recognize, diagnose, and recover from errors is something that the LocalHarvest website does relatively well. For example, errors usually occur when entering an invalid value into the search box. If a search fails, the user is taken to a page that suggests the user try typing their search query again or zooming out on the map; it is more difficult to locate specific items with both of these suggested options and much easier to attempt to logically browse through store categories using the sidebar to the left of the error message. If the user is repeatedly attempting to find results via the search box, then error prevention on the LocalHarvest website is not the most helpful. If the user is simply browsing through links and sorting through results, then they will encounter few errors (if any) because the website's links all seem to be working well. Finally, help and documentation is present on this site via the Forums tab, but questions are combined with market listings and no FAQ or Help links are obviously visible. Analysis of Findings Initial Impressions Although all three participants (P1, P2, and P3) said initially said that they thought the

Gamble homepage looked nice and cool, no one used any of the links on the homepage other than the top navigation tabs. For example, on each page (that location matters) users can click on a map for a specific region and the map will zoom in and this also refines the results below the map. This is a neat feature, but it is too prominent on the homepage because clicking it leads the user away from home. Everyone was able to identify the owner of the website, but P1 and P3 thought that the website was

more for news, information, and discussion forums. P1 even stated in the Response Questionnaire that the website looks more like a forum than an online store. The Tasks All participants completed the three tasks fairly easily, but there was noticeable hesitation between tasks with P2 and P3. Task 1 (find beeswax candles under $5.00) was finished relatively quickly once participants noticed the Store Categories menu. P2 recovered quite quickly from an error in a search from the homepage because the Shop Categories menu was placed prominently on the left side of the error page. Site users have access to the same menu from the home page, but it is placed in the bottom right corner and goes unnoticed. This product category sidebar should be in the left sidebar spot on every page. P1 found beeswax candles via the Honey/Bee products category, while P3 found the same list candles via the Farm Craft category. When trying to complete Task 2 (find chamomile tea from Owens Acres), P2 and P3 did not see the small tea subcategory sidebar on the right side of the Coffee & Tea category page. P1 found this buried sidebar and quickly completed the task, while P2 and P3 tried clicking through many pages of results. P1 claims to spend between 30 and 40 hours on the internet per week! Perhaps this is why P1 was looking harder for simplifying navigation features. P1, P2, and P3 each completed Task 3 (find the dates of the FamilyFarmed EXPO in Chicago, IL) with ease. All participants intuitively clicked on the Events tab in the main navigation menu and sorted the results using Chicago zip codes.

Gamble Participant Responses Participant comments on the questionnaire (see Appendix C) were primarily positive. P1

mentioned that there was too much green text and that made it hard to read, but I think P1 really meant that the small, cluttered text, links, and images made it difficult to distinguish different content types on LocalHarvest. P3 actually loved the green theme and text and stated in the response questionnaire that the colors are subdued and allude to green and sustainable ideas. Usability Remedies The LocalHarvest site loads quickly because it uses basic HTML and CSS. However, if the website does not remember user preferences, then it must reorganize the Shop Categories and streamline content on the homepage to frequently visited links or popular user tasks to prevent user frustration. Creating a unique tab to a map page where the user can search and sort through different farms or products might be a tidy solution to the large map icon found on many pages. While the map is really cool, it is not useful for finding specific products better for finding farms. The LocalHarvest website also uses a zip code locator, so this map is not even necessary. Homepage clutter could be reduced by organizing lists and other less frequently used links into the tabs. Searching for a product using the product search bar on the homepage only leads the user to the stores which sell these items, rather than their detailed lists (with great images) of the products that the user would find if they selected the Shop tab. While the number of ways that a user can sort farms and products is appreciated, there are too many different lists in different views from different access points that state the same information. Clutter and confusion could be reduced by leading users to the shop pages when entering search terms for specific products, rather than a long list of websites for farms and organizations. P1 noted that the language on LocalHarvest seemed to target a specific consumer (e.g. people interested in farming, farm products, organic products, and/or gardening) and

Gamble mentioned that this may discourage certain people from browsing freely. The category lists in the shop section really threw the participants off. When searching for chamomile tea, their first instinct was to go to one of the two categories that start with the word Herb; however, tea is found in the Coffee & Tea category. Some people don't like coffee, but like tea; and some people like coffee, but dislike tea why group them together? This might be remedied by organizing categories into even broader terms and creating a unique category for tea. Combining

this menu alteration with quantitative reports from Google Analytics would most likely demonstrate the improved visibility of the Tea category. The order of icons and menus changes on each page. Participants tended to hesitate on each new page because they were orienting themselves to the continuously changing order of familiar links and menus. My suggestion to the LocalHarvest web designers would be to choose a location on the page for each navigation block and try to keep this spot as consistently as possible throughout the website. Overall, the navigation of this website is made relatively simple with a few minutes of exploration, but P2 and P3 seemed to read a lot of text to determine where they should click first. This may be caused by content overload on the homepage in cahoots with tiny font size. I would suggest minimizing content on the homepage and expanding the width of the entire website eliminating large, space-wasting margins.

Gamble Bibliography All URLs accessed on 15 July 2011.

Krug, Steve. Sample Usability Test Script. 2009. http://www.sensible.com/Downloads/test-script.pdf. LocalHarvest. http://www.localharvest.org. Nielsen, Jakob. 10 Heuristics for User Interface Design. 2005. http://www.useit.com/papers/heuristic/heuristic_list.html. Participant 1. Live User Study. Survey. 12 March 2011. Participant 2. Live User Study. Survey. 12 March 2011. Participant 3. Live User Study. Survey. 15 March 2011.

Gamble Appendix A LocalHarvest Homepage

Gamble Appendix B Usability Study Script Live User Study Script [] Web browser open to Google Hi, __________. My name is Erica, and I will guide you through this study. Before we begin, I'd like to read some information to you just to make sure I cover everything.

You most likely have some idea about why you're helping me with this study, but let us briefly review. I'm asking people to try using the LocalHarvest website to locate certain products and events. This is only to study the layout and features of the web site as people use it. This study may last up to an hour, so let me know if you need a break at any time. I want to make it clear that I am studying the website, not you. You can't do anything wrong here. In fact, this may be the one situation today where you don't have to worry about making mistakes! As you explore the website, I will ask you to think out loud as much as possible: to say what you're looking at, what you're trying to do, and what you are thinking. This information will be great help to my study. Please don't be afraid to express any frustration, confusion, or feelings of success. Your criticisms will not hurt my feelings. I value your honest reactions! If you have any questions, just ask them. However, I won't be able to answer you right away, since I am interested in how people find things on this site without a helper sitting next to them. When the study is complete, I'll try to answer your questions then. You may have noticed this little sound recorder. With your permission, I'd like to record our conversation. This recording will only be used by me to supplement my notes. This study is confidential and anonymity will be maintained throughout the report. If you would, I ask you to sign this basic permission form for me. It merely states that you are a consenting volunteer and that, with your permission, our conversation will be recorded only for the purposes of this study. [] Give them the informed consent form and a pen. Do you have any questions so far? OK. Before we look at this website, I'd like to ask you a few quick questions. What is your occupation? What do you do all day? Now, ballpark estimate, about how many hours in a week would you say you spend using the Internet, including Web browsing and email, at work and at home?

Gamble What's the split between email and browsing a rough percentage? What kind of sites do you explore when you browse the web? Do you have any favorite websites? Great. Let's start looking at things on the site. [] Click on the bookmark for the site's home page. First, I'm going to ask you to look at the home page and tell me what you make of it: What strikes you about it? Whose site you think it is? What you can do here? What is it for? Just look around and think out loud when you can. You can scroll if you want to, but don't click on anything yet. (3-4 minutes max.)

10

Thank you! Now I'm going to ask you to try doing some specific tasks. I'm going to read each one out loud and give you a printed copy. I'm also going to ask you to do these tasks without using the Search box. I will learn much more about the web site functionality that way. Again, as much as possible, think out loud as you go along. [] Hand the participant the first scenario, and read it aloud. 1. Find a list of beeswax candles under $5.00. [] Allow the participant to proceed until you don't feel like it's producing any value or the participant becomes very frustrated. [] Repeat for each task, or until time runs out (15 minutes total). 2. Find chamomile tea from Owens Acres. 3. Find the dates of the FamilyFarmed EXPO in Chicago, IL. Thanks, that was so helpful! Finally, I'm going to ask you to fill out this response form about what you liked or disliked on the LocalHarvest website. [] Give participant a response form and a pen. Great! Do you have any questions for me, now that we're done? Many thanks again for helping me with this website usability study! Please accept this high-five as a gesture of my sincere gratitude.

Gamble Appendix C After Task Survey Response Questionnaire* Please take a few minutes to think about these open-ended questions about your experience with the Local Harvest website. Your honest feedback will greatly aid my website usability research. How easy was it for you to browse the Local Harvest website? How do you think the design layout of the website could be improved? In your opinion, which features of the Local Harvest website could be improved? Additional comments:

11

*Space between questions was longer on the actual handout, so that participants would be encouraged to write more.