LITEHouse Awards

Technical Review

Design and Navigation

MJCPL Website BannerInitial review of the design reflects upon the sheer amount of content that is available from each page. That said, this turns out to be a tremendous advantage for the users of the site. With the exception of that catalog search pages, the navigation bar is available from every page of the site. Users are never "dead-ended" and forced to use the browser's back button to get back to certain pages.

There is also a consistent and mild color scheme implemented that is professional and not harsh on the eyes. So many sites rely on movement, highly contrasting colors, and element size to draw attention to items. However, MJCPL has elegantly constructed their design with visual emphasis placed where it is needed and everything else is grouped or organized accordingly. The banner (left) is an excellent example of this. If there is ever a featured event at the library, what better place to put this than the first place users look.

Upon scanning multiple pages, it is very apparent that you are on the same site, which isn't always the case on other sites. The colors, navigation, and header page element stays consistent throughout which is important for answering the "where am I?" question. This also eases the ability to navigate across multiple pages, speeding the process in which a user finds the things they came to the site for. There are also two levels of navigation that are available globally. Each primary navigation item has a drop down menu that serves at a secondary set of page links for that section. This also speeds the process for getting users from deep in one section to deep within a different section.

There are also several elements in the design that enhance the sites "scanability", which is important when a page has this much content. Section headings on the home page such as "tools", "inside", "news" and "events are all larger and in a different color than the base text of the page. This allows the readers eye to filter the content more easily and scan across the page for a more detailed look at exactly what they are looking for.

Furthermore, the entire design is text-based. Very few images are used for text and navigation, which helps with 508 compliance and usability for users who need assistive technologies.

Technical and Usability Aspects

I was disappointed to find that the pages didn't validate. However, this is often a design tradeoff and a decision that is made for very pragmatic reasons. Not knowing how and why such decisions were made, I can only evaluate that these validation failures were minimal, which appears to be the case. Most errors deal with badly formed comments and ampersands in links, which if paid attention to, would be minor fixes. Check out the HTML validation for MJCPL.org.

The CSS failed to validate because there were several styles that were repeated for elements. This is often done to accomplish cross-browser compatibility for pages without adding hacks or other non-legitimate code to a CSS. View the CSS Validation for MJCPL.org.

Tools Header from MJCPL.orgThis site was browser-tested in the latest versions of FireFox (2.0.0.2), Internet Explorer (7.0), as well as the unfortunately-lingering Internet Explorer 6.5. The site looked identical across all three major browsers with the exception of the background transparency on the section headings (e.g. tools, inside, news, events). This is simply due to the fact that IE6 does not support PNG transparency (see right), which is being used in this case.

As mentioned above, the scannability of the pages is an important aspect to usability. If the design doesn't support the rendering of information in a way in which the eyes cannot easily digest, than the page can quickly look cluttered and busy. The MJCPL folks have worked around that by designing different elements to break up the page and allow the eyes to absorb the content in smaller chunks.

The drop down navigation menu was built using CSS and JavaScript, which helps with several issues. The page is more easily rendered by browsers and more compatible with section 508 requirements. Users with screen readers can see this content in the same way a regular browser user can. The scripting is not required as in many other menu implementations. Making these CSS and text-based also decreases the page load time, which is helpful when pages are as content-rich as these.

It is also important to note that the feature/billboard area of the page, uses a similar method for hiding and showing content. Instead of using Flash, which has some issues dealing with accessibility compliance, there was a simply JavaScript/CSS piece that as used to "paginate" that area of content. There is a similar functionality in place on the left side of the content area, where section headings (in green) are clickable to hide and show different content elements such as hours, location, and content information. Rather than showing all of this information by default and bombarding users with information, they have put the power in the users hands to select what content they want. This is also done in such a way that the page doesn't need to reload or further waiting is done on the part of the user while the browser gets this information.

Maintenance Aspects

The Madison-Jefferson County Public Library site also appeared to be up-to-date, which is crucial for a web site. Unless the content is continually refreshed, users will typically have no reason to visit the site consistently. This site contains clear sections for this updated inforation such as "News" and "Events" sections. For example, I could go to the site and see what events were taking place today, rather than surf to a calendar that showed all events and find the day of interest.

The creation and revision dates were not clearly indicated, but in large part, I didn't think they were necessary. In most pages, this information would seem to be a bit out of context. The nature of the frequently updated content is clear in the design. The user knows where to look for new information, without the information indicating that it is new.

An excellent example of this is the blog that is posted by the librarians. In many cases, a blog is put up to make a site appear more updated than it really is. However, the MJCPL site actually uses this forum to communicate new information to site visitors. Sections also have unique headings such as this one for the blog. The design gets the point across, and fits within the design of the site without coming across as too cute or unprofessional.

The Buzz: blog header for MJCPL.org

Overall, the site is technically sound and appears to go above and beyond in terms of service to library patrons. This makes MJCPL.org unique among library sites in its delivery of content to its patrons.