Web Standards Solutions

William Nichols writes "With a couple of projects coming up that are going to require complete W3C CSS and XHTML validation (with 1 client requiring just a pure CSS layout) I thought it was time to brush up on some CSS knowledge, and maybe learn a new thing or two. I have spent the past week with a newly released book (and one of the smaller CSS books out there), the Web Standards Solutions The Markup and Style Handbook. The author, Dan Cederholm, has now become my right hand man, so to speak." Read on for the rest of Nichols' review. Web Standards Solutions: The Markup and Style Handbook author Dan Vederholm pages 253 publisher Friends of Ed rating 8.5 of 10 reviewer William Nichols ISBN 1590593812 summary A clear reference on designing with XHTML and CSS through a standards based approach

With the title Web Standard Solutions (which we will refer to as WSS from here on), you might expect this to be a book that is going to solve your problems, and without disappointment that is exactly what is does.

WSS takes a problem based approach instead of the commonly used project based approach to teaching you the value of designing to strict standards. I found this approach very refreshing, WSS kept my attention by presenting a problem, and then presenting 3-5 solutions on how to accomplish the task at hand. With each example Dan takes you through several ways to achieve the required result. Each of the methods shown are common patterns that different developers/designers would use, and the pros and cons of each are well articulated.

A lot of you may know Dan from his Simplebits. website. If you frequent Simplebits you will immediately recognize his style in the writing of WSS. Much like the mini quizzes that are used on his blog, this book is really a compilation of the hurdles that you are likely to face when trying to design to strict standards, and the solutions presented will get you over them.

WSS will also help the budding developer realize the business value of designing to standards. Once you start designing with standards, search engine rankings can jump, continued maintenance becomes a breeze, and the accessibility to screen readers (or other requirements) can be elegantly met.

One of my favorite parts of the book is the in-depth techniques used to style lists. WSS shows you how to take a regular non-formatted list and, using CSS, style it in several ways: as a vertical shopping list; without bullets and indenting; with custom bullets; and eventually as a horizontal navigation bar with changing bullets.

This book really stands out when covering the most basic foundations of layout such as paragraphs, lists, headers, titles and the like. The first half of the book really gets into the proper use of the most basic CSS techniques and proper selection of tags for headings, quotations, etc. While the second half of the book requires you to use what you have learned along the way to start building CSS based layouts.

If you are a regular at some of the advanced sites like CSS ZenGarden or A List Apart this book may be a little basic for you. Even still you will probably be able to take some techniques from it that you can use, this book is really more for the designer that is capable but not quite deadly with their CSS knowledge.

Overall I would give Web Standards Solutions the Markup and Style Handbook an 8.5 out of 10. I really think it does a fantastic job at keeping the reader interested in the subject (something that is often very hard to do in technical books) and will definitely be a great business tool for you. A quick read it is, but a valuable reference that has earned a spot next to my keyboard, my 3 bars of caffeinated soap, and the trusty case of bawls.

You can purchase Web Standards Solutions: The Markup and Style Handbook from bn.com. Slashdot welcomes readers' book reviews -- to see your own review here, read the book review guidelines, then visit the submission page.

Comments

Definition of Irony:

[Neil Blender]

A book review on HTML standards posted on Slashdot.

Re:Definition of Irony:

[slutsker]

Every time an article about web standards gets published on Slashdot, someone always comes along and says something like this. Look, just because Slashdot doesn't follow web standards, doesn't mean that the it can't publish articles about how others do. It's not ironic, or funny.

Re:Definition of Irony:

[z0ink]

You're telling me. Check out this series of articles written for A List Apart, an e-zine dedicated to web standards.

Re:Definition of Irony:

[cephyn]

wow i had no idea a changeover would save /. so much on bandwidth costs. the fact that they patently refuse to update the sitecode is mindboggling.

Re:Definition of Irony:

[The Bungi]

Especially funny given that the "perl hackers" have explicitly blocked the W3C validation service from hitting their circa 1997 table-laden crappy HTML and making them look even more stupid.

BTW, this has been active at least for three years, but very few people know about it.

Re:Definition of Irony:

[scmason]

Well, now that we have that solved, take it as a warning would be jokesters: Not only will we not tolerate web standards jokes, we will not toerate them in on our non standard forum.

