Hello again everyone. Sorry I didn't post something earlier this week, I've been very busy with work and dealing with a lot of frustration trying to buy a house. With the closing postponed twice and lots of just unbelievable events, it hasn't been a fun week. The good news is that I finally closed today. Now I have the pleasure of moving... happy happy, joy joy. Well, anyway, this is supposed to be a tech blog, not my Live Journal - so, let's get to it.
So, if you've been reading my entries you know I have a fondness for the standards. I know a lot of people dismiss the need for standards and say it is too much trouble to deal with. But, in all my experience, when someone does bite the bullet and begins applying the standards to their site, and they begin to reap the benefits, they kick themselves for not doing it earlier. I'm not going to lie and say it is trivial to do, it is like breaking any bad habit and retraining yourself. If you're a newbie you're actually better off, you can train yourself from the start to do it the right way. The more bad habits you have to unlearn, the harder it is to learn to do it the right way. I had to force myself to stop slipping into old habits when I started using the standards. And sometimes standards change too, or something that wasn't covered gets standardized - and not in the way you had been doing it.
For example, it used to be recommended to write your HTML element tags in ALL CAPS to help visually distinguish them. So you'd have <BODY>, <HEAD>, etc. But them XHTML came along, which standardizes HTML as an XML implementation. There are benefits to doing things this way, and I've embraced XHTML 1.0 for all my work. But XML standardized elements in lower case. So <BODY> is no longer valid, you have to write <body>, <head> etc. After ~10 years of writing it the other way, it took me a while to get used to not hitting shift when typing an element name. Oh well, such is life.
Odds are if you're reading this you're not starting from a clean slate, you already have some web content. Now, if it is already standards compliant, I applaud you. But knowing the state of the web, you probably started off working through trial and error. You copied from other sites, used FrontPage, and just poked at things until they looked decent enough in IE, and maybe some other browser. Now you're sophisticated, worldly, and you like to play the field. You know there is more than one browser in the bitstream, and you want to be able to share the love with any and all of them. You've learned about the standards for XHTML and CSS, and you know using them would make you compatible with all the finer browsers.
But you have a ton of pages you've already created and the thought of manually cleaning up that mess makes running away to join a monastery sound oddly appealing. Going back and updating all of the old pages is something no one likes doing. Plus there is always new work waiting to be done, so when do you have time to slog through all of the old pages to manually fix them? If only there were some tool to help you.
There is, and that tool is HTML Tidy. HTML Tidy was originally created by Dave Raggett of the W3C as a tool to help people 'tidy' their HTML up - hence the clever name. The tool was open sourced and turned into a code library, which is how it stands today. That library has been incorporated into a number of tools - from standalone Tidy applications, to text editors with built in Tidy support. It isn't going to save you all of the work, but it can sure reduce the amount of manual cleanup you'll need to do.
On the current homepage for HTML Tidy are links to many libraries, tools, etc, that incorporate HTML Tidy. Just look at the list running down the right side, one is probably right for you. The historic homepage is worth looking at if you're curious.
I'm planning to do a full entry on the Firefox browser extensions I find very useful, but I'll mention one in this entry since it is HTML VALIDATOR (based on Tidy). Yes, that's the full name. This embeds the Tidy engine right into the browser and it will validate every page you load. Down in the lower right-hand corner a green check means the page is valid, a yellow '!' means there are warnings, and a red 'X' means there are errors. I find this visual cue extremely useful as I'm developing pages. I should ALWAYS see a green check, if I'm doing things right, so the second I see something else I know I've goofed.
Hover over the icon and you'll get a tooltip that gives a little more information, and it updates View Source to to have multiple panes which show the warnings and errors. You can even use Tidy to clean up the errors for you, right in the browser.
You know how I'm writing this? As 'fifth-entry.html' in Notepad, with it open in Firefox. I save the file and reload the browser periodically to check myself. And I just caught a mistake, I typo'd an </a> tag in the previous paragraph, breaking one of the links. The extension caught it, told me right where I goofed, and I fixed it in seconds. If you do development and you use Firefox (and you do test in Firefox, right?), you should check this extension out. For a very simple tool I find it extraordinarily useful.
