Improving Web Usability with a Content

Management SystemFred Miller, Rick Lindquist, & Curtis Kelch

Illinois Wesleyan University

The Problem• How to best use a web content

management system• In an environment with distributed

site responsibility• While ensuring the usability of the

site

Our Challenge• About Illinois Wesleyan University

– 2100 students, 700 faculty and staff– Over 60 department & office web sites

• Went live with CMS in fall of 2005– Sungard Higher Ed Luminis CMS

• > 90% of departments offices using CMS– Departments have responsibility for their

sites– Only one new position created

What’s In It For You?• Our tactics• Lessons learned• Review of low cost usability

techniques• Demonstration of low cost usability

techniques• More low cost web usability tools

Tactics: Distributed Responsibility

• Public Relations– Template and graphic design– Main navigation and template approval– Content for University pages

• IT Staff– Maintain CMS systems, build templates– Train department CMS users– Assist with usability testing, department navigation

• Department CMS users– Work with IT to develop pages & site navigation– Create & update content

Lessons Learned (part 1 of 3)

• Administration support– Budget– Buy-in & ownership– Content, usability, and infrastructure

• Avoid being overly ambitious• Offer some site differentiation

Site Differentiation

Lessons Learned (Part 2 of 3)

• Pick a primary audience– Who are you building the site for?

• Rewards that work– Usability testing– Content managers

• Look for opportunities to test usability– Department site redesign– Change requests

Opportunity for Usability Testing• IT controls navigation & template

changes– Encourage usability testing with changes

Site-Wide Navigation

“Bread Crumb” Trail

Department Navigation

Lessons Learned (part 3 of 3)

• The importance of training and support– Prepare a “maintenance plan”– Some departments use students– A few positions adjusted to reflect new roles– Keep positive momentum

• Sustaining Interest– The template refresh– Ongoing usability testing

Low Cost Usability Techniques

• A few fast, informal tests fix big problems

• Observation methods• Card sorting• Prototyping• The external expert review (reality

check)

Observation Methods• Select target audience for testing

– 5 quick tests can find most site problems– Even one test is better than none

• Prepare a few simple tasks to perform• Tell user we’re testing the site, not them

– “The user is always right”• Ask to talk out loud• Observe only, don’t lead to answers

Before and After•10-minute tests•2-minute fix•No cost

•Deleted old info•Combined hours

•Clear benefits

The Application Button

Card Sorting• Helpful when designing CMS site architecture• One index card for each page in the site• Users sort the cards into 6-8 similar piles

– Ask to “think out loud”– Name the categories

• Analyze the results– Common themes?– What are top levels?

Prototypes• Paper Prototypes

– Sketch out a solution on paper– No preconceived notions– No web skills needed

• Using the CMS to create a test site– CMS changes are fast– Iterative process– No need to publish

Usability with a CMS• CMS means fast changes• Dynamic features

– Template or style changes– Linked pages: share the same content– Components: change many pages at

once– Test your site before publishing

The External Expert Review• Academic usability expert

– Dr. Michael Twidale from University of Illinois• Two on site visits and demonstrations• Very low cost

• Commercial– Lawlor Group’s “Identity” study

• Not so low cost

If it is that easy…• Low Cost Usability testing in action

– The Challenge• “What can we learn from a single, short user test with

little advance preparation and rapid analysis of results?”– Looking for a parent of a prospective

college student…– Select 5 tasks a parent would perform– Let’s do it…

Low Cost Usability Tools• Google Analytics• Visual Heatmap• Confetti• ClickTale

Using Existing Web VisitorsFor low cost usability

Show visually

Show visually

Google Overlay

Google Overlay

Home Page Design

Visual Heatmap

Dr. Jakob NielsenFamous User Interface & Usability Expert

F

Confetti

Confetti

Why are users clicking here?

CrazyEgg.com

Just add this code to your pages

ClickTale

Additional Resources• Jakob Nielson’s UseIt.com & Alertbox

– http://www.useit.com/• SURL at Wichita State

– http://psychology.wichita.edu/surl• Steve Krug, “Don’t Make Me Think”

– http://www.sensible.com/index.html• Crazy Egg

– http://www.crazyegg.com• Google Analytics

– http://www.google.com/analytics/• Clicktale

– http://www.clicktale.com/• Usability.gov

– http://www.usability.gov/