Designing With Web Standards

carl67lp (Carl Anderson) writes "I was recently charged with redesigning my University division's Web site. I hadn't designed a Web site in quite some time, and I wanted to ensure that I did so with everything being 'proper'--the nature of our projects require as large an audience as possible. When I saw Designing With Web Standards available on O'Reilly's Safari bookshelf, I knew I had to snag it. And now, after finishing the book (the first IT book I've ever read beginning to end!), I'm here to preach the book's virtues as the author preaches those of Web standards." Read on for Anderson's review of the book.

Designing With Web Standards
author	Jeffrey Zeldman
pages	456
publisher	New Riders
rating	9/10
reviewer	Carl Anderson
ISBN	0735712018
summary	An excellent guide on designing a Web site with the latest Web standards

Jeffrey Zeldman is one of the best technical writers whose work I've had the pleasure of reading. He is obviously well-educated with regard to the subject, and his passion for the work really shows through. Still, he never comes across as a zealot -- his style is even-handed, thoughtful, and easy to comprehend.

The first part of the book ("Houston, We Have a Problem") is the reason I give a rating of "9" rather than "10." Zeldman spends a perfect length of time on background and history of Web standards (why they're here, and what designers did before they emerged). However, this section seems to suffer from what many technical books suffer from: a case of "We'll see this soon"-itis. While this is perhaps unavoidable in such a treatise, it is nonetheless apparent. Still, it's only marginally distracting.

The meat of the book comes with "Designing and Building." Zeldman first talks about modern markup, then explains the variations on XHTML (i.e. Strict, Transitional, Frameset) and how each ought apply to your design. Here we see more theory than practice, though, but this is welcome -- it lays the foundation for a more cerebral look at distinguishing markup from design. Once Zeldman explains the nuances of that topic, we moveon to the redesign of a Web page constructed with a hybrid table/CSS design complete with all the excellent effects we hope to see in modern pages.

After working through this redesign, Zeldman talks in more detail about the CSS box model (and the browsers that break it), typography, and some of the quirks that Web designers must deal with. Next he touches a bit on Web accessibility--a must-read for everyone, whether you think so or not.

While Zeldman isn't incredibly thorough here, he doesn't need to be--it's a book on Web standards, after all, and this chapter serves to show how accessibility can still be achieved within those standards. He also suggests a couple of other books for more information.

Finally, Zeldman walks the reader through a redesign of zeldman.com, basically as a hands-on summary of the book, and as a guide for future projects. Also included is a "Back End" (i.e., appendix) showing some excellent information about each major browser.

Too often, a book or Web site on XHTML/CSS will dwell only on the "how"--this book shows the "how" and still explains the "why": Here's how you set up an id'ed element; here's why we do that, rather than using a class. It's already opened my eyes to many things I thought I had a handle on, but now realize that I only knew in a cursory fashion.

So, ask yourself: Do you want to design a Web site that will work for everyone, regardless of their platform? Do you want to make sure your Web site is future-proof? If so, you need this book.

---

You can purchase Designing With Web Standards from bn.com. Slashdot welcomes readers' book reviews -- to see your own review here, read the book review guidelines, then visit the submission page.

The back cover

You code. And code. And code. You build only to rebuild. You focus on making your site compatible with almost every browser or wireless device ever put out there. Then along comes a new device or a new browser, and you start all over again.

You can get off the merry-go-round.

It's time to stop living in the past and get away from the days of spaghetti code, insanely nested table layouts, tags, and other redundancies that double and triple the bandwidth of even the simplest sites. Instead, it's time for forward compatibility.

Isn't it high time you started designing with web standards?

Standards aren't about leaving users behind or adhering to inflexible rules. Standards are about building sophisticated, beautiful sites that will work as well tomorrow as they do today. You can't afford to design tomorrow's sites with yesterday's piecemeal methods.

Jeffrey teaches you to:

* Slash design, development, and quality assurance costs (or do great work in spite of constrained budgets)
* Deliver superb design and sophisticated functionality without worrying about browser incompatibilities
* Set up your site to work as well five years from now as it does today
* Redesign in hours instead of days or weeks
* Welcome new visitors and make your content more visible to search engines
* Stay on the right side of accessibility laws and guidelines
* Support wireless and PDA users without the hassle and expense of multiple versions
* Improve user experience with faster load times and fewer compatibility headaches
* Separate presentation from structure and behavior, facilitating advanced publishing workflows

Re:The back cover

I picked up this book about 2 months ago and it really is one of the best buys on my shelf. Zeldman's book and his sites are wounderful resources that not only contain a good deal of info themselves but point you in the right direction to a really great community of like minded, forward thinking developers.

XHTML & CSS are tough sometimes, and Zeldman's realistic approach to transitioning to a standard web language is refreshing - he's not a zealot.

I hope more web designers will jump on board this movement - if we ever want to get paid really well and escape the image of the teen with frontpage coding his uncle's website we need to embrace these kind of ideas.

Re:The back cover

It's time to stop living in the past and get away from the days of spaghetti code, insanely nested table layouts, tags, and other redundancies that double and triple the bandwidth of even the simplest sites.

*sniff* So long, Slashdot, we'll miss you.

Re:The back cover

You fool. Microsoft's Internet Explorer sets the only "Standards" worth following. Who do you want to view your pages...95% of all users out there, or some wierdo from flyover territory with his pre-paid cell phone?

I'll take the bait: I want Google to index my site, and Googlebot isn't one of the "95% of all users" running MSIE. Making full use of web standards helps search engines index my pages, saves bandwidth costs, reduces development and maintenance effort, and makes pages load faster for MSIE users, in addition to helping users of other browsers, portable devices, and assistive technologies for the disabled.

Re:The back cover

and is using a Pentium 4 2.4Ghz machine

or at least he thinks he is!

Mmmhmm

So, all those things in the book are great and all, but what about Flash? You can do no wrong with flash, you know.

Re:Mmmhmm

Flash isnt a web standard (it has quite a large user base though). The W3C standards answer to flash is SVG which is pretty similar except it ties in with HTML/XML/CSS etc much better, flash is just a hole in the browser where a plug-in is put, while SVG (can also be a plugin) is much more integrated. SVG is also a 'text' based standard like HTML - ie its made up of tags and stuff so its in theory much easier to write generating software for it and link it with server-side scripts and even with client side java/vbs etc scripts (why re-invent the wheel with flash scripting and proprietory expensive server-side software when you can use existing layers like perl,PHP,java,asp, basically anything?). While flash is a more closed system designed by Macromedia to fill a gap in a business like manner, SVG is structually better - kindof like the way HTML tables were/are used to design sites, they are a work around where-as CSS (if the browser supports it properly) is a far better more structured way to do the job.

Flash probably runs faster and has more support, plug-ins and editors on most computers at the moment but SVG is catching up (also SVG supports compression which is cool so it can match flash in file-size).

So basically the book would talk about SVG if it talked about any vector/animation system.

(And without trying to sound like a troll:
Flash = Cheap Hack, SVG = Potentially Structured Nirvana)

Re:Mmmhmm

You can do no wrong with flash, you know.

Ladies and gentlemen, we now have proof of the existance of the Anti-Christ, here on Earth! First, the user name "illuminata" is too Luciferian to be denied. Next, note the Slash UID 668963 containing "the Number of the Beast". Finally, we have the demonic message itself!

Prepare for the Apocalypse, for it is surely at hand! Slashdot has spoken!

Related resources

He also has an excellent list of related resources and links on design and accessibility:

http://zeldman.com/externals/

Re:Related resources

In general, a lot of the stories at A List Apart is worth reading: http://www.alistapart.com/stories/

A site worth visiting is http://www.csszengarden.com/ - having lots of alternate stylesheets.

I'm currently working on a project with a designer w/clue. Everything regarding looks and design has moved into stylesheets. All I have to do is to structure the data in suitable divs/blocks (with regard of continuity for the simple text-based browsers).

You mean...

You mean it's not enough to make sure it works in IE6 on Windows XP?? I wish more web "developers" were concerned with standards. Not only does it make their job easier, it makes it easier to use their sites (assuming the browser developers are equally concerned with standards).

Re:You mean...

Make your main stylesheet, then figure out which things don't work correctly in Netscape 4 (e.g. the width of a box incorrectly includes the padding, so for NS4 you should add the left and right padding when specifying a width). Where they differ, put the Netscape 4 code in the main stylesheet and the standards-compliant code in a second stylesheet. Comment the main stylesheet so you remember which code is specific to Netscape 4. Then load your stylesheets like this:

<link rel="stylesheet" href="/main.css" type="text/css">
<style type="text/css"><!--
@import url(/not-netscape4.css);
--></style>

Any browser except Netscape 4 will load both stylesheets, so the standards-compliant code in the second one will override the Netscape 4-specific code in the main one.

So, ask yourself

Do you want to design a Web site that will work for everyone, regardless of their platform?
YES!!!

Do you want to make sure your Web site is future-proof?
ABSOLUTELY!!!!!!

If so, you need this book.
oh

A good follow-up book is...

Eric Meyer on CSS. I finished Zeldman's book about a week ago and am now going through Eric Meyer on CSS. Zeldman tells you what needs to be done, and gives some examples, Eric Meyer gives you a bunch of practical examples. Guess this is why can be purchased as a pair at Amazon...

First Book is Better

I agree that he is an excellent tech writer. However, I thought his first book was much better than this one.

A Review Can Be Found Here [codekit.com]

Although I am not very good at web design... what I have learned, I learned from this guy. He rocks.

Davak

The only standards on web code is....

The only standards you need to follow are the W3C Web Standards [w3c.org] They even have a validator for your convience if you need to make sure that your code is valid. I did that at my summer internship and over the course of a summer was able to make our 1000+ page website 99% w3c complient. It might take you a few days to get in the rythym of doing things, but once we had our site up to html 4.01 standards, we never had a problem with any browser compatability issues, and we tested all the way back to Netscape 4.7.

Standards? What standards?

Since when does the web have standards?

Check out the css Zen Garden...

I happened across this site the other day... it really shows off what CSS can do. No idea how it looks in IE, but in Firebird it's pretty amazing. Pick a design from the left and note that it's all style sheets...

http://www.csszengarden.com/ [csszengarden.com]

So, where's the web site?

Where is the completely compliant web site that thet reviewer was designing prior to reading this book? It would be pretty darn interesting to see what it looks like.

future-proof? no such thing

A Web page that was HTML 3.2 compliant is not standards-compliant at all these days.

How do we know the W3C won't change the standard AGAIN in three years?

Buy It Link

Bookpool [bookpool.com] is always cheaper!

If only the boss could understand the virtues

It seems to me that the larger problem with web standards' adoptions is that many managers would prefer to just have crap, so long as they can have it "right now", and forego the longterm financial savings that web standards coding can provide. I would like to see a book on how to implement a web standard or two that will really save a lot of time right from the beginning, versus the kinds of major changes that take weeks to months to implement -- weeks & months that no small-business manager wants to pay for.

Zeldman.. Hmmph!

I like standards. I like accessibility and usability. I hate Zeldman's site. It's like hypocrisy in motion. If I lectured on web design and make sites usable, I might improve my site from where it is.

Zeldman makes life tough on older viewers, disabled, and newbies. His labels are quippish and arrogant, his colours too similar, fonts too small and not resizeable in the most prominent browser out there.

Take a look around and you'll probably find better books on standards. Or, if you must, take the gospel of Zeldman and water it down with a little Jakob Nielsen.

What about CMS solutions?

Forgive me if this sounds clueless, but most people who are given the
task of setting up a web site are going to be looking at ways to not
have to do it from scratch. There are a lot of CMS (Content
Management Systems) out there, some free, some not. What *I* really
need is an O'Reilly book about CMS that helps wade through all the
stuff that's out there right now so the reader (me) can make an
informed decision about which way to go.

I did a quick check of the O'Reilly web site and all their CMS info
revolves around XML and Java. This does not help me.

Someone get this guy a GF

Am I the only one who noticed that his website [zeldman.com] is Supported by XDate Speed Dating, 30Dates Speed Dating, and for free online dating, xdate.com?

Maybe he should take a break from writing and get out to the bar a bit more.

Geesh, don't be silly...

Just open up MS-Word and use File-->Save As
web page
Voila! You have now created the perfect web page in ten seconds!
Microsoft takes care of all of the standards stuff so you don't have to worry your pretty little head about that. No really...don't worry.
No...don't do "View Source"
NO! Don't! EVERYTHING IS OK!! STEP AWAY FROM THE KEYBOARD

Standards make life easier for everyone.

Taking a few extra steps to ensure standards compliance is well worth it.

I've found that standard compliant web pages tend to be more interoperable between browsers (sadly, there will still be differences). This makes it easier for you since you won't have to work as hard to find ways to make your site look good in several browsers. It makes it easier for viewers because they can use the web browser they like the best.

The only problem is that there are a lot of people who still browse on old hardware that has Netscape 4.x on it. Netscape 4.x tends to mangle CSS pretty badly.

This book is excellent

I would say this book is as close to a 10 as possible.

The first historical overview mentioned is very nice, but can be skipped. However I feel it is an important part of the book, and gives weight to the arguments on why using the standards way later on. It also gets designers new to the web up to date on what has passed, and highlights mistakes that were made (so we can possibly avoid them again).

Otherwise I agree fully with the author, the book is indeed both well written, has a nice flow and really gives good arguments why this is the right way, and how to do it the right way. The authors attitude is never arrogant, and the solutions are always practically oriented and work well in real-life (unlike a lot of other books on HTML and CSS).

My take on this book is that if you want to read one book on web design this should be it. Of course after having read this book you probably change your mind and start looking for other literature by the same author :)

