Usability Testing – the Examples

Yesterday, I briefly talked about the theory behind the testing I carried out for my degree project on CMS. Today I’ll mention the specific problems I found and how I counteracted them.

The Problems

Images

I tested Mambo and Textpattern, in my studies, before creating my own system, and discovered that people had great difficulties placing images into a webpage. The problems with Mambo revolved around people unable to locate the area where images could be uploaded and failing to upload images to the webspace and therefore failing but, with Textpattern they found it easy to upload the image and difficult to add that image to the page in question. The problem with Textpattern is that it doesn’t give clues on how to add the image. In the images area of the system it lists the three different types of tags Textile, Textpattern and , XHTML which you need to click on to show you the relevant code to insert into the webpage. However, it doesn’t mention anywhere that this is what you have to do so, my testers had no idea how to transport the image from the images section to the web page.

Publishing Content

Once people had struggled to find the content they were looking for which especially in Mambo is quite difficult, they were unable to find the publish or save buttons. Why? Because these buttons where bizarrely located in the top right corner of the screen away from the action but, not only that, they were greyed out until hovered over. My test subjects didn’t stand a chance!

Textile

The problem with Textile in Textpattern is that people didn’t notice it existed. They had no idea they were typing in a HTML pseudo-code. Why? because the textile hints were hidden by JavaScript unless you clicked on the Textile Help link. When the textile help is displayed it isn’t as intuitive as it could be, and leaves a lot of room for confusion.

The Solutions

Images

My solution was to automatically create thumbnails for all uploaded images and then place the last five uploaded on the same page as the form where adding/editing duties are performed. This on its on wasn’t enough and so, there needed to be instructions next to the images telling the user how to add the images. This made a dramatic improvement to people’s ability to ad images to webpages.

Writing for the Web

I also choose to include basic hints and tips for writing on the web next to the add/edit form with info like ‘Keep the paragraphs short’ and some Textile hints and tips were reworded and displayed by default.

JavaScript

By Using standards-based JavaScript I was able to eliminate the errors associated with people missing out required form fields. Although, there were labels next to the fields coupled with instructions that they were required or not people still occasionally forgot to add them. Some simple JavaScript that only affects the page if JavaScript is enabled sorts out those errors.

Summary

Testing reveals problems that you had no idea existed so, it is well worth doing.

Comments are closed.