WebDesign Filter: Is there a site that has a collection of basic page layouts that I can browse and choose from, a la the Noodle Incident's CSS box workaround page?

November 8, 2006 8:41 PM

WebDesign Filter: Is there a site that has a collection of basic page layouts that I can browse and choose from, a la the Noodle Incident's CSS box workaround page?

hello fellow web heads,

I've fascinated by patterns in GUI design, and regularily use the excellent book The Design of Sites for inspiration. I'm wondering if there's a basic equivalent of it online. For instance, if you're creating a CSS based layout from scratch, Owen Briggs 's "Little Boxes" page gives you a good basic 'gallery' of sample layouts - are there any other sites like his out there for general web design? Something that would have thumbnails of various page types ('sitemap', 'FAQ', 'gallery' - general page types). It's not so much the code as just having some sort of gallery which you can have as a reference.

Hope this is a clear enough question - thanks for any help!

posted by rmm to Computers & Internet (9 answers total)

I don't know if this is what you are looking for, and you are probably familiar with it already, but CSS Zen Garden is what comes to mind when I hear your question. It's not so much about general templates and how to build them as it is a series of demonstrations of how creative people can be in using css to design and layout a website.
posted by billtron at 9:30 PM on November 8, 2006

You might also have a look at Open Source Web Design, as they have plenty of basic design templates available.
posted by metabrilliant at 9:43 PM on November 8, 2006

Design Melt Down might be along the lines of what you're looking for. Now that they've gone through quite a bit of the broader topics, they're going into specific examples of web interfaces, such as dates, tabs, etc.
posted by chimmyc at 9:49 PM on November 8, 2006

Template Monster.
posted by Civil_Disobedient at 2:12 AM on November 9, 2006

Layout Gala has 40 off the shelf layouts.
posted by ceri richard at 2:21 AM on November 9, 2006

And more:

MaxDesign Sample CSS layouts

Dynamic Drive

CSS Tinderbox

css-d list of 3 column layout resources

posted by ceri richard at 2:37 AM on November 9, 2006

Yahoo's free-to-use design pattern library is fantastic.

You'll probably want to go straight to the UI Library.
posted by ardgedee at 2:48 AM on November 9, 2006

OSWD (Open Source Web Design) has a ton.
posted by DrSkrud at 5:12 AM on November 9, 2006

Response by poster: Thanks for the suggestions everyone - I'm familiar with all the CSS related ones. The Yahoo suggestion (also familiar with - yes, I'm geeky) is a good one and the Design Melt Down are definitely getting closer to what I'm looking for - if anyone ever comes across any other ones, please let me know ([e-mail]). The Layout Gala is kind of getting there as well - I like how the screenshots are presented. Someday I hope to find what I'm looking for - almost a Page Type UI Library. I'm still looking.

As for the CSS Zen Garden, I stroll through the CSS Zen Garden (and other showcase sites) for tranquility and inspiration. Sometimes I have a little cry while I'm there (oh, to design like that!) but I also return to them to prove to clients that this CSS thang is what it's cracked up to be. ;)
posted by rmm at 8:37 AM on November 9, 2006