Got it?

Re:Definition of Irony:

[jamie]

We blocked the W3C because their script sucks. Back in May, their validator nailed us for 6,000 hits in a short time, which earned it a nice place on our no-access list. Sites with big pipes shouldn't run scripts that act as DoS enablers; c'mon people, a max number of hits per unit time please.

If someone from the W3C cares enough, they can write the email address that they get on the resulting page and tell us that their script is smarter now.

error in the infobox in the review

[darxpryte]

looks like his name is Vederholm instead of Cedarholm in the stats box on the review. Minor pebkac!

Karma whoring information

[bartash]

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

Sounds interesting

[RangerRick98]

I'll have to check that out, along with the sites you mentioned. I do a lot of web design myself, and I've found the W3C's site to be a pretty helpful reference for what I do, but I'm always interested in learning more from additional sources. Incidentally, another helpful tool when doing CSS is the EditCSS extension for Mozilla Firefox. It can save some time in trying to get everything looking just right.

Tip for auto-validating PHP generated XHTML

[Boss, Pointy Haired]

During development, you can easily setup PHP.XPath to automatically validate every page you create.

Simply turn on output buffering at the top of your script using ob_start(). It's best to do this in a common header script called by all your pages.

Then, in a common footer script, load the output buffer (retrieved as a string using ob_get_contents()) into an instance of PHP.XPath using the importFromString method.

If your page displays, it will at least be valid XML (most of the way towards being valid XHTML). If you break the well-formedness of your output your page will not display because PHP.XPath will raise an error.

Re:Tip for auto-validating PHP generated XHTML

[linuxbaby]

Here's another thing you can (and some say SHOULD) do for that same purpose.

Put this at the very top of every HTML page:

<?php
/* XHTML proper header for browsers that accept it. If using Mozilla, this is one 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">

Then if you do your development in Mozilla/Firefox, it will die any time your XHTML is malformed.

It has the added benefit of something you would leave in on your production server.

Re:Tip for auto-validating PHP generated XHTML

[scragz]

// This one also checks the optional q value in HTTP_ACCEPT to see if they prefer HTML to XML.

/**
* Sends the content type as XHTML if the agent supports it.
*
* @return bool $sent True if XHTML was sent, false if HTML.
*/
function xhtmlHeader()
{
global $client;
Base::logMessage(__CLASS__.'::'.__FUNCTION__ , null, null, PEAR_LOG_DEBUG);

$qHTML = 1;
$qXHTML = 0;

$accept = PMK_Util::param($_SERVER['HTTP_ACCEPT'], '');
$uAgent = PMK_Util::param($_SERVER['HTTP_USER_AGENT'], '');

$xhtml = preg_match("/application\/xhtml\+xml(;q=([\d.]+))? /i", $accept, $xhtmlMatch);
$validate = preg_match("/W3C_Validator/", $uAgent);

$html = preg_match("/text\/html(;q=([\d.]+))?/", $accept, $htmlMatch);

if ($xhtml || $validate) {
$qXHTML = 1;
if (isset($xhtmlMatch[2])) {
$qXHTML = $xhtmlMatch[2];
}
}

if ($html) {
$qHTML = 1;
if (isset($htmlMatch[2])) {
$qHTML = $htmlMatch[2];
}
} else {
$qHTML=0;
}

if (($qXHTML > $qHTML || ($qXHTML == $qHTML && $qHTML != 0))) {
header('Content-Type: application/xhtml+xml; charset=utf-8');
return true;
} else {
header('Content-Type: text/html; charset=utf-8');
return false;
}
}

Re:Tip for auto-validating PHP generated XHTML

[Dom2]

Actually, it won't be valid, it'll be well-formed. Which is still a good goal.

But you can go further get validity if you want. Instead of putting that stored content into PHP.XPath, try writing it to a temp file and running onsgmls -wxml -E0 -s -c /etc/sgml/catalog $tmpfile 2>&1 over it. You'll need to ensure that you have nsgmls and the W3C DTD's installed, but that's exceedingly simple in debian; you just need the opensp and w3c-dtd-xhtml packages. Any output from that you can stuff into the page somehow. In Perl, I just do $page =~ s/<head>/<head>$err/;.

-Dom

re standards

[computerme]

FYI,