Perhaps...

... someone could spring and buy a copy for our hosts [w3.org]?

Granted, some parts of the W3 standards are worth breaking (wrap attributes in textrea inputs, for instance), but c'mon.

J

Here's to reading books from start to finish

Reading tech books from start to finish is quite underrated. I find that if you don't read every word in a tech book, one often misses important information that can save a lot of time.

Standards aren't standard

Imagine a world where valid xhtml/css websites rendered the same in all browsers. Imagine a world without Internet explorer.... ahhhhhh.

Unfortunately, very few sites out there that work in all browsers correctly are compliant.

I guess it's a toss up: have a little validator button proudly displayed somewhere on your site and have a few display errors in Internet Explorer or have a messily coded site that is slow, but works.

Too bad nobody follows standards

Standards are nice. It's a cryin' shame nobody follows them though. Sure, it takes considerably longer to make your site standards-compliant and geeze, we can't cut into our bottome line, can we? We gotta get that site out right away. Screw Mac users. Or screw AOL users. Let's just code for IE. It's a nice dream but unfortunately I don't see it being used in the real world.

Another unfortunate tidbit...I work for one of those places. I know the aggrivation of trying to get compliance through to people who just won't listen. *sigh*

Usings standards to save size

Our faculty of the university at which I work has decided on a new layout for their web pages. This was done and delivered to us by a PR agency. I feared that it might be bad, but that fear didn't even come close to what I had to witness.

