(by 25 people)
When I began designing websites, my biggest concern was the finished product. I didn't care that the code was bloated as long as my site looked good in IE and Netscape. Tables, pixel shims, font tags -- nothing was off limits. Then I discovered XHTML and CSS. By embracing web standards, my productivity went way up and my clients' sites are now accessible by all.
Designers can no longer afford to simply design sites. We have to offer more to our clients or become obsolete. I hope this lens will educate readers about web standards, design techniques, SEO, web marketing and every other topic that is vital to embrace and understand.
IE7 Beta Released
Microsoft drops the ball
IE7 Beta is now available for download. I won't be installing it because Microsoft made the decision long ago to integrate IE into the OS. As a result, you can not test the beta while still running IE6.
From the MS Explorer Blog:
"The preview is a system upgrade that replaces IE6 on your computer with the preview code. As Chris Wilson pointed out, "'IE' is actually a collection of system components - networking, browser hosting, core HTML rendering, printing, etc. When we install a new version of IE, we're installing it for all applications that use these system components - including the tiny iexplore.exe itself." Because of this, we do not support the various hacks that allow side by side running of IE6 and the IE7 Beta 2 Preview. Running with these could cause issues with the stability of a system."
Since when is a beta a "system upgrade"?
Microsoft has put the call out to developers to download IE7 and provide them with feedback. The onus is on us to fulfill this request while still maintaining our sites for the majority of IE users that aren't likely to rush out and download a beta release.
Don't Code in HTML!
Read this before you open NotePad
- Write your code in lowercase. Uppercase tags will not validate.
- Close all tags. This includes non-empty elements (<p>, <strong>, etc.) and empty elements (<img />, <br />, etc.). Notice the empty elements are closed by adding " />" to the end of the element.
- Properly nest your elements. Instead of writing sloppy code, take the time to close your elements in reverse order.
- Validate your code: validator.w3.org
It's fast and easy. - Check your work in more than one browser. Most designers gave up on IE a long time ago, but close to 90% of the web-surfing public didn't. Don't ignore the browser you despise.
Amazon XHTML Titles
Web Standards Solutions: The Markup and Style Handbook (Pioneering Series)
Avg. Customer Rating: 
Amazon Price: $31.49 (as of 12/02/2008) 
Bulletproof Web Design: Improving flexibility and protecting against worst-case scenarios with XHTML and CSS
Avg. Customer Rating: 
Amazon Price: (as of 12/02/2008)
XHTML Black Book: A Complete Guide to Mastering XHTML
Avg. Customer Rating: 
Amazon Price: (as of 12/02/2008)
Dump font face
Separate content from display using CSS
- Never use a font tag again. All fonts (and colors, backgrounds, borders, padding, etc.) should be defined in an external style sheet. This allows you to make changes to the appearance of your entire site by editing one document.
- Forget using tables as a layout device. Tables are great for displaying tabular data, but they are woefully inadequate as a design tool. How many times have we all gotten lost in a never-ending maze of nested tables? Using divs and CSS positioning, designers have learned to blow the doors off old design limitations.
- Just as we did with our XHTML, we need to validate our CSS: jigsaw.w3.org/css-validator/
CSS Texts
The Zen of CSS Design: Visual Enlightenment for the Web (Voices That Matter)
Avg. Customer Rating:
Amazon Price: $29.69 (as of 12/02/2008)
Stylin' with CSS: A Designer's Guide (VOICES)
Avg. Customer Rating:
Amazon Price: $23.09 (as of 12/02/2008)
Design Software
Can you imagine working without these titles?
There will be sticker shock when you buy the suites, but you will get what you pay for. Buying just two of the products included in either of the suites will cost you more than if you went all in. For those wanting an all-in-one purchase, the Adobe/Macromedia Web Bundle is a designer's dream.
![Macromedia Dreamweaver 8 Win/Mac [OLD VERSION]](http://ecx.images-amazon.com/images/I/41W3ZGK0Z8L._SL75_.jpg)
Macromedia Dreamweaver 8 Win/Mac [OLD VERSION]
Avg. Customer Rating: 
Amazon Price: (as of 12/02/2008)
![Adobe Photoshop CS2 [OLD VERSION]](http://ecx.images-amazon.com/images/I/41GZ0WT8G5L._SL75_.jpg)
Adobe Creative Suite CS2 Premium (Mac) [Old Version]
Avg. Customer Rating: 
Amazon Price: (as of 12/02/2008)
![Adobe Creative Suite CS2 Premium Web Bundle With Macromedia Studio 8 [Old Version]](http://ecx.images-amazon.com/images/I/41MN5TCPVDL._SL75_.jpg)
Adobe Creative Suite CS2 Premium Web Bundle With Macromedia Studio 8 [Old Version]
Avg. Customer Rating:
Amazon Price: (as of 12/02/2008)
Adobe Creative Suite CS2 Premium Web Bundle with Macromedia Studio 8 (Mac) [Old Version]
Avg. Customer Rating:
Amazon Price: (as of 12/02/2008)
meyerweb.com
CSS guru
Fetching RSS feed... please stand byMeyer's CSS Texts
No frills, just solutions
Eric Meyer on CSS: Mastering the Language of Web Design (VOICES)
Avg. Customer Rating:
Amazon Price: $34.65 (as of 12/02/2008)
More Eric Meyer on CSS (Voices That Matter) (VOICES)
Avg. Customer Rating:
Amazon Price: $31.54 (as of 12/02/2008)
CSS Pocket Reference (Pocket Reference (O'Reilly))
Avg. Customer Rating:
Amazon Price: $9.95 (as of 12/02/2008)
CSS Web Site Design Hands on Training (Hands-On Training)
Avg. Customer Rating:
Amazon Price: $31.49 (as of 12/02/2008)
Choosing Colors
Looking for inspiration
Now we have millions of colors from which to choose. With so many options, how do we come up with workable palettes? Setting aside the many online sources for a minute, inspiration can come from our everyday lives. Nature is a great place to start: trees in autumn can provide us with a warm color set; rose gardens offer brilliant reds, yellows and greens; sunsets have a variety of colors that change moment to moment. Paintings, prints and photographs should also stimulate your brain. Finally, inspiration can also come from the mundane; we simply need to open our eyes to see it.
As mentioned above, there are some great online resources to aid in your search for colors. Sites like ColorBlender and ColorSchemer Online allow you to manipulate hex values by moving RBG sliders or inputting values into appropriate fields. ColorSchemer also provides palettes supplied by readers and more advanced color selection tools available for download.
Finally, other websites can provide inspiration. Using the Firefox Colorzilla extension, we can find exact color values without taking a screen capture and opening Photoshop. Use these other sites as a source of inspiration, but don't copy another designer's work. At least change the hex values a little bit!
Amazon's Books on Color
Color Index: Over 1100 Color Combinations, CMYK and RGB Formulas, for Print and Web Media
Avg. Customer Rating:
Amazon Price: $16.31 (as of 12/02/2008)
Web Color Expert: All That You Need to Create Fantastic Web Color (Web Expert)
Avg. Customer Rating:
Amazon Price: (as of 12/02/2008)
Color Harmony for the Web: A Guide for Creating Great Color Schemes On-Line
Avg. Customer Rating: 
Amazon Price: (as of 12/02/2008)
Color Logic for Web Site Design (Color Voodoo #5)
Avg. Customer Rating: 
Amazon Price: $36.99 (as of 12/02/2008)
mezzoblue.com
Zen Garden creator Dave Shea
Fetching RSS feed... please stand byLinks
Just some of many I frequent
- CSS Zen Garden
- A demonstration of what can be accomplished visually through CSS-based design.
- Eric Meyer
- CSS guru.
- Jeffrey Zeldman
- Author of Designing with Web Standards and founder of A List Apart (see below).
- A List Apart
- A List Apart Magazine explores the design, development, and meaning of web content, with a special focus on techniques and benefits of designing with web standards.
- mezzoblue.com
- Home to Dave Shea, creator of the CSS Zen Garden.
- lynda.com
- I\'ve learned a lot from Lynda\'s books on html design and Photoshop. Her online library is a great tool for designers and developers alike.
- World Wide Web Consortium
- The World Wide Web Consortium (W3C) develops interoperable technologies (specifications, guidelines, software, and tools) to lead the Web to its full potential.
- W3 Schools
- Fantastic (and free) online resource covering a wide range of web-related topics.
netgeek.com Headlines
Corey Brown got me started in web design. I stole plenty from him. Then we both had to relearn everything we knew.
Fetching RSS feed... please stand byZeldman's Headlines
Fetching RSS feed... please stand byZeldman's Books
Taking Your Talent to the Web: A Guide for the Transitioning Designer
Avg. Customer Rating:
Amazon Price: (as of 12/02/2008)
