Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Making your site easier to use, an in-house usability testing case study


Published on

Published in: Technology, Design

Making your site easier to use, an in-house usability testing case study

  1. 1. Making Your WebsiteEasier to Use: AUsability Testing CaseStudyJason Samuels, IT directorAllison Wickler, web contentmanager
  2. 2. National Council onFamily Relations2• Established 1938• Publisher of the Journal ofMarriage and Family• 3,400 members
  3. 3. NCFR Website - 19383
  4. 4. NCFR Website - 2000• Multicolor HTML tables!• Provided updates on theorganization’s majorprogram areas• Provided online registrationfor membership renewaland conference registration4
  5. 5. NCFR Website - 2006• Look and feel of thewebsite had evolved• Lots more informationposted about all aspects ofthe organization• Still just a brochure website(though a large one)5
  6. 6. NCFR Website - 2011• Built on Drupal (ContentManagement System)• New features include:– Professional ResourceLibrary– Degree programs guide– Conference schedule builder– News feed & event calendar– Blogs6
  7. 7. NCFR Website - 20117The 2011 NCFR website wasintended to move ourorganization’s web presence frombeing a brochure website to beinga go-to place for resources andinformation about the field that weserve.
  8. 8. NCFR Website8• Launched in February 2011 with 3,500nodes of content– (~ 1,500 of these were faculty listings for thedegree programs guide)• By December this number had more thandoubled
  9. 9. April 2012 website survey9• What do you like most about the NCFRwebsite?– quantity and quality of resources• What do you dislike most about the NCFRwebsite?– trouble finding specific resources– difficult to navigate• What features or improvements would youlike?– clearer organization of the content– greater ease of use
  10. 10. 10Time for some usabilitytesting
  11. 11. Optimal Workshop• Recommended by our webdevelopers• Offers 3 testing products– OptimalSort (card sorting)– Treejack (sitemap testing)– Chalkmark (click tracking)• Cost is $109 per month perservice (unlimited use)11
  12. 12. What is sitemap testing?• Strips out all layout andgraphics, only shows yourmenu choices• Presents the test taker witha series of questions, asksthem where they wouldnavigate to find them• Simple as that12
  13. 13. How to conduct a sitemaptest131. Audit your web content2. Produce a draft of the new sitemap3. Setup the testing software4. Invite participants and test5. Analyze results6. Revise sitemap7. Test again8. Analyze, revise, and test one more time9. Implement!
  14. 14. Web content audit• Spreadsheetdetailing your sitecontent• 1st column:numbering system• 2nd column: title ofthe page or section• 3rd column: URL14Template adapted from Content Strategy for the Web, by KristinaHalvorson
  15. 15. Draft a new sitemap• Add a column forthe new location• Can hide URLcolumn if thathelps• Re-arrange items• Pro tip: use aseparate columnfor each menulevel15Template adapted from Content Strategy for the Web, by KristinaHalvorson
  16. 16. Setup the testing software16• Can specify when the survey closes (date ormaximum number of responses reached)• Paste in your sitemap tree– If each item is in a different column, thesoftware will recognize this and structure itaccordingly• Add tasks for users to complete, andchoose the “correct” answers for each– Keep it reasonably short, 20 tasks = ~10minutes• Customize welcome message, instructions,look, colors and post-test questions
  17. 17. Invite participants17• Recruitment - e-news announcements,discussion listservs, and personal appealsbrought in ~160 volunteers• Notification – everyone got a notice whenthe test opened, and a reminder a coupledays before it closed• Incentive – everyone who completed thetest was entered into a drawing for a $50Amazon gift card. Got ~110 responses perround.
  18. 18. 18Analyzing Results:It’s all about the Pietrees
  19. 19. Pietree example # 119
  20. 20. Pietree example # 120
  21. 21. Pietree example # 121• Result: 91% Direct Success, 6% IndirectSuccess, 3% Failure• Analysis: Erika believed that this questiontested successfully, and we agree.• Testing Action: Remove question fromtesting round 2.• Recommendations: Place a "Join NCFR"promotion tile on the "About Us" page, anda "Join Now" button on the membershiptypes page to capture the segment ofpeople who went to those sections lookingfor this item.
  22. 22. Pietree example # 222
  23. 23. Pietree example # 223
  24. 24. Pietree example # 224• Result: 4% Direct Success, 8% IndirectSuccess, 88% Failure• Analysis: I think most of the answers arelegitimately good answers. Im not sure why"Family newswire" is the only valid answer listed.• Testing Action: Re-work this question and testagain.• Recommendations: The intent was to getpeople to a section where news from the field(not from NCFR is posted). The question was notwell-phrased to be clear, but the menu item mayalso be better off with a clearer title.
  25. 25. Big lessons25• Based on the answer patterns we learnedsome big lessons– Our users look for resources everywhere on ourwebsite, so we did more to prioritize them– Nomenclature is terribly important. Avoidambiguous menu titles, and be careful not toname multiple items in a way that seems likethey lead to the same thing– Sometimes there’s just going to be a split. Gowith the one that got the bigger share, but makea note to link there from other high-percentagechoices
  26. 26. Iterate26• Revise the sitemap based on what youlearned from the test results• Replace questions that tested well• Rework questions that tested poorly• Each test completed in a 5-day window• 4-5 day turnaround to the next test• Completed 3 testing rounds in a month
  27. 27. 27Deep breath:Take your time, do it right
  28. 28. Take your time, do it right28• In our case the web developers neededtime to design and build a revised layout• Allison worked on the spreadsheet formonths, tweaking titles and sitemapstructure while using the test results asher guide
  29. 29. 29Ready, set, launch!
  30. 30. Launch!30• Because of the extent of our changes, allof the work was done on a staging site• Two-week content freeze: refrain fromupdating or double-key in staging• On launch day our developers copied thestaging website over the live site
  31. 31. NCFR Website - 2013• Cleaner design• Fly-out menus assistnavigation• Homepage highlightsenterprise areas• Resources throughout, butalso consolidated in library31
  32. 32. 32Questions?