InfoCommons #2 – Usability and Online Forms

My second InfoCommons column was published this February in the AIRS Newsletter.

Forms are ubiquitous in the world of information and referral.  Many of us use online intake forms embedded in software to record calls; we use online search forms in resource databases, and we provide forms for users and agencies to contact us. Poorly designed forms can cause confusion for users and result in bad information being entered.   If users don’t understand why they’re being asked for certain information, they may simply refuse to provide the information.  In their book Forms That Work, Caroline Jarrett and Gerry Gaffney propose that forms involve three layers:

  • The relationship of a form is the relationship between the organization that is asking the questions and the person that is answering.
  • The conversation of a form comes from the questions that it asks, any other instructions, and the way the form is arranged into topics.
  • The appearance of a form is the way it looks: the arrangement of text, input areas such as fields and graphics, and the use of color. (Jarrett & Gaffney, 2009)

The user experience involved in each of these three layers has implications for the success of a form.

Relationship and Conversation

It can be challenging to organize the flow of an intake form to promote accurate collection of information while facilitating natural dialogue between an I&R Specialist and a caller.  One common problem with online forms is that questions may seem random if each new piece of information doesn’t relate to what’s previously been requested. When an I&R Specialist is acting as an intermediary between a caller and an intake form, it’s easy to explain why certain information is being requested – there’s a more personal relationship and conversation happening. In a purely web-based setting, it becomes crucial to gain users’ trust by clearly indicating who we are, why we’re requesting certain information, and how that information relates to what the user has already entered.  Jarrett and Gaffney provide this advice: “It’s usually best to ask anticipated questions before you move into something unexpected or unusual. Ease into questions that may intrude on the user’s privacy by dealing with neutral topics first.”

Image
Example form field with explanation for why information is being requested.

The relationship between your organization and the users of your online forms may be relatively clear, but it always helps to make sure that your public online forms are clearly labeled with your logo, and provide reassurance to the user about how their information will be used and where it will be sent.

Appearance

The appearance of forms is often the area over which we have the least control when using software, content management systems, or online services like Google Forms or Formstack.  Many form-creation services don’t allow customization of field label displays, dimensions of input boxes, typography, or grouping and placement of fields. However, if you have control over the appearance of your online forms, I encourage you to consider how you can manipulate these elements to promote usability:

  • Results from user testing of forms, including eye-tracking studies, indicate that users see labels above and to the left of fields. Putting labels above fields reduces the eye movement required to scan the labels and fields, but can result in the form appearing longer.
  • Reading right-aligned text is harder than reading left-aligned text, especially if your question runs over more than one line. For simple, often requested data, right-aligned field labels will enable users to move swiftly through a group of fields. However, if you form asks unfamiliar questions that requires people to scan labels to learn what’s required, left-aligned labels work best.
  • Make your forms more organized by grouping related fields together.  You can do this using placement, spacing, alignment, and background color.

Users with different experience levels and motivations will interact with web forms differently. By providing well-organized and easy-to-use forms for the public and for I&R Specialists, we’ll be more likely to succeed in collecting the information we need.

Further reading:

Friedman, V. (2008, July 4). Smashing Magazine. “Web Form Design Patterns: Sign-Up Forms.” http://uxdesign.smashingmagazine.com/2008/07/04/web-form-design-patterns-sign-up-forms/

Jarrett, C. & Gaffney, G. (2009). Forms that Work: Designing Web Forms for Usability. Burlington, MA: Morgan Kaufmann Publishers.

Penzo, M.  (2006, January 23)  UXMatters.  “Evaluating the Usability of Search Forms Using Eyetracking: A Practical Approach.” http://www.uxmatters.com/mt/archives/2006/01/evaluating-the-usability-of-search-forms-using-eyetracking-a-practical-approach.php

Use typographic variations with restraint

I’m reading Forms that Work: Designing Web Forms for Usability, and I can’t help but share the following since it’s something I’ve seen incredibly frequently, from library resources guides to I&R intake screenings:

