Library Hat Rotating Header Image

May, 2012:

Big Type and Readability

May 30th, 2012
by Bohyun (Library Hat).
Comments are off for this post

** This blog post has been originally published in ACRL TechConnect 0n May 30, 2012.  **

The Big Type

Jeffrey Zeldman published a post that explains his choice of big type in his website/blog last week.  If you are curious about how huge the type is in his site, see below my screenshot (or visit his site: http://zeldman.com).  It is pretty big. Compare it to any Web site or this current site of mine. Yea, the type is huge.

zeldman.com

He says people either hate or love the big type and the simplistic/minimalist layout of his site or just spends time processing them. I found myself loving it because hey, it was so fr**king easy to read without any other distraction in the site. As Zeldman himself says, “It’s over the top but not unusable nor, in my opinion, unbeautiful.” And in my opinion, being fully functional counts to a great degree in favor of beauty.  

Readability

The strange satisfaction that I felt while reading the articles in his site set in the big type has led me to realize how hard it is to read the main content of any common web page. It is usually so hard that the first thing I do before reading any Web page is to increase the font size inside a Web browser (thereby also removing the top navigation and all other things on both sides except the main content out of my sight). Sometimes, I also use the ‘Print’ preview, just to read, not to print anything (since this removes all ads and images etc.). Also handy is a plugin like Readability. Zeldman’s site was the first site where none of these actions was necessary.

The Web design convention with must-have items such as a top navigation, header image, navigation on the left, ads and numerous links on the right forces us to take out those very items by manually manipulating the browser in order to make the main content simply readable! This is an irony that is more than fully appreciated by those who build and manage Web sites in particular. We (the universal we as Web workers) follow the convention as something canonical because we want to build a Web site that is usable and pleasant to interact with. But while interacting with any such conventional site, our own behavior reveals that we try to eliminate those very canonical elements.

It’s not that we can or should eliminate right away all those conventional items. They are useful for various purposes. But the point is that no matter how useful they are, those things are also great distractions in reading. In a Web site or a page where reading is the primary activity, the readability of its content is a greater problem than other sites or pages.  Zeldman’s Big Type experiment would be simply bizarre if it is applied without any modification to, say, the WSJ homepage. But it probably is not a bad idea to apply it to an individual article page in the WSJ Web site.

Zeldman’s experimental design with the big type reminds me of what the application, Flipboard, does. (See below the demo video if you are not familiar with the Flipboard app.) It strips off elements that are distracting to reading and re-formats the page in a way that is attractive and functional. Where the design fails to help one to read a Web page, an app comes to rescue.

Now you may ask how all these relate to libraries. My question is: (a) how much of the main function of a library Web site is reading, and how much is not, (b) what parts of a library Web site is to be read and not, and (c) how we can balance and facilitate those different uses of a library Web site. Rarely a Web site is designed solely for reading, but reading is an important part of almost always a certain section of any Web site. So this is an issue that is worth thinking about and matters to not only library Web sites but also any other Web site. Just asking these questions could be a good step towards making your Web pages more usable.

In the next post, I will discuss how we read on the Web and how to design and serve the content for the Web in a user-friendly manner.

When Browsing Gets Confusing

May 8th, 2012
by Bohyun (Library Hat).
4 comments

***** This blog post has been originally published in ACRL TechConnect 0n May 7, 2012. *****

——–
During the usability testing I ran a while ago, there was one task that quite baffled at least one participant. I will share the case with you in this post. The task given to the usability testing participant was this: “You would like to find out if the library has a journal named New England Journal of Medicine online.”

The testing begins at the Florida International University Medical library website, which has a search box with multiple tabs. As you can see below, one of the tabs is E-Journals. Most of the users selected the E-Journals tab and typed in the journal title. This gave them a satisfactory answer right away. But a few took a different path, and this approach revealed something interesting about browsing the library’s e-journals in the E-Journal portal site which is a system separate from the library’s website.

Browsing for a Specific E-Journal

1. In the case I observed, a student selected the link ‘Medical E-journals’ in the library homepage above instead of using the search box. The student was taken to the E-Journal Portal site, which also presents a search box where one can type in a journal title. But the student opted to browse and clicked ‘N.’

2. The student was given the following screen after clicking ‘N.’ He realized that that there are lots of e-journals whose title begins with ‘N’ and clicked ‘Next.’

3. The site presented him with the following screen. At this point, he expressed puzzlement at what happened after the click. The screen appeared to him the same as before. He could not tell what his click did to the screen. So he clicked ‘Next’ again.

4. He was still baffled at first and then gave up browsing. The student typed in a journal title in the search box instead and got the match.

Lessons Learned

A couple of things were learned from observing this case.

  • First, this case shows that some people prefer browsing to searching even when the search could be much faster and the search box is clearly visible.
  • Second, a click needs to create a visible change to prevent a user’s frustration.
  • Third, what is a visible and discernible change may well be different to different people.

The first is nothing new. We know that some users prefer to search while some prefer to browse. So both features – search and browse – in a Web site should work intuitively. In this example, the E-Journal portal has a good search feature but shows some confusing aspect in browsing. I found the change from step 2 to 3 and step 3 to 4 somewhat baffling just as the student who participated in the usability testing did. I could not discern the difference from step 2 to 3 and step 3 to 4 right away. Although I was familiar with the E-Journal portal, I was not aware of this issue at all until I saw a person actually attempting to get to New England Journal of Medicine by browsing only because I myself have always used the search feature in the past.

But, when I showed this case to one of my colleagues, she said the change of the screens shown above was clear to her. She did not share the same level of confusion that the student experienced. Also, once I had figured out what the difference in each step, I could no longer experience the same confusion either. So how confusing this browsing experience can vary. I will go over the process one more time below and point out why this browsing process could be confusing to some people.

The student had difficulty in perceiving the change from step 2 to 3. The screen in step 3 appeared to him to have unchanged from step 2. The same for the screen in step 3. from step 4. Actually, there was a change. It was just hard to notice to the student and was something different from what he expected. What the system does when a user clicks ‘Next,’ is to move from the first item on the sub-list under N to the second item (N&H-Nai -> NAJ-Nan) and then again from the second item to the third item (NAJ-Nan -> Nat-Nat). This, however, did not match what the student expected. He thought the ‘Next’ link would bring up the sub-list beginning with the next of the last entry, ‘Nat-Nat,’ not the next of the currently selected entry. The fact that the sub-list shows many ‘Nat-Nat’s also confused him. (This is likely to be because the system is bundling 50 e-journals and then extract the first three letters of the first and last journal in the bundle to create items on the sub-list.) A user sees the last item on the sub-list in step 3 and 4. stay the same ‘Nat-Nat’ and wonders whether his clicking ‘Next’ had any effect.

Making browsing a large number of items user-friendly is a challenge. The more items there are to browse, the more items the system should allow a user to skip at once. This will help a user to get to the item s/he is looking for more quickly. Also, when there are many items to browse, a user is likely to look for the second and third category to zoom in on the item s/he is looking for. Faceted browsing/search is an effective way to organize a large number of items so that people can quickly drill down to a sub-category of things which they are interested in. Many libraries now use a discovery system over an OPAC (online public access catalog) to provide such faceted browsing/search. In this case, for example, allowing a user to select the second letter of the item after selecting the first instead of trudging through each bundle of fifty journal titles would expedite the browsing significantly.

What other things can you think of to improve the browsing experience in this E-Journal portal? Do you have any Web site where you can easily and quickly browse a large number of items?

 

** Below are the screens with the changes marked in red for your review:

2′.


3′.

4′.