Neither S in CSS stands for "Standard". What i mean but that is that do NOT expect CSS to give you a right once play on any browser with the same results.

CSS is great to reduce download speed of pages. To keep all the style in one place. To separate logic from data. But do not think writing a web site in CSS will solve all your browser compatibility problems.And don't fall under the influence of some elitist CSS religion.

The amount of hacks, even by the experts, required to even get close to modern browser compatibility is really hilarious. (ooops i mean painful.)

So get into CSS. Use all the great features in offers, but remember that its not magic bullet.

Yes, i'm sure there are some simple sites that can be pulled off with CSS and look pretty much the same but honestly, when you reduce your site to this level, they ALLL look alike:

-header graphic
-2 or 3 columns
-a sort of anasepctic feel to it.

In the mean time, stick with a combination of CSS AND minimal tables.

Don't believe it? FIne, its not my hair that you will pulling out ;)

Re:re standards

[TedTschopp]

Yes, i'm sure there are some simple sites that can be pulled off with CSS and look pretty much the same but honestly, when you reduce your site to this level, they ALLL look alike:

Ummm... you might be suprised at the varity that is allowed when you know what you are doing with CSS. I would have to say that the sites at CSSZenGarden look quite different. I could point out other examples, but I'll promote a bit of myself, just click on my URL and check out the code for both the front page and the Forums. Both use tables only on imported content from outside sources. The rest is full CSS.

Ted Tschopp

Re:re standards

[TedTschopp]

I guess, I have a different attitude about it. Once I learned how to do most of the things I needed to do without tables, I really didn't want to go back. So I kept pushing through it all and learned everything I could.

I understand that tables are not bad, but that's not the point. If you follow the patterns of developing in only CSS, you end up solving a bunch of other problems you face later down the line in the development and maintence lifecycles (accessifying the site, turning pages into CMS templates, Search Engine Optimization, and importing static content into databases to name a couple I've had to confront).

Also you should see the maintence teams faces light up when they see a 100% CSSed site. Maintence and updates become a breeze.

I guess in the end, I've not seen a need to go back to allowing tables for layouts. The only reason I would say that you shouldn't make a hard rule on NO Tables is that on many sites you do not control the source of all the content (CMS, Portlets, Includes, etc...) and because maybe somewhere somplace out there there is probably something which is impossible to do in pure CSS. But in the mean time I think everyone should learn this skill, it's worth it. (It cut our bandwidth by ~%50 which justified the costs of learning the skill and implementation.)

Ted Tschopp

Re:re standards

[Mitchell Mebane]

IE7

It's still alpha software, but it works pretty well in my testing.

Re:re standards

[typhoonius]

I would have to say that the sites at CSSZenGarden [csszengarden.com] look quite different.

Funny you should mention it. I followed your link and checked out the C-Note design, which has overlapping text in the sidebar in Opera 7.5. Whoops.

The grandparent is right in that CSS is not a panacea for designers and that it can be hard to guarantee perfect compatibility.

However, for the CSS Zen Garden, no matter how badly the CSS renders, I can always just drop into user mode and read the content thanks to its lovely semantic mark-up (of course, the design is the site's draw and not the content, but that's beside the point). In my opinion, flexible data is more important than pixel perfection, so I ultimately disagree with the grandparent's half-hearted tables-with-CSS approach. Clearly, you'll never, ever get pixel perfection for every user without a lot of hacks (using tables for anything other than tabular data is a hack), so you should really just give up and focus on fluid designs.

(And yes, I know, ideals don't get you far with clients and compromise is often necessary, but maybe you should be compromising your design whims for accessibility instead of the other way around?)

Re:re standards

[upsidedown_duck]

I would have to say that the sites at CSSZenGarden look quite different.

The last time I visited this site, it seemed the different designs rely too heavily on graphics. I was about to reply to the original post, but, then, I realized that good cross-platform CSS+HTML pages really do end up following the predictable header/column approach with light graphics for modem users.

Given the nature of putting content on the WWW, I really don't think this is that big of a deal. I'd take a simple header/column CSS site over Flash or JavaScript based ones any day, becuase it would generally be more reliable, it would be faster, and it doesn't rely as much on nuances of my browser preferences or plugins.

Re:re standards

[jgalun]

I love CSS Zen Garden. It is an amazing site. And, you're absolutely right that not all CSS sites need to look the same (I like to think that my site, which totally relies upon CSS for design, does not look like every other "CSS site" out there). That being said, I do agree with the original poster's sentiments to a large degree.

Off the top of my head (finishing a long day at work):

1) CSS Zen Garden is great, but it's much easier to mess around with CSS style-switching like that when you have only one page to support. It becomes much more difficult to do when you have a lot of different pages with different types of content and different amounts of content on different pages.

