Web Design Trend Hunting – Fluid Grid Layout: 10+ Outstanding Examples & 1 Tutorial

In our daily web hunting raids we have spotted another interesting & good-looking trend – the fluid grid-based layout, mostly used by galleries and visual inspiration blogs. Here are 12 amazing examples (just one of them in Flash) and a fantastic tutorial. Please use the comment box for suggestions and opinions – Will the future of webdesign be fluid?

Creative Depart

creativedepart

Isolation Unit

isolation

Reform & Revolution

reform

Xpaider

xpaider

Heavy Eyes

heavyeyes

De51gn

de51gn


Positively Melancholy

pm

siXsiXsiX

sixsix

Type Neu

typenew

This Also

thisalso

dmtr

dmtr

Space Collective

space

Tutorial – Building Good Websites with Fluid Layout

tutorial

PS: Almost all this websites are usng the Grid-A-Licious theme folks!

Related Articles

Catalin is the founder of Mostash - a social marketing boutique - and he's always happy to share his passion for graphic design & social media.

 
Inspired Mag recommends Elegant Themes - 69 brilliant WordPress themes for only $39!
Backup Buddy

Each of the 69 premium WordPress themes from Elegant Themes comes expertly coded in valid XHTML and CSS, and all are made compatible with the latest version of WordPres. Eeach template performs flawlessly in each of the most widely used browsers to ensure maximum functionality. Furthermore, all sidebars are made widget ready for your convenience.

  • Cross-browser compatibility guaranteed
  • Intuitive theme options page gives you control
  • A focus on support and community
  • Frequent theme additions and upgrades
Find out more about Elegant Themes

Comments

  • Mip July 3, 2009

    Great list. Nice job.

  • Mahallo Media July 3, 2009

    Thanks for this cool list.

  • Edward.H July 3, 2009

    Great collection,good job! I’v submitted a link of this article to our website http://www.webmasterclip.com in order to share it with more people.Thanks~

  • Christian July 4, 2009

    I think 90% of these are modified versions of Grid-A-Licious theme by Suprb for WordPress. I might be wrong though.

  • Marko July 4, 2009

    Some nice samples here.

  • Massimo Marolda July 4, 2009

    They’re all based on a theme released by typeneu and reform. Not that creative action to follow.

  • Byron Edwards July 4, 2009

    The WordPress grid-a-licious theme (used in many of the above) probably deserves a mention…

  • Web Design Mumbai July 4, 2009

    i seriously feel this will be a must for every website coz of the immense variety of screens we have so far. don’t know how many more sizes will we see in near future.

  • Greg July 5, 2009

    We use something similar on our site http://www.nofavorite.com.

  • Catalin Zorzini July 5, 2009

    Thanks guys, almost all the credit goes to teh Grid-A-Licious theme!

  • Jake Rocheleau July 5, 2009

    Perfect article, exactly what I was looking for thanks!

  • Trendland July 6, 2009

    Nice review,
    We’ve been having a custom grid theme for 6 months already, dont know if you saw ours, but it a little more complex than those one, and thanks god, there is nothing similar on the web (yet! unfortunately it will com one of those days)

    Have a look at http://cyanatrendland.com and especially our gallery page http://cyanatrendland.com/images/

    Let me know ….

  • Daniel H July 7, 2009

    Bear in mind that the majority of these sites use the same theme – Grid-a-licious – with the colours tweaked…

    http://suprb.com/apps/gridalicious/

    I have stopped posting Grid-a-licious themed sites on http://siteinspire.net because I think it’s time for something new…

    And also all these sites are ‘matrix’ or grid style layouts. Would have been more interesting to see fluid application or editorial layouts since this is much more challenging to do well.

  • Richard Brown July 16, 2009

    Great examples of decent fluid grid layouts. I’ve just completed my company site using a nice fluid grid layout at http://www.zaum.co.uk

  • Zoe Gillenwater July 22, 2009

    I don’t get it. I tried the first six sites and only one was fluid — aka, it changed width with the window. What are you guys seeing that I’m not?

  • Terrance(OXP) July 25, 2009

    Different feel of layout which can provide the most visible information to visitors at one instance. Nice concept.

  • xyxjasilixyx July 25, 2009

    Nice article.

  • Chauncey July 29, 2009

    I cant at all get gridalicious to work. I was excited thinking these were other grids that had nothing to do with grid-a-licious. this is my site. id like a grid approach with categories. if anyone wants to contact me and sell me their wizadry at a good decent price. my twitter is girlonthestreet. thanks!

  • trendland August 15, 2009

    Its getting closer and closer from our layout – but nothing like it yet – still way ahead in the trends…

  • Cracka August 25, 2009

    doesn’t grid-a-liscous rely 100% on javascript? and with JS disabled, the sites literally fail to render in any readable form..?

    i’ve tested the grid-a-liscious site itself, and w/o JS, it fails to degrade with any grace what-so-ever.

    have i got it wrong, or should sites still load without JS ..?

  • Dominique's September 18, 2009

    You’re internet’s going to suck without JS anyway right? People keep giving all the credit to Grid-a-licious which is based off Space Collective’s card theme done 2 years prior.

  • Dominique's September 18, 2009

    Damn you”’r'e’re’

  • psiew February 11, 2010

    Makes me giddy. Seriously

  • John mahoney March 6, 2010

    great, but what’s with the tutorial link?

  • L May 16, 2010

    Hi,

    I was wondering if you could point me in the right direction. I am looking for a fluid grid layout for my portfolio on WordPress. I would add tomy page and then tweak the colours and stuff to make it more of my own. Do you know any WP templates where you can get the layout for free?

  • Career Outlook August 7, 2010

    Hey Catalin,

    Its really a very nice collection, keep up the good work :)

    cheers

  • dfunk September 7, 2010

    Are there any open source or cheaper alternatives to grid a licious?

  • Greg Formager January 5, 2011

    Yep, try the tanzaku theme for wordpress

  • Diaghe March 25, 2011

    Dfunk try http://cargocollective.com/
    great cms and creative community, creating by the same guy who created Space Collective if I’m correct..

  • Diaghe March 25, 2011

    *created

  • hans December 14, 2011

Leave a Reply

Trackbacks

Hosted By

7,366 Friends & Subscribers

Newsletter

Signup for our newsletter

Ads

Aff Ads

Elegant Themes
My Recommended Hosting Service
Try Market Samurai now for free!

Ads 2

Recent Comments

  • Boise Webmaster: I really like the Cassius site. Awesome use of color mixed with black & white.
  • John: Nice list. Here’s one that is being used on a professional manner: http://www.mantis-tgi.com Navigating...
  • Cincinnati web design: Its really funny to see some of these comments from two years ago. Lets see if the iPad gains...
  • deborah: well it’s 2012, what are best apps today?
  • wer: My favorite tumblr right now is braceli.tumblr.com all about eye candy art but also greasy sandwiches, ice cream...
  • Rafael Marques: thanks for the opportunity =)
  • Peter Green: How about http://www.volgaverdi.com, probably the brightest site ever
  • Robert Samuel: Being in marketing, I knew that advertisement overload was an inevitability. Anything that takes off...
  • Brian morgante: thisiswhoi-am.tumblr.com – a place where individuals have a platform to share their hearts,...
  • Justin Carroll: What you call “Man Power” is by far the number one problem with companies and social...
  • Ben G: There are too many advertisements on this website. Great architecture in the article though.

skyscraper

Evanto

Smashing Network