I spent a bit of time yesterday and today rationalising and cleaning up some of the HTML templates on the new reevoo.com site. It’s the kind of work that doesn’t have any immediately obvious value to the business, or even produce any apparent effect from a visitor’s point of view, but it’s absolutely necessary in ensuring the quality and maintainability of our code. Of course, I didn’t do it completely at random: it was a response to pain that I’d experienced whilst updating some of the pages.

One of the things that I wanted to do was to reduce the number and complexity of the layout templates in use. These define the overall layout and look of a page, and—in an ideal world—make it easy to work on the content of each page without worrying about what goes on around it. We had a dozen or so layout templates in use. That wasn’t a ridiculous number but, with only a handful of distinct page layouts on the site, it was more than we needed. I wanted to fix that.

I started off by looking for similarities and differences among the templates. To do that, I could use the Unix diff tool. To do that, I needed to normalise the templates with regard to indentation, trailing spaces, blank lines, and hard tabs, so that functionally identical lines would also be literally identical. And for that, I needed a normalising utility that could understand both HTML and embedded Ruby. Tools to do the first exist. Tools that also do the second don’t, to the best of my knowledge.

So I wrote one.

It’s pretty basic, but here’s what it does:

  • Normalises hard tabs to spaces
  • Removes trailing spaces
  • Indents after opening HTML elements
  • Outdents before closing elements
  • Collapses multiple whitespace
  • Indents after block-opening embedded Ruby (if, do etc.)
  • Outdents before closing Ruby blocks
  • Outdents elsif and then indents again
  • Indents the left-hand margin of JavaScript and CSS blocks to match the indentation level of the code

It started off as a single-file utility, but it’s grown a little as I’ve refactored it, added tests for things it couldn’t handle and then fixed them, and made it into a more conventional Ruby library + command-line utility structure.

If you’re interested in trying it out, I’ve set up a Subversion repository on Google Code. Grab it, run ruby setup.rb, and you’ll have a beautify-html command. Set it up as a keyboard shortcut in TextMate or whatever, and feed back any bugs or improvements!

Here is the code.

Incidentally, with the help of this normaliser, I manage to cut the number of layout templates down to six this afternoon. Not a bad result at all.