Climbing Mt. Validation

sample tag The other day I was working on a few tweaks on mashby.com and I remembered that it had been quite awhile since I validated my code. For some people as long as it looks good in a browser, that’s good enough and in large part they are 100% correct. However, being the perfectionist that I am, I tend to subscribe to the notion that the code that you write should comply with the specification it was written for. Imagine my surprise when I clicked on the button in the Colophon and saw errors galore! :O So I set out on a challenging adventure to try and tweak my code and that of Movable Type the software that I use to manage my weblog.

The first hurdle I had to overcome was to decide just which spec I was going to validate (HTML. XHTML, etc.) Looking at all the errors I currently had to fix, it seemed only natural to go for XHTML. Besides, that’s the new sexy standard. If I could get my site into XHTML I’d be one of the cool kids on the block.

Now that I was armed with the correct <!DOCTYPE> tag, there were a few things that I had to rethink. The first was that if there was no closing tag such as the <img /> tag you have to add a / at the end of the tag. That was simple enough. A few quick edits here (Translation: editing each and every post ever made as well as most templates) and there and that was cleaned up rather nicely.

The bigger hurdle was in a simple little   tag. I like to include images on the left side of each post. If the text following the image isn’t long enough, the next paragraph is pushed down beneath the image. To overcome this, I’ve been using an HTML 4.1 tag in a   to overcome this annoying occurrence. The tag I’ve been using is  . This has worked great in the past, but is not valid in XHTML. I wracked my brain trying to figure out a solution in CSS and then it dawned on me. What was causing the break wasn’t the  , but the fact that Movable Type closes the paragraph with a  tag. By simply using a   I could fix the problem easily.

With all tags closed properly and a new <img /> tag that made everything flow properly, there were still a few errors lurking about. Those errors tied back to the Trackback feature listed at the bottom of each post. For the life of me I couldn’t find a way to validate that code. The code is generated by Movable Type and you need it exactly as it is in order for the TrackBack to work properly. Thank heavens for Google, because within a few searches I found the magic combination of cryptic words that yielded me and answer. Phil Ringnalda wrote an exhaustive article on the subject walking me through all the steps he went though. At the bottom of the page was an update that gave me the perfect solution. The uber mt dude Brad Choate had a php solution that did just the trick.

In the end it was a lot of work. If I had paid more attention when I started the weblog and also when I made a major change (such as adding the “Speak” feature), I could have nipped this problem in the bud. Even though it did take some time and some very detailed tweaking, I personally feel that it was worth it. Don’t you? 😉 Once I’ve had a chance to link my wounds, maybe I’ll attempt to validate XHTML 1.0 Strict, or maybe XHTML 1.1, or 2.0, or…