As of a few minutes ago, prayerletters.us is now XHTML compliant, not with the transitional rules, which are fairly similar to HTML, but with the strict rules, which aren’t very forgiving. I needed something to do on my vacation. :-)
Lessons learned:
It’s possible to get XHTML Strict to work cross-browser in much the same way as XHTML Transitional does. It might even be easier. I think the only difference I saw between transitional and strict was that the margin between the logo and the navigation bar increased by a couple of pixels. (This is excluding some changes I made on purpose.)
Yahoo’s User Interface Library is very handy, and open source (with a BSD license, which is considerably nicer than the viral GPL). I didn’t end up copying anything verbatim, but I made good use of their grid and font CSS documentation and examples. Beware their “reset” file!
Firefox and the Web Developer Toolbar are indispensible. If you don’t believe me, install them, load up a web page, and click “Outline…Block Level Elements”, or “CSS…Disable Styles”, or “Disable…JavaScript” (umm, just remember to turn it back on afterward…). It also has handy keystrokes for sending your web page to the W3C’s HTML validator.
Updating your pages to be XHTML compliant is a good way to track down errors in your tags, particularly for missing closing tags, which don’t always cause obvious errors, but can cause some extremely annoying subtle ones.
Using em’s instead of pixels can indeed work (though not without some tweaking from Yahoo’s CSS files, for some reason — possibly due to something I changed). It also makes things work a lot better when you mess with the font size in the browser (Ctrl-Equal and Ctrl-Minus in Firefox, or “View…Text Size” in IE).
When validating, use the same rules as for debugging — unless the errors are obvious, just fix the first one, then revalidate. The earlier errors may be confusing the validator and keeping it from processing the rest of the file properly.
Most of the public pages should now be more accessibility-friendly, as well — that’s not a required side-effect of XHTML-strict-compliance, but I tried to build it in while I was at it. I’m not sure how many blind missionaries there are out there who want help sending their prayer letters, but I want to be there for them too!
It also helps for people with poor eyesight (e.g. the web site now handles very large font sizes nicely), or for people who don’t use mice. I still have a way to go in that area, but it’s a start.
I like the results so far — try turning off style sheets and/or images, or using a text browser like lynx.