Plus, a lot of the designs on CSS Zen Garden are eye-catching - but hardly useful (and rather distracting) if you are trying to make a serious site geared towards content delivery. This it not a slam on CSS Zen Garden at all, which is, after all, supposed to show that CSS can deliver the goods when it comes to amazing graphic design. Just that, at the end of the day, what matters is normally intuitive content delivery wrapped in a good design, not being able to switch styles.

2) It can still be quite a bitch to get CSS to work the same in Opera, Mozilla, and IE.

3) Given the difficulty of getting CSS stylesheets to work correctly across all browsers, you have to ask yourself - doesn't it make more sense to use tabular design and some content management system that contains templating features, rather than struggling with the theoretically cool but difficult to implement CSS design switching?

4) One of the things that initially attracted me to CSS was the possibility of creating web pages that are more accessible to sight-impaired and motion-impaired users. But, after much effort, it has become clear to me that CSS is not a magic bullet for this at all. First of all, tabular design is not as inaccessible as it's made out to be. Screen readers are very good at dealing with tabular design by now. Secondly, there are a lot of situations where CSS has no bearing on the issue. For example, if I have a budget tool that I want to update costs on the fly, that will wreak havoc on screen readers, regardless of whether CSS is used or not. (More generally, web standards are no magic bullet. For example, let's say we have a tool where most users will benefit from being able to click on an item and have a pop-up window appear with more information on the item. Now, some users will have JavaScript turned off, meaning that the budget item link should use TARGET=BLANK for those users. But according to HTML 4/XHTML 1 Strict, you cannot use TARGET=BLANK any more, because that would be mixing content and design. In theory, the W3C is absolutely right. Where the link opens is a design issue, and should be handled by manipulating the DOM, not in the anchor tag itself. But, unfortunately, theory leaves those users with JavaScript turned off with a much lesser experience, becuase they would benefit from viewing both the additional information in the pop-up window and the information they were viewing previously at the same time on the screen. Maybe that's the right trade-off to make, but it's still a trade-off.)

5) The idea that with different stylesheets you can support radically different user agents - Palm users, WebTV users, users with 640x480 resolution, users with 1024x768 resolution, screen readers, etc. - is a great idea. I question how many sites have actually put it into action, though. Let's be honest - how many site really have a need to deliver information to users across all those user agent types yet? And, if you do have such a need, you're probably a huge site where it may make more sense to - again - use an advanced CMS that can handle that by relying on custom conversion from XML to whatever template you have for the different user agents, rather than CSS.

6) CSS would become much more useful if we could get some of the features that were be

Re:re standards

[tokachu(k)]

In the mean time, stick with a combination of CSS AND minimal tables. Don't believe it? FIne, its not my hair that you will pulling out ;)

I don't believe it. Consider the following:
Internet explorer is the dominant browser... (well over 90%) ...and it doesn't support CSS fully. (not much CSS1, and no CSS2) It's incredibly easy to lay out a complex web site without using table hacks when you use CSS and have a dominant browser that fully supports it. The problem is that only browsers based on Mozilla code (Camino, Firefox, Netscape, etc.) have support for these standards. There's nothing wrong with the standards out there currently, but there is something wrong with the people who don't obey them on the application (server) level.

It's a tad cliche, but Internet Explorer is doing more harm than good without all its serious security problems.

Re:re standards

[shirai]

CSSZenGarden is great and I use it as a source of inspiration; however, it does NOT allow you to create a template that can be re-used.

In most of the designs, custom images were made to replace the header text to get a nice look. It is a good trick, don't get me wrong, but this doesn't allow you to create a site with different content using the same template. You will have to generate new header images for every page you make.

Re:re standards

[gorfie]

