Graphic Design and Layout

Back in the steam age (around 1998) layout and graphic design were done with tables, font tags and other horrors that made your website unusable and unmaintainable. Here in the wonderful world of the future, graphic design and layout are done with cascading style sheets, CSS for short.

So we've got some some links to really good examples of styles for inspiration. Along the way we learned that people who go to art school are taught some deep, dark secrets in a class called "Design". We've uncovered some of those secrets, and they're here too.

We've got another page, Learning CSS that can get you started with (what else?) learning how to style with CSS.

And finally, this is like a peek at the answers in the back of the book, but it's the way we learned how to build web pages many years ago, and it's probably the way you learned too: stealing. We stole designs from sites we liked, extracted the good parts, and threw the rest away. You can do the same thing with styles, and we've got a whole section for it: Style Templates.

Web Page Design for Designers
Excellent articles. They've been around since 1996. Don't miss the article on palettes which talks about extracting palettes from photographs and using them for color schemes.
Lazycat Postcards
Postcards by Mike Robinson, each with a little nugget of design advice, that you can send to yourself or, if you've brave, to a website that looks like they need the advice.
The CSS Vault Gallery
The gallery is a collection of outstanding web pages and sites developed using simple HTML and CSS. Plenty here to spark your own design.
The CSS Zen Garden
Perhaps the most spectacular use of styles ever done. Click on the style names in the right-hand column and you'll see the page rendered in dozens of beautiful ways, all with the same page content. The only thing that changes is the style sheet.
Wireframe
If it's possible for styles to be a little too stylish, this site by Ivan Bueno at San Francisco State University is the place. But there are jillions of good ideas to steal once you turn down the temperature a little. Or does this mean we're too old?
Design Dojo
By Sam Royama. Articles on design, plus some links. This site just started up at this writing, so we'll have to see how it goes.
Color, Contrast and Dimension In News Design
From the Poynter Institute, a Flash-based tutorial on using color in design.
Superfluous Banter
A weblog by Dan Rubin and Didier Hilhorst. It focuses on design, but it covers the waterfront. Their "Weekend Reading" lists, in particular, are worth digging down into. [RSS Feed]
Spiekerblog
Thoughts about design in German and English.
Designing Better Posts
Kaye Trammell's short piece on designing in the small (her example is a single post on a weblog). Bet you don't know all the tricks she tells here.
Fake Is The New Real
We're including this not so much because of the content, but because this is a radical example of style sheets used for high style. Too high? You decide.
Design Institute
At the University of Minnesota. Good show and tell of student projects.
Articles on Visualization
From SAP Design Guild.
Design Tidbits
From SAP Design Guild.
Web Standards Awards
Very pleasant site: they recognize sites that use standards in good looking, stylish ways. You're bound to get some good ideas here.
Web Design References: Typography
Another of the University of Minnesota Duluth's magnificent meta-lists. A few clicks will tell you everything you need to know about typography on the Web.
StyleGala Gallery
More excellent standards-based designs.
The CSS Zen Garden (1995 Version)
This is brilliant: some wag has styled the normally immaculate CSS Zen Garden with blinking, throbbing colors and more animated GIFs than you can shake a stick at.