A Fresh Start: Touro Library Homepage, Part 2

Touro Libraries' homepage from 2013-2015
Touro Libraries’ homepage from 2013-2015

A little more than a year ago, we began the process of redesigning the library homepage (see its many previous incarnations), but the beginnings of the decision to undertake the project stretch even further back. The previous library website served us well, but it had grown and changed over time. As is very common, each of these small changes solved a current problem, but without a holistic analysis of the entire website, certain inconsistencies and dissonances began to creep in. It was time for a total overhaul.

Since librarians specialize in the organization of information, tackling the site structure to standardize everything and hopefully make it easier and more intuitive to navigate was our first order of business. Just like re-organizing your garage or packing for a trip, before we could decide what went where, we had to take an inventory to know exactly what we had. That meant going through every page on the website and entering it into an Excel spreadsheet, so that we could determine what was no longer needed, what should be added or updated, and how everything was related.

With all the facts in hand, we could proceed into the re-design process. This involved many meetings, design iterations, user testing sessions, and discussions over the course of about seven months. Looking back at our earliest design compared to the final version, there are not only significant cosmetic differences, but several fundamental changes in our design philosophy.

first library website design
Our first design mock-up

The first was our position on the trade-off between ease of access vs. ease of reading. Our initial design had a simple two-tier organization scheme that presented links to all second-level pages directly on the homepage. While we had believed that this would make the site easier to navigate, it quickly became clear that what we gained in visibility was outweighed by the clutter. To counteract this, we chose instead to create four basic categories under which to group the links, making it easier to narrow in on what you’re looking for. To choose the top-level menu categories, we did an exercise called card-sorting, where we made post-it notes for every page on the library website, and then had different people group them together in ways and under names that made sense to them. From the consensus, we decided on: Find, Help, Services, and About.

Now with a dropdown menu!
New logo, bigger search box, and a dropdown menu

The other major shift you’ll see from early to later iterations is the removal of the tabbed search box. The previous version of the website actually had a hybrid tab/search box. This created an inconsistent user experience, since some of the tabs contained search boxes for different collections, whereas other tabs simply contained a list of links. While early versions of the re-design addressed that issue, further research into library website design trends and best practices introduced the idea of doing away with tabs completely.

An early version of the QuickSearch-focused design
An early version of the QuickSearch-focused design

In the early days of library websites, there was no way to combine the several essential but distinct sources of information on the library website, namely the catalog versus online resources such as databases, making tabs a good option for co-locating these different searches. Federated searches and discovery layers, such as our QuickSearch, first made it possible to search in multiple places at the same time, but they could be clunky. Recently, however, these tools have become increasingly more usable and popular with students. Although not perfect or yet sufficient by themselves, today discovery layers continue to improve and are a great first stop for quick searches or the beginning stages of research. With this in mind, we chose to transition to a single, focal search box powered by QuickSearch. This provides a clear call to action and path for both new and experienced library users. For those seeking additional information, all of the familiar and powerful individual resources are easily accessible from the toolbar beneath the main search box.

Almost there! The icon-based tool bar makes additional popular items easy to access
Almost there! The icon-based tool bar makes additional popular items easy to access

Some goals stayed constant throughout, though the implementation varied along the way. The guiding principles and priorities during the design process included:

  • Simple, intuitive navigation with easy access to the most-used items
  • An updated library logo and a new, consistent color scheme to coordinate with the main Touro website
  • More images and dynamic content to provide novel information and visual interest

After a lot of meetings and discussions, many different designs and mock-ups, and several rounds of testing, we finally reached a point where we were happy with the design, but that was only half the battle! Throughout the summer and the fall semester, our Technical Services Librarian Liping Ren was hard at work making our plans into the live and fully-functional website that went live at the beginning of February. Hopefully we have achieved our objectives, but we also know that web design is a perpetually on-going process. We’re eager to know what you think, so leave us comments here, submit suggestions, or share your thoughts on social media.

What do you think of the new library website?

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s