Imagine having to tell our users (many of which are using GNU/Linux or Macintosh) that our web site only works reliably in Windows with Internet Explorer 6.0 and above. Just because a PR agency can't develop web pages. It's impossible. I had to do something about it.

So when I implemented the layout for our department (scheduled to go live later this month), I scrapped everything they had done. I took a printout of their page (as it looked in Internet Explorer) and marked up what colors and fonts they had used.

Then I set down and wrote the same thing using XHTML/1.0 Strict and CSS1. This was about two days work, but the finished result now validates using w3c's validate tools, and it works reliably in all browsers I've managed to try, all the way back to Mosaic and Netscape 3, with or without images (yes, Lynx, Links, w3 and other text browsers work very well indeed too).

Not only did I get the pages to validate. By using CSS, I was able to get rid of several images they had been using with their design. The overall size of a page, including graphics and CSS, now weighs in at about 35 kbytes. This is compared to around 120 kbytes with the proposed code.

And even better, most things can be cached by the browser (CSS code and images). The only thing that needs reloading when you hit subsequent pages is the dynamic XHTML code, which weighs in at around 5 kbytes, compares to 40 kbytes in the proposed code.

Now, I think our students will like us. This result is even better than the pages that we have today. They render quickly and effortlessly even on old equipment or on extremely slow links.

