Cecily Walker clued me in to the beta Multnomah County Library website and made an apt comparison to my Plainest Library Website Ever doodle.
Here’s the new MCL site:
They’ve whittled it down to some important basics. I’m impressed.
The layout is pretty good, but the page is difficult to read. Click through and you’ll see what I mean. The gradients and transparencies reduce contrast between element and the background image is distracting. The lack of contrast is really apparent when looking at the logo; it blends into the background and has no impact. The site reminds me of bing.com, but notice how the image Bing uses is more like texture than an image of a particular thing. This makes it less distracting. Also the search box is solid white, increasing contrast.
Removing gradients and the background image from the MCL beta renders the page very plain, but much more readable (and actually quite similar to my previous doodle).
But this revision is problematic too. While is is a lot easier to read – and calmer – it has very little visual interest and makes the library seem lifeless. Surely there’s a way to add some visual interest that isn’t distracting, doesn’t sacrifice legibility, and is more than decoration. Here’s a quick attempt:
With some overlaid text, the bottom third+ of the page could be an image carousel effectively advertising library news and events. It could also connect people to popular parts of the site, or it could set the tone for using the library:
Notice that a big image carousel removes the need for the small grey one. This helps because the search box and grey carousel are so similar in size that they compete for our attention. In this mockup there’s more contrast between the two.
This concept isn’t launch ready but it is headed in a good direction.
The site suffers from contrast problems on subpages too. The grey text on a barely transparent brown background is difficult to read.
Here’s the same page, black on white (and section headers emboldened).
I’m looking forward to seeing how MCL polishes up the site!
It’s a little off topic for the thrust of Aaron’s post, but the odd thing that stood out for me was the exceptionally sh**ty collection of books being held and displayed in the main image. Given that it’s a big, bright (maybe overly so) in-your-face image that presumably wants to define the library in some way, why pick a whole bunch of third-rate, soft-porn street fiction as the books that represent your collection? Myself, I would have had the hands holding a somewhat different mix of titles.
I agree with Delibrarian about choice of titles. It relates to some big ideas about this, stemming from your last post. And strangely @multcolib’s beta somehow struck on the idea while still totally missing it. Why not write some awesome code pulling from the library database and put a virtual library on the front page – like tiled images of titles/authors as if you were looking at book spines. Best reviewed, most read, hot, newest, etc. It would have to be fairly light-colored to allow the main menu items (those elegant, pared down ones you came out with) but hover-overs would “pull the book from the shelf” so to speak, maybe with a pop-out. It would be just like walking in the library, with all those books in the background and the surprise-me element, but with the most essential bits at your fingertips (location, hours, acct., and search). An interactive background image, essentially.
And… gah! Get rid of image carousels – nobody gives a flying whoop about them anymore. That one — though probably still raw — is particularly awkward and ugly. http://conversionxl.com/dont-use-automatic-image-sliders-or-carousels-ignore-the-fad/
I like your ideas.
Here’s a results list that’s heading in the direction you mention: http://tscpl.org/?s=steinbeck I’m really curious about the utility and usability of this particular implementation.
And great link about image sliders too. I’m going to think about that.
Hi Aaron
Thanks for the review and the kind words and the good advice. I actually re-read your post from a couple years back about less-is-more when we were concepting.
Some updates: the opacity will be going away here in the next couple of days and we’ll continue to revise the image on the homepage as we look for ways to capture everything a library does for the community – without sacrificing experience to do it.
I look forward to hearing more about as we move through beta and continue to refine the site.
Thanks again Aaron – keep up the great work.
– Jeremy
Jeremy Graybill
Marketing and Communications Director
Multnomah County Library
503.793.0881
[email protected]
http://www.multcolib.org
Thanks for the update Jeremy!
(Thanks for the shout out, Aaron.)
Jeremy, I’m interested in knowing what sort of user research you guys did leading up to the redesign. Contrast has always been a big flag for us where I work, but I admit I hadn’t really even noticed it until Aaron pointed it out.
It’s one of those things we (all) should consider when designing sites that are accessible for all users, including folks with older eyes and/or low vision, so I’m surprised how easy it was for me to overlook it.
Hi Cecily,
We did observed user testing and now widescale, crowdsourced public user testing and data collection through the beta phase.
We are aiming for WCAG 2.0 AA standards – which is pretty tough for the entire site given some of the external elements and modules. But we did select those modules with accessibility as an emphasis.
Accessibility standards were a success criteria for this project. We’ve run the entire site through multiple runs of Total Validator and it has passed at an AA level. So far, the only text that isn’t conforming is the search box text.
Other current issues flagged by Total Validator were the lack of use of the title attribute on links to provide more information on links. Under any of the various regulatory levels of accessibility validation, this is a spot to stick more information.
Some pages had issues with a large section to stroll through and some float issues in pushing the main content to the bottom of the source code.
But the contrast, transparency, dropshadow etc are all AA good. We’re hoping to have the rest of those issues ironed out soon.
– Jeremy
sticking with Zane then, by the sound of it….
Thanks for the reply, Jeremy.
The site is in public beta phase and we will be improving it continuously based on user testing – including in the short term removing opacity, enhancing contrast and so on. We are also looking at the best ways to relay information on the homepage from a design and best practice standpoint. Accessibility and the user experience are naturally, critical and this forum has been a big help in moving toward that goal.
The images on our homepage and throughout the site will rotate to reflect the library brand and all of the ways the library serves the community – even if from time to time that service might reflect titles, resources and subject matter we might not all agree with. That’s something we’re running toward, not away from. I do appreciate your aesthetic suggestions and enthusiasm for design. Stay tuned, I’d love to continue this dialog as we refine the site during beta.
Best regards
– Jeremy