A Lesson in Encoding

I’m currently working on a responsive HTML5 template for my website. As much as I like the old one, it is starting to get a bit long in the tooth. Five years of life is a pretty good run, but it is time to get with the modern world full of mobile devices and tablets. Unfortunately, I’ve run into a bit of a pickle.

You see, I encoded my original site in Latin-1 or ISO-8859-1. Makes sense right? Okay, for those that don’t know that is an encoding format. Basically it is how the browser interprets the characters you type. The problem is that my new template is UTF-8.

In and of itself, this isn’t an issue. UTF-8 is what most websites use. It allows you to support a range of languages that use different characters. This is known as Unicode. The problem is that I had encoded my older files in ISO-8859-1, another unicode implementation. Basically, one template or the other displays things entirely wrong depending.

Because I haven’t published the new template yet, it really shouldn’t impact you. Except, however, that I already added a few articles using the new template. You will see some odd encodings because of that. Don’t fret. I’m working to fix that problem. Please bear with me while I get through this.

One area that was really broken was my ZX81 listing. My past editors were actually set to use ISO-8859-1. But my latest editor, Atom, set the encoding to the standard UTF-8. Guess what, things didn’t work so well. I could cut and paste between them and things would look right, but the site was all broken.

The fix was actually something simple. Convert to HTML entities instead. I basically removed all the special characters and encoded them instead. Guess what? It works now in both templates!

Now, I just need to figure out why sometimes my articles do the same, and other times they don’t. I’ve noticed some oddities for sometime when editing articles. Sometimes they are all messed up. I’m pretty sure one is encoding correctly and one isn’t. Time to add a new action item to my list.