I havn't been able to convince the faculty to make my code the "default" yet, but they might get the idea once people start noticing that our pages load much more quickly than the rest of the faculty pages.

So, using standards isn't always about making things render nicely in all browsers. It gives you a while heap of nice side effects that isn't worth sneezing at.

Stop IE Now!

It's irritating the way the world is enslaved to such an awful spyware-magnet standards-flouting browser as MS Internet Explorer.

Microsoft declared IE6 SP1 as the last standalone browser for lame-ass reasons. The truth is, they're only truly integrating IE into the next Windows Operating System for the first time, to prove their 'point' in the anti-trust case that they couldn't remove the browser from the OS.

If IE really was such an integral part of the current slew of windows versions, how come it takes ridiculously long to load when you enter a URL into the address bar of an explorer window, and that the people at LitePC [litepc.com] was able to remove IE from the Windows operating system?

Bunch of liars. Guys, help educate everyone and have people switch to either Mozilla [mozilla.org] or Opera [opera.com] -> Makes Windows boxes more secure and gets rid of the need to buy those stupid superflous pop-up killers. (you can pick up viruses or spyware just by surfing a maliciously coded website and hitting the wrong button)

None of my family and friends use IE anymore after I educated them about the dangers of IE.

Web Standards?

It's no surprise [w3.org] that CmdrTaco didn't write this review.

*cough*

Standards are about more than multiple browsers

Using XHTML and CSS makes maintenance a lot easier. It makes for leaner code, which results in faster-loading pages. Zeldman's book shows you how to apply XHTML/CSS in a manner that actually works in the real world. In order to get even more value out of the Zeldman book, check out its logical companion, Speed Up Your Site [websiteoptimization.com], which focuses on optimizing your code for speed, and for search engine visibility.

But Really doesn't everyone have IE

Well isn't all that .asp .net stuff that standard, doesn't everyone have IE. Well then they should be required to or they can't use my web site. I don't want to be bothered with things I can buy from Microsoft. They invented the Web didn't they, no that was Gore, but they wanted to, so we should let them own it.

Can't wait till we need to apply for visas for our Passport access to other countries.

I don't mean to be rude..

but if it's the first IT book you've read completely, isn't it a little presumptuous to write reviews? I certainly didn't consider myself a movie critic after watching my first movie.

I'm not saying your review is wrong or bad, but maybe get some experience in what you're doing before preaching to others?

And Slashdot's score...

Check out how slashdot made out...

URI:
Encoding: iso-8859-1
Doctype: HTML
Errors: 407
Revalidate With Options
:
Show Source Outline
Parse Tree ...no attributes
Validate error pages Verbose Output