I found that the difference is the compatibility of the hacks. At my former job, I actually created useable 300+ page site that relied entirely on CSS for layout. The hardest part was making it look the same in a variety of browsers/platforms. Borders would render differently, padding/margins were different, etc..

Conversely, I can use tables and image spacers to layout a page and I can be guaranteed that it will look the same in a large variety of browsers because tables are very common. In fact, the only difference is that older versions of Netscape had non-zero defaults for cell-padding and cell-spacing.

I know that CSS can make for tidier/smaller pages. Maintenance isn't an issue since you can separate the content from the presentation with other technologies. The biggest reason to loosen up with the tables was how nested tables were interpreted by audio screen readers like Jaws. It was AMAZINGLY annoying with the nested tables, and I had difficulty getting through my own site that had several levels of mostly unnecessary nested tables.

In the end, my preference is a mixture of the two. Tables are quicker and easier and if I can easily use CSS to eliminate a table (or 12) then I will. My current employer relies heavily on tables and I'm trying to encourage us to look more into CSS but they like to reuse their code and designs from 4 years ago still. :)

Re:re standards

[isomeme]

CSS is great to reduce download speed of pages.

I can do that just fine with pages full of giant animated gifs loaded from a webserver on my home ADSL line.

Re:re standards

[wsapplegate]

> The problem is that only browsers based on Mozilla code (Camino, Firefox, Netscape, etc.) have support for these standards.

A possible temporary solution is this one. On the long-term, I suggest sacrificing goats until the MSIE team makes a new, improved release. They've recently resurfaced, so maybe they're alive and coding on it, who knows :-)

Re:Definition of Expected:

[TedTschopp]

And why buy a book when you can read the W3C recommendations/specifications for HTML/XHTML and CSS that are (imo) very understandable and easy to read?

Becuase many times the standards do not tell you elegant solutions which people have used in the past.

Kinda like the difference between English class and Creative Writing classes

Ted Tschopp

Excellent Reference

[playgod]

I picked up this book last week. I found it an excellent read and suitable for CSS users both novice and advanced. It gave me a couple ideas for ways to do these and further illustrated the necessity of web standards compliant design.
I also bought it because I met the author at the 2004 TOevolt Conference and he gave a great seminar and was a cool guy to boot.
It also spends some time on web accessibility, something all developers really need to start thinking about.

Wedding

[Anonymous Coward]

has now become my right hand man

Cool, are we all invited to the wedding?

Buy It Cheaper

[anamexis]

The "Buy" link listed is at bn.com, but you can get it for cheaper at Amazon.

SAT analogy

[downward dog]

CSS/XHTML :: traditional HTML

as

hand-coded HTML :: Frontpage 98

Standardisation = Complicating Stuff

[Dante Shamest]

Imagine if the Internet had started out with today's newest XML standards back in the early 90s. Imagine that browsers were strict and accepted only standards-compliant code. To design a site you'd have to know strict XML and understand DOCTYPES and all that. The layout of your webpage would be strictly defined by CSS 2.0, which means you'd have to learn that too.

Would the Internet have flourished? Maybe. But I bet adoption would have been slower. It would have certainly put off alot of people trying to create a simple functioning webpage.

Heck, it might have caused some genius to invent a simpler alternative to XML/CSS

Re:Standardisation = Complicating Stuff

[downward dog]

So a web designer would get an error (Error: no closing tag) and would give up and go home? Amazon.com wouldn't be able to find programmers who knew how to write lowercase markup?

Wouldn't you rather have a human being decide how a page should look, rather than having a web browser GUESS what to do with invalid code? That is basically what web browsers have been doing for years. Hmmm, thought Mozilla, no closing </a> tag. Should I end the link at the paragraph break, or let it extend across four table cells to the next link?

Re:Standardisation = Complicating Stuff

[downward dog]

Because I'm interested (not trying to pick a fight), what is more complicated when creating valid XHTML? Here is all I can think of:

1. Doctype. There are three acceptable doctypes that can be cut-and-pasted, and the difference between these is pretty straightforward.
2. Valid code. You have to close tags, and you can't place tags out of context (e.g. a <li> tag outside of a list).

What am I missing?

The reason I ask is that I find XHTML/CSS to be simpler than the "old way" of coding. Nested tables? rowspan=3 colspan=2? <br><br><br><br> to move text down? Spacer gifs?

