How to maintain W3C standards compliance of a theme

Question

When I wrote a theme, I made sure it was compliant with XHTML 1.1 and CSS 2.1. Then I added plugins and the theme is no longer compliant with XHTMl 1.1. Then I used Google API font in my CSS and it is longer CSS 2.1 compliant.

Is there a way I can keep the compliance without getting rid of the plugins, font etc or should I just ignore the validation errors?

Answer 1

Correction, your theme was still compliant with XHTML 1.1 and CSS 2.1, but the plug-ins you added injected additional code that wasn't compliant.

Unfortunately, there's no easy way to maintain compliance if you're using plug-ins. The best you can do is validate your theme and all of the markup you are personally responsible for, then hope that other developers have taken the time to validate their own work.

The alternative is a lot more work on your part - you can still use the core functionality of the plug-ins, but don't allow them to output any markup to the browser. Add your own custom layer that unhooks everything the plug-in touches, and build your own output buffer. This is the only way you will have control over the style of markup being sent to the browser.

Several plug-ins are beginning to use HTML 5 ... others are trying to use CSS3. If you install these plug-ins and don't take steps to sanitize and validate their output, then your site will cease to validate properly.

Answer 2

Each plugin is going to generate the code it wants to generate and some of it won't be XHTML 1.1 compliant. The only reasonable way to correct that would be to audit each one and either modify the offenders or get the developer to modify or use your modifications as a patch.

Alternate you could try to write a filter to clean it up but trying to catch all the special case seems like a version of my own personal nightmare and it would also affect performance for dudious benefit.

Do you have a client/boss who wants this, or is it just something assumed to be as a "nice-to-have?" (Yes, there are some who feel strongly about it. I however am not one of those.)

That said, XHTML is loosing its "fair-haired child" status on the web; even Tim Berners-Lee said so back in 2006:

Some things are clearer with hindsight of several years. It is necessary to evolve HTML incrementally. The attempt to get the world to switch to XML, including quotes around attribute values and slashes in empty tags and namespaces all at once didn't work. The large HTML-generating public did not move, largely because the browsers didn't complain. Some large communities did shift and are enjoying the fruits of well-formed systems, but not all. It is important to maintain HTML incrementally, as well as continuing a transition to well-formed world, and developing more power in that world.

You might also want to read HTML5 is so much easier to write than XHTML 1.0. over on StackOverflow. Here's their summary:

Just syntax-wise, when you use HTML5, you end up with cleaner, easier to read markup that always invokes standards mode. When you use XHTML 1.0 (served as text/html), you're specifying a bunch of crud (in order to validate against a crappy dtd) that the browser will do automatically.

Answer 3

Compliance with standards doesn't guarantee your Web site will work in all browsers. Ignore standards compliance and focus on testing with as many browsers as possible.

Answer 4

You can buffer the whole output of your site and then tidy it up into compliant HTML. Best of it is, that this can be done fully automated:

• Tidy Utility: http://tidy.sourceforge.net/
• PHP tidy package: http://pecl.php.net/package/tidy (for PHP 4, bundeled in PHP 5)
• More info: http://www.coggeshall.org/code/tidy/

You can enable output buffering on theme init or related hooks (e.g. *setup_theme* hook).

Here are two code fragments. First one shows that you start output buffering and read out the buffer later on:

<?php
ob_start();
?>
  …
<?php
$buffer = ob_get_clean();
$tidy = tidy_repair_string($buffer);
echo $tidy;
?>

Second one shows some of the configuration options in action:

/* Tiny Configuration */
$config["clean"]         = true;
$config["hide-comments"] = true;
$config["output-xhtml"]  = true;
$config["indent-spaces"] = 2;
$config["tab-size"]      = 2;
$config["wrap"]          = 0;

$buffer = ob_get_clean();
$tidy   = tidy_repair_string($buffer, $config);

echo $tidy;

I bet there is already an existing wordpress plugin for doing so. Let's see:

• http://wordpress.org/extend/plugins/htmltidy-for-wordpress/
• http://wordpress.org/extend/plugins/tidy-up/ (ships with tidy binaries which could be considered bloat)