* Note: The URI you gave me, , returned a redirect to .
* Line 71, column 115: cannot generate system identifier for general entity "alloc_id"
* Line 71, column 129: cannot generate system identifier for general entity "site_id"
* Line 71, column 139: cannot generate system identifier for general entity "request_id"
* Line 161, column 62: cannot generate system identifier for general entity "group_id"
* Line 161, column 76: cannot generate system identifier for general entity "atid"
* Line 241, column 74: cannot generate system identifier for general entity "tid"
* Line 241, column 156: cannot generate system identifier for general entity "mode"
* Line 241, column 184: cannot generate system identifier for general entity "threshold"

This page is not Valid HTML!

Line by line of errors

---
Nice!
407 lines of errors...

Speaking of standards...

...when is Slashdot.org going to become W3C compliant?

What's it called when someone tells you do do something, and then does the opposite?

Oh yes, that's hypocrisy.

here's one thing to make sure you don't to

Do not use style sheets to adjust the font size and the spacing between lines. I am not alone in having a high resolution laptop screen and I've seen too many pages that are unreadable. I adjust the settings in my browser to increase the font size so I can read it. However, when I get to one of these pages where they make the font size really small I adjust the font size so it's big enough to read. However, the font is larger but the spacing between the lines is the same, so all the words are crowded together. I hate this standard and it should be avoided at all cost

zeldman.com: a case study in usability?

i go to zeldman.com using ie5. i change the browser's font size from "medium" to "largest." nothing happens (except that the left-hand navbar button spacing increases a bit). i change the browser's font size to "smallest." nothing happens (except that the left-hand navbar button spacing decreases to zero). need i say more?

yawn

Use Macromedia Fireworks. Perfect WYSIWYG with Photoshop-like input. Never touch HTML again unless you're writing some sort of webapp, in which case you should be using a templating system and the HTML should be separate, and you can still use Fireworks.

Three words: NON RECTANGULAR SLICES (part of FWMX2004). God's gift to the Internet, Fireworks is Moses.

Quit wasting your time and get stuff DONE.

This stuff is important

I know most of the /. crew thinks of web design as a frivolity [the people who manage /. certainly do] but adopting CSS [yes, even for layouts] is important for a number of reasons. It introduces structure to the content that makes it easier to generate, maintain and manipulate. It means that people using old/weird clients [yes, even line-mode browsers] can still use your site. It means that search crawlers have a better chance of getting good info from your site. It means that engineers won't have to support wonky javascript for rollovers or browser sniffing. It also means that programmers never get that Friday at 4:30 pm phone call from angry marketroids who are upset that something is a pixel off. Isn't that worth it?

For designers this is important as well, as it can make your job easier in some ways. It can also make it more difficult, explaining to your client/marketing person/product manager that it's not going to look identical in every browser is a tough sell at this point. Also, web design is finally becoming its own discipline. As designers we are now responsible for helping our clients and coworkers structure their information in ways that is more flexible and useful. We're not painters anymore, we're part of the construction team.

Is support perfect across all clients? Nope. Will it ever be? Hell no. Is it good enough? YES.

Here's some links that show off the potential of CSS:

• CSS Edge [meyerweb.com]
• Taming Lists [alistapart.com]
• The CSS Zen Garden [csszengarden.com]

latest web standards != largest audience

If you want the largest audience possible, then using the latest web standards, such as promoted by Zeldman, is not what you want to do. The reason for this is because not all web browsers in current use work with these standards. And there are many reasons people won't or can't upgrade those browsers.

There is a way to make web pages so that they can use standards, and still work on older browsers. However, you might not like the end result. What you get on the older browsers is a very poor presentation. For example, if you define the look of your page in cascading stylesheets, when viewed on a browser with no support for CSS, you get crap.

Boundary conditions are even worse. If the browser is a version that tries to support something, and does it wrong, you can get even worse that crap. It might not work at all.

Mixing standards can cause problems as well. Here is an example. Lots of designers seem to like blue backgrounds for the side rail menus. But lots of web browsers default to blue for hyperlink text. If you specify the color of the text in a stylesheet, but specify the background color of a table cell (or worse, the whole page), in HTML, then you can end up with a situation where some of what you specify is acted on, and some is not. You'd end up with blue text on a blue background, and therefore unreadable.

It would be great if everyone could upgrade to the latest browser. But if you are trying to reach the widest audience possible, you do have to consider that many in that audience will be using older computers which have smaller drive space, smaller RAM space, slower CPUs, and can only run older versions of operating systems and browser software. While Linux might well be a great replacement for old versions of Windows on those machines, you still have the problem if shaving a recent version of some Linux distribution down to fit, and getting a huge obese browser to run on a tiny, slow, machine.

Here is an example of a real web site [state.tx.us] done in a way that displays terrible on some browsers. You can see what it looks like in Netscape 4 in PNG [ipal.org], or JPEG [ipal.org], or true color GIF [ipal.org] (works on Netscape 2 and later) formats. If you scan very close in the blue area on the left (this does not work with the JPEG image), you can see that the colors are #5a61a9 for the background, and #5b61a9 for the text (specified by their HTML in the body tag, so they intentionally did this). By radically exaggerating the red plane (e.g. everything #5a and below is made #00, and everything #5b and above is made #ff), you can see (PNG, [ipal.org] JPEG [ipal.org]) the text was really there. And you'd think that a state government would be concerned enough about making their site available to all audiences, including the economically disadvantaged who can just barely even get a computer and internet access. But no, they don't actually care (I talked to these people, and they really don't care). Here is another crappy web site [state.oh.us]. By comparison, this site [wv.gov] and this site [state.pa.us] look fine in this older browser.