Re:Standardisation = Complicating Stuff

[RAMMS EIN]

I hardly think so. There is nothing more difficult about XHTML than HTML.

If you had wanted to build the whole web around XML and CSS, all it would take is for one person to create a Schema and for one person to create a stylesheet, which could then be used by anybody else. This is, in fact, exactly what happened, except that the stylesheet was hardcoded in the browser, and the Schema defined in some standard document.

Re:Foolish Projects

[downward dog]

HTML and CSS are something that can be written by any school kid, and you and I both know that your average school kid doesn't know the ins and outs of the CSS and XHTML standards, and probably never will.

Wait -- and you think it is foolish to exclude the average schoolkid from coding large web projects?

Whenever people say that "anyone can learn HTML," I laugh. That's like saying that "anyone can use Photoshop" because anyone can hit ctrl-i to invert an image. Sure, anyone can learn what means, but can anyone create clean, efficient, browser-compatible code that is easy to maintain and intuitive for multiple developers to use? And create it quickly? That is where web standards come in.

Re:Dupe?

[Saeed al-Sahaf]

but the author of the article seems to be an utterly clueless idiot.

Well, he is a web developer!

Re:Foolish Projects

[TedTschopp]

This is actually a problem browser development. As a browser developer you need to second guess every idiot out there and try to make sense of what they ment when they borked their HTML.

Way back in the day there was a battle between Netscape and Microsoft, and Microsoft decided to start supporting a more lax standard. This made it easier to develop to their standard becuase it wasn't as picky.

Your attitude of the webserver only serving up webpages to be viewed in a browser is quickly being replaced with a more service oriented model which says that you never know what the client browser is going to be. With this new model there is a renewed need for standards because not every cell phone or pda can be expected to interpert borked HTML correctly. Also this doesn't even take into account that the output from a webrowser that needs to be read by things other than other browsers.

The prime examle of this last case is search engines. Now granted broken HTML doesn't effect your placement alot, but broken output which doesn't follow a standard does affect another computer program and application which is expecting a certain format. I can't write a computer program if I'm not certain on the input, and I (and the company I work for) doesn't have the same resources that Micrsoft and Netscape had to deal with trying to read the other developers mind and second guess what he ment by his borked output. (ask anyone who has done work in the web application/web services fields on how annoying shifting standards can be)

Re:Top 5 problems with CSS

[TedTschopp]

5. This is a design problem and can be fixed with an increase in skill from the developer.

4. Ummm, CSS files are downloaded once on the first time to the site and then kept locally for the rest of your visit to the site. This reduces bandwidth, and reduces loadtime. So yes, this happens the first time you hit the page, but not any other times.

3. No they want to depreciate broken HTML. There is nothing wrong with HTML which follows the standards. And CSS is simple, very simple.

2. Hardly anyone uses personal stylesheets. There are two reasons for that. No standards on class and ID namespace. Browser implementation of this is buried behind a ton of menus. No one knows about this as a feature.

1. Your problem is with the validation buttons, not the fact that the page is validated.

An assload of useful online CSS resources

[mmmuttly]

Misc.

• CSS Wiki! - + - this is extra copy so this would post
• Centering advice! - + - this is extra copy so this would post
• Centering advice! - + - this is extra copy so this would post
• Fix crappy MSIE support! - + - this is extra copy so this would post
• tips, tricks and good practice techniques! - + - this is extra copy so this would post
• Box model Illustrated! - + - this is extra copy so this would post
• links collection! - + - this is extra copy so this would post
• links collection! - + - this is extra copy so this would post
• links collection! - + - this is extra copy so this would post
• Tutorials, Demos, and Hacks! - + - this is extra copy so this would post
• Best Practices! - + - this is extra copy so this would post
• Best Practices Crib Sheet! - + - this is extra copy so this would post
• Best Practices! - + - this is extra copy so this would post
• Holly Hack! - + - this is extra copy so this would post
• 3 pixel hack! - + - this is extra copy so this would post
• Firefox webdev plugin! - + - this is extra copy so this would post
• Mozilla CSS editor! - + - this is extra copy so this would post
• Debugging Advice! - + - this is extra copy so this would post
• Page Building Process! - + - this is extra copy so this would post
• selectutorial! - + - this is extra copy so this would post

