Category — Content Management
Get Great Website Usability Using Joint Application Design and Simple Usability Testing
All websites are supposed to be easy to use. They have to be. If your website isn’t, then your visitors will bail and find a website that is. But how in the world do you sure your website has ease of use?
My answer came after a good bit of trial and error is to use Joint Application Design workshops for website design. Then follow that up with some simple usability testing.
But most websites groups don’t really do too much to improve the designs of their websites. Heck, most folks don’t even use usability testing on websites to see if they are easy to use or not. And I can see why. When I worked on ACT! at Symantec we did a lot of usability testing and I have to admit it didn’t work that well.
Our usability testing went something like this: We would work really hard to get the application features complete and get rid of the bugs that made the usability testing impossible. Then we would hunker down in our high dollar usability lab and pump 15 to 20 people through the testing process over about 2 weeks. We would then pull some test ‘results’ together.
There were two big of problem with this approach. We didn’t have a great idea of what to test before hand so we ended up with a big glob of anecdotal comments about the app – not actionable “this is wrong” sort of feedback. And the feedback came so late in the project we couldn’t really act on the results - we had to wait and integrate that test results into the NEXT release.
To make usability testing really work for us we needed usability feedback before we even got the application complete so we had time to fix the problem. And the feedback needed to be formatted into a “fix this problem” sort of statements. It would have been good if the testing could be a little less intense and time consuming as well.
These experiences led me to a big dilemma when I saw the really bad user interfaces coming out of the first few website projects I managed. It was clear that “Big Usability Testing” – big as in big test lab, big group of folks being testing, big glob of results at the end – just wasn’t going to work on websites either. Yet something had to be done to improve the usability of the websites we were making.
Without a lot of great ideas of how to improve usability on websites, I adapted a couple of application development ideas to website development: Joint Application Design (JAD) workshops to improve a website usability design and beta testing to test the website design’s effectiveness.
I ran across the JAD technique when I was doing client server development for a bit right after I left Symantec. JAD is an “interactive systems design concept involving discussion groups in a workshop setting” normally used as a requirements gathering exercise using a cross section of technical and business participants.
I saw it really work well for requirements gathering and some light application design. So it seemed to make sense to apply the workshop setting and cross-functional participants to the entire user interface design process as well.
The JAD workshop applied to website design worked something like this:
- Create a list of the features that the website needs to do
- Get 5-8 folks with differing backgrounds and viewpoints into a conference room
- Conduct a workshop to create a wire frame website on a white board.
- Turn the white board wire frame into HTML with some text added for things you can’t explain in the wire frame.
I tried using the JAD technique for the website design of a pretty simple site with a consulting client. After reviewing the HTML wire frame from the results of our JAD workshop with client management, we did a follow-up JAD workshop to address the issues they brought up.
Once we had the final wire frame assembled, low and behold, we had created a much more usable website design than any one person could have done individually.
For usability testing, we adapted “Beta testing” like I had seen done at Symantec on ACT! to website development. It was really easy to implement beta testing – once the website was stable enough to use without crashing we posted a version of the website out for review by some external partners.
The good news is that we got some feedback from folks outside the project. But the feedback we got wasn’t focused. It was at the “tweak this and tweak that” level and not the in-depth feedback we needed. The results were still too late in the development process to act upon without holding up the website release.
After the first experiment of how to improve website usability, I found that the JAD workshops really, really improved website usability. But beta testing didn’t give us any better feedback than Big Usability Testing even though it was a lot easier to pull off.
Fast-forward several years. I found great results using UI JAD workshops to design websites in a variety of settings – consulting and for internal customers. But still no improvement on testing the UI that was developed during the process.
Then I got to reading this really great book, Don’t Make Me Think by Steve Krug. Krug describes a really stripped down version of Big Usability Testing that was specially tailored for websites. The process it described took almost all of the practices of Big Usability Testing, simplified them and moved testing earlier into the development process.
Krug doesn’t really name this stripped down website usability testing, so for lack of a better term, let’s call it “simple usability testing.” Here is a summary practices of Big Usability Testing, the thorny issues they cause and a set of simplified practice Krug recommends instead.
| Big Usability Testing | Big Usability Testing Problem | Simple Usability Testing Solution |
|---|---|---|
| Buy equipment and make a dedicated usability testing lab | $$$$ - a usability lab costs a lot of money | Find a conference room, bring your video camera from home |
| Hire a usability expert | $$$ - a usability staff costs buck few website can afford | You test, you analyze the results, you figure out the solution |
| Create a usability study | It takes a long time to make and digest | Make a list of problems found and prioritize them |
| Test functional software | Once software works it’s hard to change the UI | Test anything (wire frames, software, mockups) that will give the user an understanding of what you are doing |
| One round of usability testing | What if you didn’t fix the big problems you found in the first round of testing? | Do more than one round of testing |
| Test between 10 and 20 people | Testing a lot of folks takes a lot of time (and money) | Test between 3 and 8 people and be ok with that |
This sort of process made so much sense that I had to try it out. Using a little project that I was working on, I did some simple usability testing after the design was done and guess what? Worked great. I had a couple of those usability testing magic moments where things I had never thought about came to light. It was brilliant.
So to boil that all down, I have had great results iteratively doing Joint application design to improve the initial UI design usability and then applying “simple usability testing” from Krug’s “Don’t make me think” book to assure that the design is good. It’s not particularly difficult to do and the results are really good. Let’s walk through the steps of how to do these two processes together.
Steps to improve your website’s usability
- Assemble a set of features – Before you start designing anything you really need a list of features that the website is going to implement. Without a well-defined list of features your design team just isn’t going to know what to design.
- Pick a cross-functional design group – To get a really good design you need the right folks to get in there and make the design workshop happen. Ideally, you would have at least two business non-technical folks, a web producer/HTML person, a senior developer, and the project manager. You want a good cross section of viewpoints and interests in your design workshops. And the folks you select should be flexible and easy to work with.
- Set up the JAD workshop - Get a conference room with a lot of whiteboards, reserve it for the whole day and get cracking. If this is the first time through the process it may make sense to show up with a first draft wire frame to kick things off. Ideally the person that will be “approving” the UI design should be participating. If folks can’t stay for the whole time, don’t include them. Don’t allow cell phone/crackberries/laptops.
- Conduct the JAD workshop - Spend a couple of hours to an entire day creating or revising a wire frame on a white board. Hopefully you can moderate this yourself. All participants should have an equal say in the design. Look for consensus in the design but don’t force it. It’s not critical to get down to one design but it will be great if that happens. But do make sure that your website design guidelines will allow what you are designing… it makes no sense to make a design that can’t be implemented on your website.
- Develop a wire frame – Using the notes and white board drawing get your web producer to create a wire frame UI in HTML. In cases where it is not clear what should happen on a page then add some text descriptions or call outs. For instance, if there should be some AJAX functionality happening on a page don’t get bogged down in developing it now. Describe what the functionality should do in a note on the page someplace.
- Iterate – Do steps 3 to 5 again to improve your design at least once. At a minimum you should have at least 2 JAD workshops with the same set of people.
- Make a usability test script – Before you can start testing you need to make a script that will walk the user through each specific task you want to evaluate. You don’t have to start from scratch on this – Steve Krug’s website has a really good great starter script. http://www.sensible.com/Downloads/script.doc
- Find a testing location and equipment – All you need to test is a conference room or, heaven forbid, a quiet cube someplace. You will want to videotape each testing session so bring your video camera and tripod from home.
- Conduct the testing – Line up 3 – 8 people to test. Bring them in. Walk them through the script. Make sure and pay them $50-100 in cash as they leave. It’s great if they are in your exact website demographic target but it’s not as critical as you might think.
- Review results – While reviewing the testing make two lists: one for general issues that came up during the sessions and one for problems specific to the new things you are testing. Prioritize the issues to fix and possible solutions if they pop up. In an ideal world, the same design group you used during your JAD workshop would review the testing videos.
- Redesign as needed – Do another JAD workshop to address the issues brought up in usability testing. Look to solve the high priority problems specific to the new functionality you are developing and any of the general problems that can be fixed. It’s convenient but often challenging to review the results and redesign based on the results in the same session.
- Redevelop – Now get in there and rework the wire frame based on the JAD workshop results.
- Iterate – Do steps 7 to 12 again so that your team will do at least two rounds of usability test and redesign.
- Start development – Once you start usability testing, I would try to start involving more application folks in the design process or at least giving them access to the wire frames as they come out. The idea is to jump-start the lower level business logic and database design processes using the wire frame to stimulate the discussion.
I’d try to use 2 JAD workshops and 2 rounds of usability testing, like I have document in the process now, for large chunks of functionality or content. The entire process could take as little two weeks if folks can be dedicated or mostly dedicated and could take a month and a half if folks are not dedicated. It will probably take at least a month the first time through.
For smaller project cut the number of JAD workshops and usability testing iterations down from there as you see fit.
Summing up - Get Great Website Usability Using Joint Application Design and Simple Usability Testing
Using a Joint Application Design workshop for your website’s user interface and the using simply usability testing as outlined in Krug’s excellent book “Don’t make me think” is really going to improve your site’s usability. And without a huge change to the development process you have in place now. If you really want to get it all together then try combining this approach to website usability with time boxing, MoSCoW prioritization and iterative development. Give it a try and let me know how it works.
Joint Application Design Resources
Great summary of the problems JAD looks to solve and how.
Great summary of the wireframe process.
Usability Testing Resources
The man himself, Steve Krug, has a great site on website usability.
The best resource on website usability has got to be Jakob Nielson’s website.
July 7, 2008
Does your website work?
It’s not easy to look at the website you work on every day and tell if it is effective. You already know the content, navigation and all the features. And it’s not like just looking at the website is going to really tell you everything anyway.
What you really need are some tools and techniques that get you in touch with what your users are experiencing. You need answers to questions like:
- Is my website up or down for my visitors?
- Can visitors find what they are looking for and searching for?
- Why are visitors coming to my website?
And now that we are talking about questions, how do you know how well your landing pages are working, how your offers are working or how full your online sales funnel is?
Simple, old-fashioned log file based website analytics isn’t going to answer all these questions. You need a comprehensive data collection and analysis process that gives you complete, actionable answers to the questions that are vital to making your website is working well.
There is good news though - getting these actionable answers has never been easier. Log file analysis, custom coded surveys, and huge expensive usability labs have given way to JavaScript based analysis tagging, easily deployed online surveys and usability labs using your video camera in a cubicle. With all these newer techniques available, it makes sense to revisiting how you get answers to your “does my website work?” questions. Almost every single question has a new, better way of getting it answered.
Is my website up and available for your users? How fast do my site pages load where my visitors are?
Internal site monitoring tools are useful for figuring out if your hardware and software are available for your visitors. But they have one significant limitation. They can’t tell if your website is available outside your network, out there on the great big Internet. Fortunately there are tons of hosted solutions that can be used to simulate visitor site access from around your country and around the world then alert you if problems crop up. Considering the price of these services are as low as $25 per month there isn’t a reason to not get a monitoring solution in place today.
Is my website easy to use?
Not long ago usability testing was the domain of big software companies. These companies had tons of money for a complete dedicated usability testing suite that often costs $100,000 or more. While usability test suites are expensive, the biggest problem with old style usability testing was that the software needed to be completely functional before testing could be done. The software had to be so complete that it was hard to get the usability testing feedback back into the development process and get the software out the door on time.
Somewhere along the way common sense took over and someone discovered that there was a ton of value doing informal testing early in the development cycle. Instead of big usability suite and tons of folks in the process, think small test groups and a home video camera with testing going on in a conference room or cubicle. Instead of complete functioning software, think HTML wire frame or screen markups. Small amounts of this type of informal usability testing will yield amazing insight into the usability of your site for a really low cost.
Can users find what they are searching for?
There are tons of visitors that come to your site and use your search function straight away. So if your search function isn’t working well, then you have big, big problems. Luckily there are two great ways of getting insight into if your visitors are finding what they are searching for: Search results analysis and an after-search survey feature.
Search results analysis helps you tune your website content so that searchers can find what they are looking for. Hopefully the search function on your site records what each and every visitor searches for – if not then it needs to. Once you get a hold of this data simply spend an hour a week looking through the searches visitors conduct and what your search feature returns. This will give you invaluable insight into the effectiveness of your search feature and the content tagging and key word richness of your page content. Use this insight to tune your content and your site search will get a lot better. The real bonus part of this activity is that you will help your SEO efforts with this search results analysis as well.
An after-search survey will give you insight into if your visitors are satisfied with the results of the searches they are conducting. The best implementation of this sort of survey is to add a small form to the bottom of your search results pages with the question “Did this search give you the information you needed?” with a yes/no and submit button. Getting good feedback using this simple piece of functionality gives you great actionable insight into your visitors thoughts on your site’s search effectiveness.
Why are users coming to the site? Are users satisfied with the website?
Sometimes the easiest way to get information you need from your visitors is to simply ask them. Sure, you could get a developer to code up a survey for you and figure out a good way to distribute it, but why bother? There are tons of great, hosted survey services offerings out there that require no developer time, no additional infrastructure and little to no setup cost. And you get great reports and can brand the surveys with your website look and feel. Using a survey service to get feedback directly from your users make sense on so many levels.
Are my landing pages successful? Are my offers successful?
Effectiveness of landing pages, offers and other forms has long been a challenging thing to measure - old style web log analytics solutions work but it’s not a pretty solution. Sure, your developers could make it work but your website would end up with fugly URLs, it’s difficult to scale if you traffic a ton of campaigns and it is far from web 2.0/ajax friendly.
But using JavaScript tagging solves most of these issues. Instead of analyzing web logs created by your webservers, JavaScript tagging uses an in-page script that is run when the page is loaded on the clients browser. When this browser script is run the clients’ browser communicates to a separate server to record the access. Using JavaScript tagging enables your website to keep its nice URLs and your developers can easily create a way of recording other information, like which campaign drew the person to the landing page, when the script is run. JavaScript tagging is a much cleaner, easier, accurate way of getting form conversion data about landing pages and offers.
What is the ROI for my online campaigns? How many online visitors, prospects and customers are visiting my website? Are the leads I am forwarding to sales good leads?
Sometimes you need big tools that are expensive to make and maintain to get good answers about your website. And this is one of those cases. To get critical end-to-end metrics like online campaign ROI, the effectiveness of the leads forward to sales and the like, you need tons of data. And that data isn’t available on your website. And even if it was in your website database, your transactional website DB is not setup to do in-depth data roll ups and reporting.
Let’s face it. The only place that campaign data, online visit information, sales data, and customer data come together is in a data warehouse. Hopefully the folks that run your CRM and ERP systems are already on the road to implementing this sort of thing and you can leverage those efforts. If not, then creating a marketing data warehouse is what you need to look into. There are a couple of vendors out there who sell “pre-built” marketing data warehouse products but don’t look for a complete solution without some heavy customization.
But after going through the implementation of a marketing data warehouse before, it’s worth it. Until you can give the business the answers they need to judge the end-to-end effectiveness of online marketing, they are just shooting in the dark. Even the most basic of end-to-end information has tremendous value. Expensive but well worth the investment.
There you have it - getting good actionable answers to your website questions has never been easier. And once you get them in place there is so much value that you will wonder how you got along before hand. Why not give these ideas a try and let me know how it goes?
June 23, 2008
The Content Management System Sweet Spot
Some folks swear by their homegrown content management system. Others like their open source content management system (CMS). Still others have gone all out and purchased a big package to solve the giant content management problem they have.
And that makes sense. There isn’t just one solution that works for every site and every organization. There is too much diversity in what folks want out of their content management system and processes.
Regardless of how you solve your content management problem, I do think there is a sweet spot of just enough CMS. A place where you get ease of use and the efficiency promised by content management systems. But not so much that your team loses its creativity, agility and control.
So what sort of features should you implement with your CMS to get into that sweet spot? Here is my take:
Use site-wide themes
To get the most value from your CMS, use its theme capability and make sure that you can globally change the look and feel of your website by changing a few template files. By template files, I mean something similar to themes in WordPress or a skin in DotNetNuke. You also want a globally included well-designed CSS so that you can make small styling changes without radically changing your content. If you are in roll-your-own mode you can still accomplish theme-like feature for your CMS without a ton of development work. We implemented a theme-like feature at NetIQ/Webtrends (we called it a page framework) and it worked really well.
Optimize for the list-view pattern
Tons of the content on websites is in a list-view pattern. Press releases are a great example of this pattern. Almost all sites have a list of press releases which link to individual press release views. Anytime there is a list of links – product data sheets, events, FAQ, knowledge base articles, sales offices for instance– and each of the links goes to content items of the same type you have content in a list-view pattern.
Because this pattern is so common, making a common authoring, storage and display system for this pattern can save your team tons of time. To take full advantage of the list-view pattern, make sure your CMS can:
- Create new “types” of content – Say you already store FAQ and product data sheets in your CMS. And tomorrow you find out that you need to store many “tutorial video clips” for download… Each tutorial video clip will have a title, one or more video clip files, tags and of course any text/html for the download page itself. You want to simply create a new content type in your CMS called “tutorial video clips” and start up loading them.
- Author all the types of content with a single authoring application – you want to be able to create press releases, events to go on a calendar or store “tutorial video clips” using a common set of tools in a single authoring application. This saves tons of time by not having to create custom admin interfaces for each type of content that your system will need to store.
- Ability to control the content displayed in a list – Say you want to list just 5 “tutorial video clips” for a product sorted by date. To support this sort of requirement, which is sure to come, you will need to be able to query the content database and get a list of links that have a limited number of entries, filtered by tag (in this case the product), and sorted by any field.
- Associate a view template to a type of content – Each type of content will need its own list formatting and view formatting. Press releases, “tutorial video clips” and FAQ lists and views are all going to look different, right? You need an association between a content type and a set of list-view templates, which described how the content should be formatted. Using this association you can make press release look like a press release and set of calendar events can be formatted on a calendar.
Authoring content in a web page
You want everyone to be able to author content and the ability to do it using an editor in a web page is super cool. With significant ease of use and accessibility using XHTML / AJAX based editors like FCK editor, your entire team can participate in the content creation fun. The ability to apply basic CSS styles even makes styling content easy and consistent. The only down side is that training will be required for your content creators to make sure your site ends up with well-constructed and well-edited content.
Don’t write the copy
I have seen some web shops where the web producers write the copy that goes on the website. Not a good idea. The business owner of the copy should be the person that gets the copy written. Ideally, they will get a professional copywriter to write it or, heaven forbid, do it themselves.
Limit content approval steps
Lots of big sites have very sophisticated content approval processes. But this isn’t where you get good value out of a CMS - keep your approval process basic with a single signoff from the business owner for the content. If there is legal or some other approval needed to get content on the site, then get the content’s business owner to solve that problem himself or herself. Don’t let your overachieving legal departments or micromanaging executives complicate what should be a simple straightforward process.
Use staging & publishing
Tons of sites develop, review and approve content on the live website and don’t use a QA server. But working on a live site for major changes in content or even small look and feel changes is like doing a high wire act without a net. Screw up one thing and your site is down until you can somehow patch it back together again. Ideally your CMS setup has the idea of a QA server, a staging server and a robust publishing process that gets the content out to the site. I find the lack of staging and publishing features a significant omission in popular open source system (hello WordPress) and amazingly, higher cost commercial software, too.
Make version control transparent
It sucks to lose work. There is nothing worse than saying to your boss “it was all done but someone overwrote the changes and we can’t get them back.” So naturally I recommend that your CMS should support file versioning, locking and rollback. It should take very little effort from your content authors to use version control with your CMS – version control should be completely transparent to the user and only announce its presence when there is a problem.
Exploit Plug-ins
Your website isn’t just content. It’s going to include some features that have become standard website fair like mapping, blogs, forums and dozens of other smaller items. If you do have the option of getting some of this functionality for “free” using a CMS plug-in and the plug-in fits your requirements, then just plug it in and be done.
Implement a well-known stack
The ability to add custom functionality to your CMS and support it is vitally important to the long term viability of your website. But there are still closed content management systems out there or systems so difficult to work with they might as well be closed. Make sure your CMS is LAMP, Java or .net and uses a well know SQL database if you want to make things work long term.
What not to do with CMS
There are also a few things that are NOT in the sweet spot of CMS. These features are harder to implement, keep running and don’t add a ton of value. Features not in the sweet spot of CMS are:
1. Lots of authoring/publishing roles – You shouldn’t need to have more than 5 or 6 standard roles in your CMS setup. Adding a lot of roles makes things more complex than they need to be.
2. Multi-level content approval – Multi level approvals don’t make sense in most cases. Use a single level approval process for content.
3. Single sign-on/LDAP – If directory services and single sign-on come for “free” with your CMS package or it’s less than a couple of days, then this integration makes sense. Weeks/months spent on directory services integration doesn’t.
4. User level access permission – Assigning user access rights to content at the user level never makes sense. Assigning user access rights at the group level does.
5. Excessive security (firewall rules and encrypted sessions) – It’s not such a big thing to have your unpublished content zipping around on the Internet in clear text. The snappy performance of unencrypted HTTP is more important than security in my book.
6. Site rollback features – I have never understood the need to roll back the site to a particular point in the past or seen it work. Punt on this feature.
Summing up the content management system sweet spot
That’s my view on getting the most bang from your buck when you implement CMS for your medium to large corporate websites. If you can combine these features with some basic solid processes then you are well on your way to website content management done right. The sweet spot isn’t elusive if you work through these issues carefully. Give it a try and let me know how it goes.
June 1, 2008
Website Content Management Done Right
I thought that by 2008 every website would have content management figured out. One way of solving the content management system conundrum would have emerged and everyone would be doing it. But guess what? It’s still a free-for-all out there.
Some folks swear by home grown stuff. Others like open source solutions. And others have gone all out and purchased a big package to solve the problem.
And I guess that makes sense. There just isn’t one solution that works for every site and every organization. There is too much diversity in what folks want out of their content management system (CMS) and processes.
But even with the diversity of needs out there, I do think there is a sweet spot of “just enough” CMS. A place where you get enough CMS to get ease of use and efficiency but not so much that you kill creativity and agility. Check out the article “The CMS Sweet Spot” for the details.
Regardless where you end up with a content management system, there are a set of issues critical to figure out if you want to run a content rich website and keep from hiring a legion of web producers to keep the lights on. More specifically, I’d say that there are 6 issues you should get figured out to make CMS work well for your organization:
- Didn’t We Just do Something Like That? When your group cranks out the same project over and over, then it isn’t a project - it’s content production. Separating the projects that tend to require more up front work and client interaction from the day-to-day “update this section, launch this product, post this press release, change this page” sort of stuff will save so much effort that it will amaze you.
- Release a Release Checklist – Wouldn’t it be great if you could know when the project is ready to release instead of just guessing? It would be great if you could move the “it’s done” decision from gut-feel to science. And that is exactly what a release checklist will do. A release checklist for projects and content production items introduces a touch of science in what is typically an emotional call.
- Find Your Site Design Guide – You probably have a site design guide. Somewhere. If it was up to date, maybe you could avoid that “I want my project to work completely different than the rest of the site” conversation again. And you could avoid a lot of work too.
- It’s Supposed To Be Easy, Right? – I have never seen a website that wasn’t supposed to be easy to use. But few folks really get in there and test their content, information architecture or functionality to figure out if it is easy to use. There is so much value in just a little testing that once you start your team will be hooked on getting first hand feed back from real users.
- If You Don’t Track Bugs They Will Squash You – It’s simple. If you don’t track bugs, they don’t get fixed. And lots of defects on your site will kill its effectiveness. Plus with tons of cheap hosted or onsite bug database options, there isn’t a reason not to have one. Most bug tracking software will even help you track issues, too.
- Perfect Your Release Process – Getting content and functionality from the website group live on to the site reliably is a must. If your team can’t do it perfectly every time, then getting it perfected should be next on your to do list. Not hard to do but critical to do.
Nothing on the list is rocket science but there are a lot of meaty issues to get figured out. The nice part is that whatever CMS you pick to get these issues worked out will first make things all that much easier to get your content management system straightened out. Give it a try and let me know how it goes.
June 1, 2008