Working with Standard HTML

Perhaps I’m behind the times.

I’ve generally thought of myself as pretty darn good with HTML. I can generally get the effects that I’m looking for with trivial effort. And although I’ve been aware of (and have read a great deal about) the new forms of standard HTML — HTML 4.01 and XHTML — I haven’t really found any compelling reason to ensure that my HTML was standards compliant.

Okay, sure, I believe in standards. I believe that standards compliance, when cheap and easy to accomplish, is a really Good Thing. But there’s the thing. Generally, it’s hard to get the team to remember standards compliance when they’re coding up JSPs.

But recently, I’ve started to gain a new love for standards-based HTML. First, a motivating example.

A year and a half ago, I had been trying to do some very specific things with radio buttons. I was writing some Java code that parsed some HTML forms to find all the input fields. I was interested in trying to figure out which text corresponded to the radio button selection. That’s a very hard exercise in the abstract. But it can be made a lot easier using the HTML

Like this:

<html>
  <body>
    <form>
      <label><input name="colour" type="radio" value="red"> Red</label><br>
      <label><input name="colour" type="radio" value="blue"> Blue</label><br>
      <label><input name="colour" type="radio" value="black"> Black</label>
    </form>
  </body>
</html>

One of the things that I really liked about labels was when you viewed this document in a nice browser like Firefox, the browser would know that you were trying to select a radio button if click on the text label. Without the label tag, I’d have to click my cursor on the actual circle area of the radio button.

Being able to click on the radio button label is a typical behaviour when you’re building Windows applications, but it’s not very common when you’re building HTML pages. So when I learned about the

But…

It didn’t work under Internet Explorer. I was extremely unhappy when I discovered that. There was much cursing of Microsoft.

But here’s where some of my new-found appreciation for standards-based HTML is coming from. Apparently it does work under Internet Explorer if I tell IE that my HTML is standards-based HTML.

The way I do that is to include a DOCTYPE in my HTML file. Once IE believes that my HTML is standard, then it decides to recognize my

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
     "http://www.w3.org/TR/html4/loose.dtd">

So once I became more interested in standards-based HTML, I started looking for ways to make creating standards-based HTML cheaper and easier. There are a whole whack of tools that are pretty useful.

The most common one is, of course, the W3C HTML Validator. If I create an HTML file, I can upload it to the validator, and it’ll tell me if I’m breaking any of the standards rules.

There’s also the extremely useful Firefox Web Developer toolbar. Two features of this toolbar really shine:

  1. There’s a menu item that takes a page I’m viewing in Firefox and submits it directly to the W3C Validator to check to see if the HTML is valid. This saves a bit of time.
  2. Even better, there’s a blue checkbox that lights up when the page I’m viewing puts the browser into Standards Compliance Mode.

Two invaluable tools.

It's only fair to share...
Share on FacebookGoogle+Tweet about this on TwitterShare on LinkedIn

Leave a Reply