Re:latest web standards != largest audience

First of all, those sites you mentioned are anything but shining examples of using the 'latest web standards.' Not only do they not validate, but they aren't even attempting to follow Zeldman's philosophy at all. Your close-minded self-righteousness only reveals your lack of knowledge about the web standards movement. Zeldman is no idealist; he is not espousing 'the latest web standards'. He specifically talks about using web standards to solve real world problems. Using his approach you can create sites that look great in IE 5, 5.5, 6, IE Mac 5, Opera, Mozilla, Netscape 6, 7, Konqueror and Safari while degrading to be perfectly accessible in Netscape 4-, IE 4-, Lynx, etc.

Now, depending on your audience, you may have to make sure the Netscape 4 version looks visually impressive, but don't think for one second that building your site using tables, bgcolor attributes, and font tags will be done without sacrifice. In web design there is ALWAYS sacrifice, it's just a question of what. If you build a web site using Zeldman's method you sacrifice:

• Complex layout in browsers v4 and under.
• Certain techniques that were refined during the era of the v3 and v4 browsers for pixel precise layouts.

Now if you resort to tables and font tags and the rest you are sacrificing:

• Size - pages quickly become bloated with nested tables, redundant font tags and unnecessary images.
• Legibility - Everything is nested in table after table with no clear meaning to different tags.
• Forward-compatibility - You are betting on browser makers continuing to support non-standardized metrics that arose by coincidence.
• Accessibility - You don't need standards to support accessibility, but the two really go hand in hand. Using HTML tags as they were intended improves accessibility for non-standard user agents. Adding alt attributes, summaries, skip navigation links and more advanced techniques that are possible with standards make your site infinitely more usable for a blind person.
• Degradability - If your tag soup doesn't work in a browser you likely get something messy. If a browser doesn't support a standards-based page then maybe you lose the text formatting, but the information is still there.
• Development time - sure standards are hard to use if you've spent 10 years perfecting image slicing and table nesting, but table-based layouts are much more difficult to modify, update, output from server-side scripts, screen-scrape, or otherwise mess with in typical ways that web designers/developers are often asked to do.

Your excuses for dismissing standards are all red herrings. No matter how you develop, you are going to have to test your pages in all your target browsers anyway. However, using standards gives you a better chance with untested and future browser releases. Of course they are far from perfect, but resorting to outdated techniques doesn't improve the situation, regardless of how comfortable you might be with it.

Convince your PHBs

If you are having trouble convincing management that your site needs to be comply with web standards and you are at all involved with Federal contractors, academia, or any kind of service agency, drop me a line; I am a developer for the Program on Employment and Disability, and we do a lot of work with Section 508/W3C WCAG guidelines in addition to encouraging XHTML, and a big chunk of that is trying to make policy wonks and PHBs aware of these issues in terms that mean things to them. (especially if there is a legal risk to not writing compliant pages, as there is for many people that may not realize it).

Zeldman is annoying, buy Meyer

OK, I read the book and I agree completely with the message. And I read and enjoy Zeldman's site, it's a great source for what's happening in web design. But his writing style doesn't work on paper. He has a hugely irritating habit of adding unnecessary asides wrapped in parentheses into the main text of the book, often referencing other parts of the book. It's like he's itching to put in a link, but guess what - links don't work on paper. Have you heard of sidebars at all Jeffrey?

My other major beef with the book is the lack of meat. It's a history lesson on the browser wars and a white paper on why web standards are good. A book about building web pages using standards that doesn't get to "CSS Basics" until chapter 9?

If you want to get hands on with web standards, i.e. using css for layout, buy Eric Meyer's book Eric Meyer on CSS [ericmeyeroncss.com]. Read chapter 1, do the exercise, suddenly it all becomes very obvious.

using Mozilla+PHP to validate XHTML on the fly

Since many Slashdot readers are Mozilla users, I think you'll appreciate this little code bit for your devbox, below.

This PHP code (and following head tag) put at the very top of any HTML page will tell Mozilla that the .html page following is actually application/xhtml+xml.

Then if you make ANY little mistake at all in your (X)HTML code, it will completely fail on you, as if it was a script, showing you the exact error and where it lies. It's been a priceless way to check my XHTML syntax without always linking over to w3.org