You MAY be tempted to use bold, italic, and CAPITALS and underlining to emphasize IMPORTANT INFORMATION. Problem: you can END UP with a sort of VISUAL SOUP where none of the emphasis works.

It’s challenging to design a user manual, resource guide, or other sort of instructional document without falling back on these kinds of typographic variations.  There are so many points that need to be emphasized, and you want to make sure your audience (readers or end-users) pays attention to the important information.  Here’s some advice that seems good:

Image

There’s so much to find on the web about this topic, it’s hard to know where to start.  Here’s one suggestion with (probably) more to come as I continue to investigate usability and user experience in the world of online forms.

We can do it

I’ve been tracking IT and web design-related jobs in libraries for a while now, but this is the first one I’ve seen that stands out as being so focused on user experience, they even want a terminal degree in HCI or a related field. And just yesterday I was reading the most recent issue of Library Hi Tech (v.29:no.2), which focuses on usability testing. One of the articles in that volume discusses the quality of research being done on user needs in the LIS field. The author, Elke Greifeneder, concludes:

These papers show that the quality of user research in our field is rising, that researchers know how to label and use methods appropriately, and that they are using a greater variety of methods. Finally, researchers seem to acknowledge that user research requires one small step after another. Instead of painting a big picture with a single user study that has many research questions, they do multiple smaller in-depth research projects, which can be interconnected like one big picture puzzle that might, in the end, give a better impression of how our users actually behave and what they really need.

Isn’t this exciting? I hope to see more jobs like the one Purdue has posted. To me, it’s a sign that libraries are finally moving towards seriously integrating UX into all our digital products and services. Maybe one day more than 28% of the major databases we subscribe to might even be accessible to people using adaptive technology?

WebAnywhere: free “on-the-go” screen reader

While going through a large donation from a faculty member, I came across some recent issues of Technology Review. In the Sept./Oct. 2009 feature on young innovators, there happened to be a profile of Jeffrey Bigham, who, “as a graduate student at the University of Washington, created WebAnywhere, a free screen reader that can be used with practically any operating system – no special software required.” Serendipitous discovery, given my recent resurgence of interest in researching assistive technologies and web accessibility.

For a while I have been meaning to go to the public library and experiment with browsing the Web using JAWS (it’s installed on all THEIR public computers), but now I can do it from the comfort of my desk! I’ve already tried searching my library catalog and navigating our website using WebAnywhere. It works…mostly? I just did basic stuff, and I haven’t attempted any databases yet. One issue that might be significant is that our OPAC times-out after a rather small amount of time. It took me so long to “read” through the page and the list of search results that by the time I picked one to look at a more detailed record, my session had expired and I had to re-do my search. Anyways, I’m really excited that there’s a more “lightweight” tool for navigating the web via screen reader. Instead of just following accessibility guidelines when designing websites, now I can actually see what my pages sound like. (edit: I didn’t know about the accessibility validation tool Cynthia Says before today either). I wonder if a lot of people who are blind or have visual impairments are using WebAnywhere. And I wonder how it compares to JAWS or other screen reading software.

Here are some basics from the WebAnywhere site, and (for you multimedia cravers) – a video. I would love to hear about it if anyone is inspired to go access some websites – especially your favorite library catalogs and databases? – and comment on how navigable they are with a screen reader. I’ll probably be posting more about this in the future since I am just so curious about it.

WebAnywhere is a web-based screen reader for the web. It requires no special software to be installed on the client machine and, therefore, enables blind people to access the web from any computer they happen to have access to that has a sound card. Visit wa.cs.washington.edu to access WebAnywhere directly. And, it’s completely FREE to use!

WebAnywhere will run on any machine, even heavily locked-down public terminals, regardless of what operating system it is running and regardless of what browsers are installed. WebAnywhere does not seek to replace existing screen readers – it has some big limitations, namely that it will not provide access to desktop applications like word processors or spreadsheets.

Further reading:

W3C introduction to web accessibility

How People with Disabilities Access the Web from the Web Design & Development course created by the University of Washington.