Are fluid-width designs making a comeback?
Back in ye olde web design days when everyone was using tables for their websites it was pretty common to see a website that stretched with the browser window. Then we got all semantic and moved to mostly fixed-width designs.
Despite the current trend of fixed-width websites, I have started seeing quite a bit more fluid-width sites popping up on the internet. What’s more? I like it. Here’s why.
FLUID VS. FIXED
Before we get into my reasons, I want to clarify what I mean by fixed-width and fluid-width.
A fixed-width website has a specific width in pixels. All the content fits into a container of this measure. The container may or may not be visible. This is the most common type of layout being used right now.
On the other hand, a fluid-width website uses a percentage measure rather than a pixel measure to specify widths. This means that as you resize the browser window, the design will resize with it.
USE THE RIGHT TOOL FOR THE RIGHT JOB
There is a place for fluid-width, and it’s not on every site. In fact, on most sites I would recommend a fixed-width design, especially those that have lots of content to read such as blogs and online publications.
The exception here is for web apps. Web apps have very different needs from those of a blog or company website. Web apps are true interfaces, and just like any application it should maximize the space available.
PRACTICAL EXAMPLES
You may have been using web applications for a while and didn’t realize that it’s using a fluid-width design. Here’s just a few examples I found:
Google's Reader Application
37signals' Basecamp Application
Apple's MobileMe Application
I think MobileMe in particular is a great example of how desktop apps are starting to crossover onto the web. As you use the web version of Mail, or Address Book it feels like a true application, and I think much of that is because it’s designed as a fluid-width interface.
I hope this has opened your eyes to this trend, and what’s possible with fluid-layouts. I really hope to see more web applications adopting this technique in the future. I know i’ll be advocating for the use of fluid-width layouts with my own clients where appropriate in the future.



2 comments
Minn Kota
May 30, 2009Nice Site, good style and good informations
Veyton Templates
Jun 30, 2009awesome, thank for sharing this great topic.