All thoughts and opinions in my blog are my own and do not represent the position of my employer.

Inspiration for flexible web design

This post was last updated April 2009

Flexible web sites—sites that are liquid or elastic—have the unfair reputation of being ugly and plain. There are certainly lots of flexible sites that fit this stereotype, just as there are tons of ugly fixed-width sites. But flexible design doesn’t have to be unattractive. There are lots of really beautiful, graphically rich liquid and elastic web sites, which are all the more impressive to me because of the extra skill it often takes to pull off these graphic techniques in a flexible environment.

Here are some web design galleries that showcase flexible design:

No Resolution
This is an entire site devoted to showcasing liquid and elastic designs. Unfortunately, you have to register to submit entries, so things have been slow lately. Still, lots of great stuff in the archives, and new additions from time to time.
CSSGlance, liquid layout category
CSSGlance categorizes all entries as fixed-width, liquid, or elastic, which is really nice. They have a pretty good collection of liquid layouts.
CSSGlance, elastic layout category
Only a few things here, but elastic layouts are pretty rare in general, as well as hard to recognize with only a glance.
CSS Drive, liquid layout category
This category seems to have been mostly forgotten about recently, but it does have a good collection of liquid layouts from 2007 and earlier, and new entries do show up occasionally.
Unmatched Style, entries tagged as liquid layout
A very small collection of liquid layouts that is very rarely updated, but I include it here in case it takes off one day. Let’s hope so!

I keep my own collection of designs I find attractive and inspiring in I have a number of liquid layouts saved as inspiration, as well as a few inspiring elastic ones. I’ll point out a few of my favorites:

Speaking at Voices That Matter this week

I’ll be speaking at the Voices That Matter: Web Design Conference this week in Nashville. My presentation is titled Designing CSS Layouts for the Flexible Web. It focuses on the design principles you need to conform to in order to create graphic comps that can be successfully turned into CSS-based liquid and elastic layouts.

If you’re at the conference, I hope you’ll come up and say hi!

First post

It seems like I should have something momentous to say in my first post, but I’m afraid I don’t. I promise the later posts will be more interesting! I plan to blog about web design, particularly CSS, accessibility, and usability, as these are the main areas of focus of my work. I’m currently writing a book on CSS, titled Flexible Web Design: Creating Liquid and Elastic Layouts with CSS, so I’m going to have CSS on the brain more than the others, and I imagine the CSS posts will be prevalent during the first few months of this blog.

View more posts:

Archives by Category

  • Announcements (32)

    Learn what's happening in my career or industry, including information about my speaking engagements and books.

  • Articles (40)

    Informational or theoretical articles about a variety of web design topics, including CSS, HTML, accessibility, usability, and visual design.

  • Inspiration (8)

    Collections of images or links to others' design work that I find inspiring and think you will too.

  • Tutorials (5)

    Step-by-step articles that you can follow along with to learn a particular web design technique, including CSS layout and CSS3 effects.

Archives by Month