Build it Bigger, Build it Better

Build it Bigger, Build it Better!

Various viewers of the site have offered suggestions for making it bigger, better, different, louder, vitamin C enriched, and just about anything else you can imagine. Here is a sampling of some ideas that have been proposed:

CMS Zen Garden

Styling one page is nice, but what about a whole site? Why not extend the concept to different pages across a real, updated site managed by a content management system (CMS) of some sort to better reflect real-world situations?

E-Commerce Zen Garden

Similar to the CMS Zen Garden, what about styling an e-commerce site filled with genuine and constantly changing products? Options for styling could include shopping-cart widgets, sale items, featured products, and so on.

JavaScript Zen Garden

The separation of structure and presentation is a lofty goal; why not take it a step further and enhance the Zen Garden with a behavior layer that's also separate from the other two?

A great-looking proof of concept (FIGURE 17) was submitted by Rares Portan, one of the originators of this idea (www.csszengarden.com/javascript/), and a discussion about the pros and cons of adding this method to the Zen Garden ensued (www.mezzoblue.com/archives/2004/05/04/javascript_b).

Figure 17. A scripted Zen Garden submission that features moving clouds.

XML/XSLT/RSS/Whatever Zen Garden

Insert base markup language of choice, then style it using CSS. Why not show the potential of CSS when combined with XML-based languages other than XHTML?

So Where Are They?

Without a doubt, these ideas are intriguing, and many of them would provide additional useful resources to the Web design community. In most cases the originators of the ideas have received positive feedback and the suggestion that off-site demonstrations of their concepts would be welcome.

The truth is, the Zen Garden has a very specific set of goals, and it's not all things to everyone. At this point in time, a very large base of prior work means that changing the rules would alter the purpose of the site and be unfair to those who have contributed.

New sites based on these ideas could work, though. If you can build a better mousetrap, we'd encourage trying. One or two have even been built, but the results haven't lasted long. Everyone will have a differing theory for why this is, but here's what we think.

First, the Zen Garden is easy to contribute to. The barrier for entry involves having design skill and CSS coding knowledge, but an entry doesn't require weeks' worth of time. Styling a whole site is much harder, especially when the content changes frequently. When the work is compensated, it's easy to justify the time; when it's not, the time requirement is a barrier to entry.

Second, the Zen Garden's primary goal has been accomplished. It set out to change the perception of CSS-based design, and that it has done. While the specific styles involved apply to one single page, it's not hard to extrapolate and apply the principle to multiple-paged sites.

If someone absolutely can't imagine how the lessons apply to more than one page, there are plenty of real-world sites making use of standards-based design that would serve as better examples. Many large corporate sites have now switched to standards-based design: Wired News (www.wired.com), ESPN.com, Chevrolet (www.chevrolet.com), AOL.com, and many more.

The lesson learned is that the demand is high for standards across a wide variety of sites, but real-world examples illustrate the value of standards even more effectively than a Zen Garden-like demonstration site.