Critique: Coudal Partners - Dynamic Palette vs. Usability
Tags: Commentary, Website Development
Like many others (Robinson, Fried, Santa Maria, Cornett), I am very impressed with Coudal Partners' recently redesigned website.
The new design is likely to inspire imitators, indeed Cameron Moll has predicted that Coudal will encourage widespread adoption of large type "headlines". I predict that the newspaper format will also become increasingly popular - particularly with weblogs. Could the familiar two-column weblog be on its way out?
In their introduction to the redesign, Coudal told us, "the whole site's color palette is determined by the main cover image," a very clever and envy-inducing trick, but the implementation seems to be flawed...
Note: The cover image and palette discussed in this article are subject to frequent change. This article accurately reflects the design of the Coudal website at the time of writing (4th July, 2004).
The Good
Coudal's dynamic palette selection is a great idea. From a design perspective, a palette taken from a cover image helps to maintain a theme throughout a website. With frequent changes, the website will always look fresh and appear to be actively maintained with very little effort from the designer(s).
This freshness, combined with great content and other innovative design elements, means that coudal.com is more "sticky" than ever before. The entire website encourages revisits and bookmarking. The website is a fantastic "shop-window" for Coudal Partners.
The Bad
“fortunately, Coudal had the foresight to underline the links, which serves to distinguish them from regular content”
However, when I visited the website earlier today I noticed that the site's cover-image had rotated and I was immediately struck by an apparent flaw in the dynamic palette.
The palette responsible for my disquiet is weak, to say the least. The cover image, from which the palette is derived, is not particulary colourful, with green and grey being the most voluminous colours (note that the red, yellow and blue primaries are also present, but in smaller quantities).
This has resulted in a link pallete with the following properties:
- regular text (#222)
- unvisited link (#30671d)
- visited link (#222)
- "hover" link (#57626f)
Let's have a look at this palette in situ (quoted from Coudal's cover page as at 4th July, 2004):
Edited by our own Dave Reidy, this ever-updated list of
books to be read "on location," as determined by some of
our favorite writers, designers, and friends, will come in
handy when you're planning the next trip. Thanks to
Marshall Sokoloff for the photo above and thanks to
Pamela LiCalzi O'Connell for the nice mention in
yesterday's New York Times.
In the above example, the first faux-link illustrates the visited state, the second - "hover" and the third - unvisited.
Notice how small the difference between these states is? This palette bothers me (and I enjoy 20/20 vision), I hate to think how it impacts readers with colour-perception impairments. Combine the low-visibility links with a small (and fixed!) body font and I think we're looking at real usability issues.
It's worth pointing out that the cover image-derived palette is applied site-wide, it is not localised to the cover page which, as far as I can determine, is the only page that features the cover image.
Fortunately, Coudal had the foresight to underline the links (regardless of the state), which serves to distinguish them from regular content.
Using the same image as a base, a more usable palette could surely have been created? For example:
Edited by our own Dave Reidy, this ever-updated list of
books to be read "on location," as determined by some of
our favorite writers, designers, and friends, will come in
handy when you're planning the next trip. Thanks to
Marshall Sokoloff for the photo above and thanks to
Pamela LiCalzi O'Connell for the nice mention in
yesterday's New York Times.
Again, the first "link" illustrates the visited state, the second - "hover" and the third - unvisited.
Why Automated Palette Selection is Not Ideal
At this point, I should point out that this article is based on a single assumption - that the Coudal palette is programmatically created. I do not know whether or not this is the case, but I have made this assumption based on the following observation:
- the palette seems to be derived from the dominant (as in area) colours of the cover image, despite the presence of more distinctive colours in the image.
Furthermore, I don't believe the highly respected Coudal team would have chosen a palette that renders links virtually indistinguishable from copy, if they had created the palette manually.
Assuming then, that the palette is machine-selected - the Coudal website is facing some potential problems in the future. An algorithm can't "see" the resulting website, it can't determine whether or not a given palette works - or is usable. The algorithm could choose colours that don't compliment each other, or that are only slightly different, or that result in content that is barely visible, etc...
If Coudal are using machine-selection, I would hope that they have anticipated the possible problems and that they will continue to refine their software so that more usable palettes are deployed in future. If they are not, or if the current palette was manually created, then I am worried!
See Also:
You can comment on this entry, or read what others have written (5 comments).