Library Web Pages Search (Iterations)

We first did some paper prototyping to simply change the location of “search library pages” from a tab to a search box in the traditional upper right-hand corner of the page. This would eliminate the “Library Web Pages” tab from the main horizontal navigation.

We then moved to considering making the search box a separate tab along the main horizontal navigation.

We also felt it was important after a user actually performed a search using the site search option, the results page included the University of Illinois skin rather than the generic Google skin.

This is what the current search results look like.

This is what the redesigned page would look like with the library skin.



Horizontal Tabs (Iterations)

In addition to removing the “Library Web Pages” tab from the horizontal navigation, there was much discussion about renaming/reorganizing/simplifying the main top horizontal navigation tabs. Because the current tabs span the width of the page, they resemble  navigation menu, and we speculated that this may be why users are expecting the main content to change with each tab selection.

We felt it was important, at minimum, to rename the “Everything” tab to “Any Resources” or something similar. One of our first iterations included drastically simplifying the tab structure to include just three tabs, and using the space within the search box to specify what resources type will be included in this search.

Current library gateway with seven horizontal tabs

Close-up of horizontal tabs.

However, we are undecided as to if a reduction in search tabs will confuse users further. The former Library Gateway included multiple search tabs, however, the tabs had slightly different names (“Easy Search”, “Books”, “Journals”, “Reserves”, “Other”). Therefore, it is possible that language is causing confusion, and not the presence of the tabs.

Moving forward with the reduced tab concept, we created the first iteration of the design (above). The three tab model was inspired by University of North Carolina at Chapel Hill’s library website and our own Undergraduate Library’s website. (See our Competitive Analysis post for more on our assessment of the UNC library and other university libraries’ websites.) The books, journals, and media tabs are consolidated in to one “Catalog” tab, and the “Articles” and “Reserves” tabs remain. We worried that a user, seeing “Articles” as the only specifically listed catalog resource, would wonder, “I can search articles, but how can I search books?”

Our next iteration kept the three-tab search structure, but changed the names of the tabs:

Because “Journals’ searches a different set of databases than the other tabs, this iteration replaces “Articles” with “Journals” for the stand-alone resource tab. “Everything” is re-inserted, but includes “Easy Search” in the same tab. Therefore,  the usability pitfalls of “Everything” tab, as encountered in our user studies, is avoided. We noticed that “Easy Search” is how the old library gateway labelled their “Everything” tab, which is a better, more catalog-specific word than “Everything”:

The old library gateway page. (

Currently, we are undecided about the three-tab search design, and have agreed that a user test on this design is the ideal way to determine if this structure reduces or adds confusion to the search process. We will be interested to read our classmates’ input on this.

Vertical Tabs (Iterations)

The current order and selection of vertical tabs.

Although the user studies seemed to indicate that the vertical tabs were easier to navigate than the horizontal tabs, we felt the link order could be improved, and some renaming should occur, both in the tabs and in the sections they connect to. For example, since “About the Library” is heavily used, we felt that tab should be moved up, while “Help & Tutorials” should be moved down.

Tabs to be reordered.

There were also problems with the “Browse by Subject” tab. We felt the information was unnecessarily redundant and could easily be incorporated into another tab and eliminated. The content was well-represented under the “Resources for…” tab. The Subject Guides are also under “Help & Tutorials.” The only thing that seemed to be losing a spot is the “Libraries By College/Major” – a very helpful resource – that could make sense within the “Find a Library,” one of the “Popular Resources”

Tabs to be deleted:

Library Hours (Iterations)

Clicking on “Library Hours” from the Library Gateway currently takes the user to a table of library hours. Due to all the text, the table with the library hours does not begin until just above the fold:The Original Hours Page

We decided we wanted to pare down this information. Some of it was redundant or seemed unnecessary on this page. Acronyms were unfriendly to people new to the library, so we tried to spell them out as we encountered them. We were able to play with the html for this portion of the site relatively easily, so our first iteration looks fairly polished:

Hours Page, Version 1

Hours Page, Version 1

Another sweep of the text left us feeling like there was still a bit too much. We also removed the asterix and dagger notation indicating which libraries are outside the main building and  which libraries have “Other access possible for Institute researchers.” They are also noted at the bottom of the page. The listing of the buildings link out to maps which seems to address location.

Hours Page, Version 2

Hours Page, Version 2

While the Main Library Building hours were noted at the top of the page, they were not listed in the table. That seemed like an easy enough issue to remedy, especially as some people may skim over the top portion of the text and scroll down to find the Main Library Building in the table:

Library Hours, Version 2

Library Hours, Version 2 – Main Library in table

This should be a little more straightforward for patrons to navigate.

Library Gateway: Cumulative Changes Version 1

This is a mock-up of the redesigned site, which combines the iterations of the search, vertical and horizontal tabs redesign that is discussed in the other posts.

, “L Library Gateway

Cumulative changes version 1


1. Search bar added in top-right of page

2. “Articles”, “Books”, “Media”, “Everything” and “Library Web Pages” tabs removed from horizontal tabs

3. “Everything/Easy Search” tab added to horizontal tabs

4. Vertical tabs reordered: “About the Library” tab moved up to the second position, “Find Books and Articles” is moved down to third position

5. “Browse by Subject” is removed from vertical tabs

6. “What happened to the Library Homepage” box and video removed from right side of page

7. Main library hours added

8. Library chat box moved down to accommodate main library hours box

Other changed pages:

Library Hours

Library Gateway: Cumulative Changes Version 2

Based on the class’s feedback we were able to come up with some improvements to the gateway itself:


Time and time again our users and our classmates were thrown off by the “Everything” tab. We are trying to focus on the interface of the gateway more that the tools. We will keep Easy Search, but try another name to manage user’s expectations. In an effort to emphasize the use of the tool as a cursory glance at the library’s resources that is better for breadth than depth and specificity we renamed it “Quick Search.” Further user testing would be beneficial to get a sense for how the lay-user might perceive it.

We do recognize that we might eliminating too many of the horizontal tabs (Books for example); however we chose to go for simplicity for these iterations. More using testing and iterations would need to happen to determine which tabs and what names would be most idea.

In addition, a number of people spoke to their frustration with the Library Locations and Hours page. Those two features go hand in hand and will be consolidated:


Now there will be one link that leads out to a unified page that is discussed in the Library Hours & Locations post.

Thanks for the feedback everyone!

Library Hours (Iteration v. 2)

Based on feedback from the rest of the class we are consolidating the Library Hours page with the Locations page. We incorporated the in page navigation for skipping ahead alphabetically as well as changing some of the names and headers:

The page still seems fairly clunky. However it is a manageable, centralized way to change the library hours with each semester and vacation.

Durham County Library may have found the perfect system:

It is tempting to try and recreate that page, but the drop down list would quickly become long and unwieldy for the University of Illinois!