Slashdot Mirror

Is CSS better than what it replaced? In terms of element style - borders, fonts, colors, etc. - it's substantially better. But CSS sucks at layout.

Absolutely right. Done correctly, websites can degrade gracefully without a lot of intervention from the developer. And in doing so, you can create a site that's easily extensible for further development.

Do yourself a favor and get Bulletproof Web Design http://www.simplebits.com/publications/bulletproof /. It's a fantastic book and will give you a good into into how you can make changes now that pay dividends all they way back to lynx.

It depends on what you mean by "support" for older browsers. If you're looking for pixel perfection on every "supported" browser then it's mostly about how much it costs you in time and money to do that. Can you afford to make your webpage look and act the same in IE 6.x and 1.x?

If, on the other hand, "support" means "usable" then I would take a lesson from Dan Cederholm, author of Bulletproof Web Design (a great read, BTW!) He advocates using lean, semantically meaningful (X)HTML. All of the style is maintained separately in stylesheets. You give up pixel perfection, but you end up with web pages that look good in modern browsers, are usable by the visually impared, easier to maintain, and (most importantly) degrade gracefully even to the point where they are usable by the lowliest of browsers (i.e. PDAs, cell phones, webtv, etc.)

Looks like you gathered some inspiration from http://www.simplebits.com/ am I correct?

A few good places to start:

• Position is Everything
• A List Apart
• CSS Zen Garden

On the book front, must-reads include: Designing with Web Standards by Zeldman, Eric Meyer on CSS and More Eric Meyer on CSS, and Dan Cederholm's Web Standards Solutions.

Also, Veerle Pieters has a very useful hyperlinked PDF of CSS resources; the associated blog page has more details.

That lot should get you started :-) Hope that helps.

But be warned: like you I'm a hard-core, long-term technical bod, who's done everything from embedded systems software to web development, and it's only after 3 years, absorbing everything I could learn about CSS in theory and practice, and particularly how to conquer the Great Satan IE, that I've finally got to the point I referred to in my original post. To be perfectly honest, I couldn't believe it when I only needed 13 lines of hacks to tame IE on a very complex design.

So when you start, the best bit of advice I can give you is: code and test to Firefox first. If something looks a bit off, check it in Opera 8, and in Safari if you have access to a Mac. Once you've got it working across those three, everything that goes wrong in IE is IE's fault, not yours. That's when you start applying the hacks found at Position is Everything and other places, until IE finally falls back into line.

It's not as bad as it seems; if you have the kind of logical mind that goes with writing code, you'll soon begin to discern the patterns underlying IE's peculiar behaviour. (Virtually everything can be tamed using the Holly Hack, explained at Position is Everything, linked above.)

Good luck, and Enjoy :-)

Although I haven't read the book this review is about. I recently purchased another book titled Web Standards Solutions: The Markup and Style Handbook by Dan Cederholm and found it very good for beginner's to XHTML and CSS. Even my wife, who's never dabbled in web design before is enjoying it. Also, quite a few of the chapter's in Dan Cederholm's book appear on his website if you want to get a feel for his writing style.

Web Standards Solutions: The Markup and Style Handbook by Dan Cederholm Great book about designing web sites using proper xhtml and web standards. Great examples and practicle recipes!

Should I be suprised that I see no the mention of CSS3, let alone CSS2(everything is just stated as "CSS"), anywhere on Slashdot, the book's synopsis, reviews, or even the author's own website?

For all I know, it just teaches you Microsoft's faulty CSS1 specification they used back during the release of Internet Explorer 3.0 back in 1996, exciting! What could be better worse than this? Lots of things, I'm sure, but even Cascading Style Sheets For Dummies mentions CSS3 which Opera and Firefox/Mozilla support.

The book has a home page here where you can download a sample chapter.

Just wanted to say that I absolutely agree with you on this one. A good desiner's eye would make any site more usable. Fonts, colors, font spacing, paragraph spacing, paragraph width, etc etc all affect how usable the page is -- a nice looking page just makes the whole experience more pleasing. Heck, it's why people put art in their homes. It's why we have "interior decorators" and "landscape artists" -- yes, our home would be more functional if instead we spent all that money on useful things like changing around the lightswitches or buying new appliances, but in the end, the beauty of the home plays as large (if not larger) a role as the usability in the overall experience. I for one would absolutely hate to live in a house without plants, without good-looking furniture, without some art on the walls (even just my own photography) -- it would be bland and boring, regardless of how usable it is. The best homes I've seen balance utility and design incredibly -- the best web designers do the same thing to the same effect. Jacob Nielsen has only half the picture.

Hehe, Slashdot's not really a shining example of web accessibility, but it's a good place to ask for help none-the-less.

The first stops for help (as someone's no doubt pointed out already) should be:

Section 508

Mark Pilgrim's excellent "Dive Into Accessibility"

The W3C's web accessibility guide

The UK Disabled Rights Commission website, paying particular attention to the superb Interactive Demos (e.g. Inaccessible Website Demo).

Buy these books:

Constructing Accessible Websites

Building Accessible Websites

Oh, and a copy of Zeldman's Designing With Web Standards for good measure.

Write your pages using validating HTML or XHTML, and style the pages using CSS.

Validate your webpages using the W3C Validator and your CSS using the W3C CSS Validator. Use Watchfire's Bobby to validate your pages, and aim for AAA rating (also note that Bobby has some helpful hints when it does find errors).

Other excellent resources (in no particular order):

http://www.webstandards.org/
http://www.w3.org/WAI/References/QuickTips/
http://www.mezzoblue.com/
http://www.meyerweb.com/
http://www.simplebits.com/
http://www.whatdoiknow.org/
http://www.stopdesign.com/