Ricker Library

OpenCMS / HTML / CSS / Info architecture

Background

I worked at the Ricker Library of Architecture and Art as a Graduate Assistant during my time as a Master's student at the University of Illinois. I quickly found that the Ricker site was in need of some updates, both in terms of the site design and presentation, as well as in organizing and re-structuring the site content.

Screenshot of the old Ricker homepage.

The old Ricker homepage.

At that time, all the library pages were being managed using OpenCMS, an open source Content Management System. Any design changes made to the site had to be implemented through OpenCMS, as well as adhering to the design codes for the University overall, and the University's library pages in particular.

My tasks

With the input/approval of the head librarian, I began work to:

  • Redesign the overall CSS layout of the site, to the limits within OpenCMS, and to the University of Illinois' design standards.
  • Organize all of the files currently uploaded in the directory for Ricker in OpenCMS.
  • Develop a more readily-observable information hierarchy for the site's current content that would make more sense to new users.
  • Remove or update broken links and clearly outdated information throughout the site.
Screenshot of an old Ricker page with poor navigation.

Page from old Ricker site, with no main navigation and a breadcumb at the top of the page leading straight back to the homepage.

The redesign

The redesign of Ricker was based partially off of another University of Illinois library's site that the head librarian liked: the Social Science, Health, and Education Library (SSHEL). In particular, we were drawn to:

  • The clearly distinguishable main navigation in the left sidebar.
  • The dark blue color scheme in the left and right sidebar.
  • Keeping the content on the main page fairly short and simple.

In addition to these features in the SSHELL website, I also aimed to make sure the new Ricker design:

  • Clearly outlined the hierarchy of sub-sections and -pages in the left sidebar navigation.
  • Implemented coherent and consistent use of header tags throughout the site overall.
  • Had "back to top" links on longer pages for ease-of-use.
Screenshot of the redesigned Ricker page.

New Ricker homepage.

Dealing with the content

Probably the most overwhelming phase of this project was dealing with the content -- some of which had gone untouched since the early 2000's. The files in the Ricker directory in the OpenCMS were largely unorganized. Everything was dumped more or less into the top-level directory. Some pages had been replaced with updated versions of themselves. Others seemed to have completely fallen off the overall site schema and were not actively linked to anywhere on the live site.

The first step I took in untangling this massive web of content was to conduct a content audit. In Excel, I went through every file currently uploaded to the Ricker directory in OpenCMS, and marked down several bits of relevant information that allowed me to gather the following:

  • What is this file? What is its purpose in this website?
  • Is this the most current version of this file?
  • Where does this file fit in the overall information hierarchy of the site (to the best of my knowledge)?
  • Other notes as applicable.

I was able to go through this content audit Excel file with the head librarian, and better determine from this point which files needed to be kept, removed, or changed. I also was able to put together a more coherent site hierarchy, with top-level pages and sub-pages within those sections.

The final product

After much analyzing, brainstorming, organizing, and coding, the new Ricker site was born! Sadly, I was not able to implement much in the way of responsive design -- my access to how much I could change the overall layout was very limited in OpenCMS. But with a combination of the newly thought-out design and the much-needed organization of content, I hope that this version is an improvement upon what was there before.

Visit Site