Lists

• listamatic 2 (nested lists)! - + - this is extra copy so this would post
• listamatic! - + - this is extra copy so this would post
• listutorial! - + - this is extra copy so this would post
• Piped List! - + - this is extra copy so this would post

Floats

• floatutorial! - + - this is extra copy so this would post
• float-theory! - + - this is extra copy so this would post

Filtering

• Explorer! - + - this is extra copy so this would post
• safari filtering! - + - this is extra copy so this would post
• filters! - + - this is extra copy so this would post

Type Issues

Not So Easy

[Nurgled]

The articles on A List Apart create a static HTML mockup of the front page. However, there's more to Slashdot than the front page, and it's not just a matter of copying that mockup onto the site and having done with it. The Template Toolkit templates have to be rewritten to use the new code, and similar new markup and CSS must be written for things like comments, the comment form, the nutty little boxes and so on.

CowboyNeal has said repeatedly that if someone was to submit a complete, working template he'd consider making use of it. Also, more recently it was claimed that someone was working on one. The software that powers Slashdot is an open source project, and Template Toolkit is not specific to Slashdot and pretty well documented. If it really bothers you, scratch your own itch and submit a patch.

Re:Not So Easy

[Nurgled]

The Perl bit is already written. You just need to write a set of Template Toolkit templates. I seem to remember from looking before that the way they are used in Slash is pretty obvious once you find the template files in the source distribution.

Re:Not So Easy

[Peter Winnberg]

I am working on Slash theme that complies with web standards. It's mostly editing templates but also some perl hacking.

If anyone feels like helping out it is available from CVS:
cvs -d :pserver:anonymous@strict.openflows.org:/var/lib/c vs co strict-600

I didn't like it

[booch]

I didn't think this book was all that great. It wasn't terrible, but it didn't cover much that Designing with Web Standards by Jeffrey Zeldman didn't cover better. I would highly recommend Zeldman's book over this one. Zeldman's writing style is reads more quickly, and actually makes it fun to read. I'd give WSS a 5.5, and Zeldman's book a 10.

Missed two of my favorites...

[Anonymous Coward]

Reference:

• CSS Property Index by Brian Wilson

Tutorial:

• Adding a touch of style by Dave Raggett

Ooooh... CSS!

[miikrr]

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.

Re:Ooooh... CSS!

[marsu_k]

Living in the future, are we? First of all, as you can see for yourself, Gecko's CSS2 support isn't perfect either. What's even funnier is the CSS3 link you posted - if you'd bother to read it yourself, you'd see that most of the CSS3 spec is currently a "Working draft", i.e. the spec isn't finished yet!

Having said that, I'm looking forward to CSS3 as (AFAIK) it'll offer transparency support, that feature alone makes it worthwhile to me (yeah yeah, you can get variable opacity with current browsers using proprietary CSS. I'd prefer standards.)

Some other XHTML/CSS references

[SpaceTaxi]

• Eric Meyer on CSS -- goes through several hypothetical projects that demonstrate techniques for laying out pages. I found ideas for navigation menus and sidebars a helpful start. Also, would have otherwise had no idea that you can specify a separate style sheet for printing!
• Dynamic HTML: The Definitive Reference by Danny Goodman who will actually explain to you the difference between relative and absolutely position layers. Also, as per the title, this book is a great introduction for manipulating pages with Javascript and includes references for HTML, CSS, DOM and Javascript. A great resource, it perpetually sits open on my desk.

Of course the most interesting way to learn the new standards is to practice coding and to look at how other folks have coded their sites. I think that what is interesting about XHTML/CSS is that there are several different ways one might go about coding a page to reveal the same layout. Its also interesting to see just how much you can manipulate what amounts to very simple HTML into something more complex and attractive.

The challenge, however, is to come up with a finished design that has the same visual polish as those you might have chopped up from Photoshop or some other graphics program. Not to say that it is impossible to have a graphics heavy design using new standards. Rather, I have found that in working with CSS encourages a bottom-up process in designing a page starting with your code, while earlier Web design methods follow a more top-down approach, starting from a design comp.

However, I think that the new standards also encourage a certain simplicity aesthetic. I think many Web folks are appreciating designs that aren't so clutered, that download and render really fast, and have built in accessibility and search engine performance advantages.