<?php
/* XHTML proper header for browsers that accept it. If using Mozilla, this is a GREAT way to make sure your XHTML validates! */
if(isset($_SERVER['HTTP_ACCEPT']) AND stristr($_SERVER['HTTP_ACCEPT'], 'application/xhtml+xml'))
{
header('Content-type: application/xhtml+xml');
}
else
{
header('Content-type: text/html');
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
< html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>

etc. (not sure why slashdot comment is adding ; before html xmlns

Title is Oxymoron

There are no practical "web standards" except for a trivial subset. The vast majority of users have MS-IE browsers, and IE only half-ass fallows "official" standards. A better title perhaps would be, "Living in a Microsoft browser world". You are not going to convert your company to Mozilla. It ain't gonna happen. Besides, there are some Mozilla rendering "oddities" also.

Check with a lot of browsers, mainly with Lynx

Don't forget to check your site with a lot of different browsers.
Use Lynx to see what a search engine spider can see on your site.
Use PHP (true PHP, not thingies like PHP-nuke) to have a dynamic site with a good interaction.
You can also intercept the user-agent of the visitor to propose different layouts.

its not your decision

most of you here make it sound as if the way you code is your decision. as if youre working in some babylon of development in which all of those real life factors (timelines, cost, client demands, client stupidity) dont apply. you guys need to tell me where this candyland of fancy code resides so i can apply.

really though, i find that many of the ppl who post to sites like this act as if theyre working under no restraints. arguements about standards almost always lack the attention that must be paid to industry standards vs. best practices.

best practices would be what you are all talking about. no one can deny that complying to web standards would be one of the pillars of best practices in web development. unfortunately, most clients dont give a damn about web standards. in fact, nine times out of ten they could give a damn about the code at all.

Reasons

essentially clients care about two things: speed to market and cost. the thing about that is, those are two corners of the classic quality triagle (speed to market, cost and quality). the rule says you take one corner away and the other two suffer. when you take two of the corners away...forget about it.

yesterday we (here at ye olde agency) were minutes away from delivering a large, dynamically driven sub-site to a wireless carrier. this would be the second site we've made for a wireless carrier, and, like nearly every other project ive worked on, this company wanted it done in an absurd amount of time. how long, you ask? how long was i given to build, test and debug 22 templates? three days. you know what kind of crap you produce with a timeline like that? three days.

in three days time i knew i wasnt even creating code that could be exanded upon when changes may be required. in three days time i was able to test my html in one version of ie and one version of netscape on one platform. after my alotted three days i gave the site over to development. they also had so little time that the two original developers on the project (eventually that number doubled as we were forced to take two ppl off of a project in new jersey to fly them back here to chicago to work) that they were here working from 1pm to 9am everyday. and sure, we *could* kick out a site that *visually* looks okay in that amount of time. we could if the client didnt come back to us with a plethora of changes day after day, all the way up till the day before the site was to launch. do you really think it matters to management (on either side of the fence) that the design and content cutoff was passed weeks prior? in this economy? please. if you dont think that in these days its all about money youre sorely mistaken.

so after building sites for companies that make more money in a month then most small countries make in a year, it doesnt take long for one to realize that the deciding factor in the way you produce your work, be you in design, production or development, is entirely dependant on the amount of time your given. in a previous arguement ive had about this, someone said oh well your just jaded. jaded? hey, when you look back on months and months of work only to realize that in the end youd rather tell people no, i wasnt the poor son of a bitch who was part of *that* ugly-ass project when in fact you built the damn thing...jaded? no, its much more personal then that. this is my job, my life. i didnt fall into this like most people. i actually planned on ending up at a company which allows me to work on sites for microsoft, slate, sears, thermos, morningstar, etc. but now that im here...let me tell you, its very, very hard to reconcile with mediocrity when you know you can produce greatness if you were only given the chance. but i dont get to make those decisions. if you want to, either be a project manager or work for yourself. of course, if you work for yourself, get set to have a whole other world of problems which, not coinidentally, also revolve around money.

when i first started interviewing at agencies back i

Re:Standards

Standards are for pussies

Don't you Microsoft people do anything but read slashdot all day?

Re:Standards

Standards aren't for pussies. Weiners are for pussies. Standards are for those of us who aren't weiners, but possibly have one.

Re:"the first IT book I've ever read"

And at less than 500 pages, just how well can it cover those same "standards"? [joke mode on] Maybe they used CSS to do the page layout, and set the default font to xxxxxxxx-small? [joke mode off]

I don't agree

I do ALL of my development on a PowerBook with Camino (Mozilla based) and the only browsers I have to tweak for are Netscape 4 and IE 5. Mostly for Netscape 4.

If you know what things the different browsers can handle and what makes them puke it's not that bad. You end up with some legacy width and height tags for Netscape 4, but the CSS aware browsers will ignore them.

You also want to sniff the browser to feed it CSS that it can handle, I have found that some tag's will destroy a page in Netscape 4 and IE 5, so there a 3 CSS files for NS_4, IE_5 and everything else.

Don't get me wrong, I will never get Netscape 4 to look the way I want, but according to my logs, I don't need to.

Re:Ummm

I agree that Netscape 6.0 did have some issues, but that browser was released three years ago and hardly anyone ever used it because it was so slow and buggy. Even fewer continue to use it today.

I'd spend my time checking the site with Netscape 7.x or Mozilla 1.0.x or Mozilla 1.4.x instead. Can you give a specific example of "limited use" of tables and styles in one of those browsers?

Re:Ummm

Internet Explorer violates a lot of standards. And is otherwise nasty to work with.

• CSS level 1: Not full support despite MS claiming so. E.g.background-attatchment: fixed; works only on the <body element.
• CSS level 2: Quite a mess, lots of things are broken, e.g. the infamous issues with the box model, and lots of things are not implemented, e.g. position: fixed;
• XML support is flaky at best, it tends to complain about DTDs even though they are valid.
• Other nasty quirks such as when having a <?xml ... ?> declaration, then it ignores the doctype and reverts to quirks mode with all the broken box models and such.
• Violation of the HTTP specification by ignoring the media type received from the server. Internet Explorer will most of the time second-guess the media type instead.
  
  http://www.w3.org/Protocols/rfc2616/rfc2616-sec7.h tml#sec7.2.1 [w3.org]

  If and only if the media type is not given by a Content-Type field, the recipient MAY attempt to guess the media type via inspection of its content and/or the name extension(s) of the URI used to identify the resource.

I design according to the standards and using Mozilla and Opera 7 as the design references, and then adjust the stylesheets for IE's buggy behavior, so that it renders fine there as well.

Re:Dead issue

Ya, and that's why the fella a couple posts above yours says,

Ummm (Score:1)

by DaveKAO (320532) on Tuesday September 30, @10:36AM (#7095700)
Microsoft browsers follow standards MUCH closer than Netscape. Mozilla is good, but still has some problems. Tables and Styles just do not work in Netscape 4.0, and have limited use in 6.0 and above. I find that 40% of my design time goes to formatting (using supposed standards) for IE 6, and the rest goes to trying to manipulate Netscape/Mozilla/Macs into displaying the proper way.

If there was nothing useful in this book, then statements like that wouldn't be made.

If it was such a dead issue, it wouldn't be a huge event when a major site (news.com, espn.com, wired.com) finally adopts a modern standard and aims for compliance.

This book would have been useful in '99, sure, but it's far from a moot point now.

Re:Ummm

Try the opposite approach: start by getting it to work in Mozilla, then check it in other browsers. Along the way, use the W3C Validator. If you can't make it work in IE/Win and still validate, there may be a better way to do what you want that is standards-compliant AND works in IE/Win in addition to what you're used to. When that's not the case, use conditional comments (google if you don't know what they are) to let you write code specifically for IE/Win (or specifically for everything else).

It's what you get used to...

Back when I was coding in ColdFusion I used to think that Netscape was the chief offender of standards. I used IE primarily and then came back and re-tooled for all the rest. Opera being often the easiest with a few quirks.

When Mozilla reached 1.0 I switched to it... I have never looked back. The support for PNG is better, transparent PNG graphics drive IE nuts sometimes. IE still leaves gaps around graphics and tables that you have to hammer out to a minumum but cannot eliminate. I think it has a lot to do with interpretations of the box model... padding, margin, border and such... Someone isn't doing their homework to comply. Personally the Mozilla way makes better sense to me. Netscape 4.7 sucked... no question about it, it was stagnent for a long time and didn't grow with technology standards. Gecko has made some great strides that are now leaving the MS browser lagging though in a a few areas.

Re:Ummm

First, a reminder that this is 2003, not 1998, which was the year IE4 and Netscape4 were introduced. Since then, Mozilla has come, and with it Netscape 6 and 7. Also, we've seen the arrival of Konqueror (and Safari) and Opera.

Netscape 4 is dead: don't worry about it beyond getting your sites to still be legible in it.

Gecko based browsers, Konq, and Opera all do very well with W3C standards.

IE, however, has not had a major rendering revamp since version 4. The biggest change was for IE6, which is actually less compliant than previous versions. Sure it fixed some things, but broke many more.

Among web designers I know, IE is quickly gaining the hatred that had previously been reserved for Netscape4, because they know that NN4 is irrelevant, and the hatred has to go somewhere: the least compliant browser out there... IE.

Now, why is IE the least compliant? Because MS doesn't see the need to make it compliant. They have their precious market share, which is all they care about... not the users, not the developers which must coddle to IE because it works the way MS sees fit, not the standards bodies which MS continually ignores while attempting to participate.

The only way to break IE and move to standards is to use them, and explain to users why sites don't work: it's not the site's fault, it's the browser's.

Given all this, most people who have a clue about W3C standards would say you're doing your development backwards. You'd probably save a lot of time if you coded to the standards first, then hacked up the code for IE.

Re:same price at amazon

Interesting that once you stand to make a few dollars you completely forget that Amazon patented one click shopping.