A webpage is not the same as a printed page. With a printed page, there is complete control. The designer knows the exact dimensions, the exact number of colors and how it will be printed. With a webpage, all of these factors vary by computer platform, graphic card, monitor size, and web browser. I remember working with one Creative Director years ago. He was very traditional and would comp everything on a pad. He was scared to use a computer … even just to turn it on. Eventually, he got over this fear, but it was still an uphill battle to explain that his designs would not work on the web. He thought print and wanted everything to be print.
Dan Cederholm understands this very well. He has written three books about it:
- Web Standards Solutions
- Bulletproof Web Design
- Handcafted CSS, More Bulletproof Web Design
Peachpit just released the DVD Handcrafted CSS, narrated by Dan Cederholm.
Dan defines “bulletproof” as taking web design to that extra level of detail beyond accepted standards, by striving to make designs difficult to break under different environments. 100% Bulletproof is not always possible due to a variety of factors (ex. integration requirements, CMS hooks, new browsers and platforms, etc.). But, it’s the details that set apart good web design from great web design.
Dan breaks bulletproof into 10 principles:
1. Turn off images to ensure a page is still readable in absence of graphics.
2. Let go of pixel precision.
3. Provide a flexible base for text using relative terms instead of pixel sizes.
4. Increase the text size through the browser to see if the design holds together. (The “Dig Dug” Test)
5. Accept the Box unit, but dress it up.
6. Use Progressive Enrichment for proposed CSS codes which will be supported by new browsers and ignored by older ones.
7. Recycle/Reuse elements and images to unify designs and reduce loading.
8. Master the Float! Using Float in CSS guarantees flexibility.
9. Turn-off CSS to see if the web page is still readable. By using Lists to organize elements, your hierarchy will be preserved.
10. Validate your code. It can help you debug and spot problems.
The DVD is great for anyone that codes web pages. Each of these principle are covered with visual examples. The DVD will provide reassurance to all those things which you were doing … but not sure why. It is also great for those art directors that refuse to acknowledge the web as its own medium. If nothing else, it will get you thinking about keeping web pages flexible for future growth and development.