CSS Zen Garden -- an Eyetools Eyetracking Analysis

Design decisions affect what people read. The CSS Zen Garden always has the same content but different visual treatments -- and you can see how this affects reading.

Same content, different visual treatments
Original homepage (live site)	Version 145 (live site)

CSS Zen Garden is a beautiful place -- it demonstrates the power of Cascading Style Sheets (CSS) and the flexibility of design because the content is always the same but the visual treatments are very creative and very different! Here are two examples (stay tuned for more in the future).

Notice that version 145 has great use of sub-heads and increased reading of the paragraphs below them relative to the original homepage.

The navigation bar on Version 145 is viewed and clicked more.

Also the wider column gets less reading across the width of the page on the original homepage. You can see people start to read and then stop.