The liquid web site motherload

I feel like a kid in a candy store. A nerdy kid. Because I’ve hit the liquid web site motherload: Nomensa’s portfolio.

Nomensa is a web agency specializing in accessibility and usability. Their own site is a nice example of a liquid design, and I’ve had it bookmarked for a while, but I finally got a chance to check out the sites in their portfolio. There are dozens and dozens of them, and almost all of them are liquid. (They also have a few elastic ones, and a few fixed-width.) Unfortunately, Nomensa doesn’t provide links to all of their work, but only a select few as case studies. But, you can google the names of the non-case-study clients, and you’ll find that most of these sites are liquid as well.

Now, I grant you, many of the sites are not terribly stylish. But they still are really useful to look at to get ideas for how to handle content and layout in liquid layouts. You could easily use the same techniques they’re using with a bit more spit and polish added.

Here are a few of the most well done liquid sites from Nomensa’s portfolio:

Barcham Online

The header using seven images of tree foliage that expand and contract to fill the available space is very clever and attractive. Also check out the feature boxes on the home page and the thumbnail gallery under Our Trees. It’s notable that this is an e-commerce site, which you don’t often see liquid.

Broads Authority

I’m not in love with the overall look and feel of this site, but I appreciate the unique layout of the home page. The main image on the home page that has a text box below, which moves down as the text in the adjacent columns grows, revealing more of the image above, is very well done.

Preston City Council

Another unique home page layout and neat use of “variable cropping” on the main photo. Be sure to check out the Gallery under Get Involved, as well as all the little feature boxes and things on the inner pages.

Macmillan Cancer Support

This site is notable for the large amount of information that it organizes into liquid rounded corner boxes throughout the site, without everything becoming chaotic and unbalanced at different viewport widths.

Business Startup Community

Again, not a very attractive site, but I’m bookmarking it simply for the treatment of the three tabs on the inner sections of the site.

I’ll be sure to stop by Nomensa’s portfolio periodically to see what new work they are featuring and gather ideas for solving problems in my own work. I should have mentioned in my flexible web design inspiration post that a great place to find liquid and elastic sites is within the portfolios of agencies or designers who themselves have liquid or elastic sites. Nomensa is now on this list for me.