I've been putting together a personal site for a little while now, and one of the more common pieces of work I've had to do is creating the page headers from a custom font library in Photoshop. The site is 'comic' themed, and as such has an appropriate font (not comic sans!) .

Rather than having to create a new image for each page, I thought I'd cut up the alphabet, and create a function to turn a string into a set of graphics.

Initially this is more work than creating each image, but once you've cut up each letter of the alphabet your job is done. The function simply accepts a string, and uses the Java split() method to create an Array of each letter in the string. It then loops over the string, and creates an image html tag for each item.

A straight forward, simple bit of code. My only issue arose when I tried to roll it out onto my live Coldfusion server, which is running Coldfusion server 7. It turns out that looping over Arrays like this was introduced in Coldfusion 8! So I'll have to code a work around.

Backwards compatible version:

I have since discovered that you can wrap the whole thing in a h1, h2 or h3 tag and search engines will read the images as if they are text, so your SEO is not negatively affected.