More importantly, the script is now much more generic and should work on just about any page you plug it in to. It now works by getting the id of the input element that is currently in focus and searching for a label element with a matching for attribute. This means we are not relying on any other feature of the markup to make the script work.


id = this.getAttribute('id');
label = document.getElementsByTagName('label');
for (k = 0 ; k < label.length ; k++) {
if (label[k].getAttribute('for') == id) {
label[k].style.color = '#a00';
}


One issue I’m having is being able to concatenate two HTML Object collections. I have an array of inputs and an array of textareas, so my question is, why can I not concatenate them as follows.


input = document.getElementsByTagName('input');
textarea = document.getElementsByTagName('textarea');
both = input.concat(text);


At the moment I am using the DOM Level 0 method of getting form elements; which works, but I’d rather do it the previous way, and build my own arrays. Any ideas?

Talking of improving the script, I’ve realised there is a far better way of achieving this than how I have done it, which I will explain in a minute. First of all, go down to the comment form at the end of this post and fill in a few fields. Notice the labels become highlighted as each form field gets focus. Here’s how it’s done.

First of all, get every input element in the page with a type attribute of text. Loop through these and add the onsubmit and onblur event handlers required to trigger the functions which do the real business. This is done with the prepareLabels function shown below, although now I think about it, prepareInputs might have been more appropriate.


function prepareLabels () {
if (!document.getElementsByTagName('input')) exit;
input = document.getElementsByTagName('input');
for (i = 0 ; i < input.length ; i++) {
if (input[i].type == 'text') {
input[i].setAttribute("onfocus","on(this)");
input[i].setAttribute("onblur","off(this)");
}
}
}


Next up I have two functions. One that changes the style.color property to the highlight color onfocus, and the other that reverts the property onblur. I realise that I could combine these into one function with a simple if statement, and I will do in the next version of this. The two functions are shown below.


function on(field) {
temp = field.parentNode;
dl = temp.previousSibling;
label = dl.firstChild;
label.style.color = '#a00';
}
function off(field) {
temp = field.parentNode;
dl = temp.previousSibling;
label = dl.firstChild;
label.style.color = '';
}


In a nutshell, these navigate their way throught the DOM tree of dd and dl, finish up on the label element and apply the new color through the style.color property.

And that’s pretty much it. Simon Willison’s addLoadEventfinishes the job by attaching the prepareLabels function to the onload event.

But what about the textarea your thinking, right? Well, at the moment I actually have a third function which duplicate’s the prepareLabels function but gets the textareas instead.

function prepareText () {
if (!document.getElementsByTagName('textarea')) exit;
input = document.getElementsByTagName('textarea');
for (j = 0 ; j < input.length ; j++) {
input[j].setAttribute("onfocus","on(this)");
input[j].setAttribute("onblur","off(this)");
}
}


I know this is not a nice way of doing things, and it will be improved.

The next stage I want to think about now is making this much more generic. A better solution would be to use the for attribute of the label and match it with the id value of the input that is currently in focus. That way, we are not relying on our form being layed out with definition lists as I currently am.

Anyway, that’s something to think about while I’m on my way down to d.constructbright and early tomorrow morning.

Actually, the reason this completely unscheduled change has just been made, is probably worth mentioning. In short, while doing a little bit of server tidying, I came across the first mock-up I ever made of this ‘Audi inspired’ design. It looked pretty much like what you’re looking at now.

I took one look at it and thought, hmm… that’s rather nice, why the hell did I spoil that by adding the side bar and all the extras? This is particularly relevant due to the fact that I never even used the side bar. The external links where all “Lorem ipsum’, and for some reason the ‘latest post’ loop wasn’t populating. Basically, it was a complete waste of space.

So, it’s gone – and I’m back to a similar concept as in the previous design, dubbed ‘Industrial Minimalist’ by John Oxton. Anyway, I like minimalist — if you’ve got fuck all content it really is the way to go.

Is this a common problem, and what can I do to get around it? Do I have to resort to checking for human interaction with the form (ie, ‘What colour is an orange?’) or perhaps use some javscript to keep out bots?

Any advice?

After the 93MB download, I can report one more smooth installation and a rather nice performance boost. The first thing I checked out was Safari passing the Acid 2 Test. Not only does Safari pass that web standards mile stone in this latest version, but it definitely feels snappier than it has in the past—which is no mean feat.

The application I was most worred about was Mail.app. I’m very picky about the way my mail is recieved and stored, probably because—after BBEdit—it’s the app I spend the most time using on a day-to-day basis. All my plugins, inlcuding Mail.appetizer, Mail Tagsare still working perfectly.

Everything is Rosy with the world, so if you’ve been waiting for a few glowing endorsements of this upgrade then here’s another one you can add to the list.

First impressions of this tool are pretty good. Dead simple to install, mainly because the whole thing is hosted remotely for you. The only set up you have to do is add some Javscript calls to a site wide include (ie, footer), and to your post loop and comments loop. Takes 5 minutes, tops.

Anyway, leave some comments, have a look around my kinda pathetic blog, and basically get me some stats. I don’t get massive amounts of traffic here by any means, so perhaps I should have put this up on UsableTypeto test it out, but it’s here now so get stuck in you loyal few! If it’s worth checking out, I’ll let you know.

I never use gMail as an email client and I doubt I ever will, but now I can take advantage of the 2.5 GB that are sitting there doing nothing.
Heck, if I run out of space I can just move over to another account. That’s better than a kick in the teeth, or a £60 .mac account! NB: Yes I know .mac does more than just that.

Anyway, it’s handy for casual back-ups as well as sharing between machines. Checkthis one out.

I read, as do probably a number of you, Tom Coates’ blog. This means I have been following the story of him contacting his father for the first time.

Some weeks ago he received a letter from his father. The first contact between them ever. He wrote about this on his blog in the same honest, natural way he always does.

A few people left comments. One person left this comment:

“Hi Tom, Always remember one thing. Life is very, very short and nothing is worth limiting yourself from seeing the ones you love. I hadn’t seen my father in 15 years until 2 years ago. I was apprehensive but I kept telling myself that no matter how estranged we’d become there was no river to wide to cross. Drop me a line if I can be of any more help. Cheers, Barry”

Barry, thouroughly nice chap that he appears to be, is a marketing vehicle for Cillit Bang. What the buggery fuck is the world coming too.

Anyway, when it came time to upgrade my phone, instead of looking into all the options properly and really getting a handle on the market, I just popped over to Andy Budd’s site to see what phone he’d most recently bought. If there’s someone I trust when it comes to choosing the latest gagedtry, it is Andy. And he’d made all the tough usablity vs. style vs. functionality decisionssome time ago, so who was I to question it.

It’s a little bit of a departure for me becuase I’ve been using Nokias for about the last 5 years, so it’s going to take me a bit of time to really get used to the software, particularly the predictive text, which is so different it’s driving me crazy.

One of the other reasons the Sony Ericsson models were appealing to me was how well they sync with OS X. As I said earlier I don’t follow mobile phone technology very closely, so here is a list of things I’m genuinely chuffed my phone can do, as I’ve never done anything like it before.

• Connect to any mail server I like (including IMAP I believe).
• Sync my address book without erasing half the contacts on my SIM.
• Sync my freaking iCal with the calendar on my phone, including events, reminders and tasks.
• Auto connect to BluePhoneElite. My Nokia needed approval to connect every time.

That’s the pick of the bunch for me. I quite like the camera too, and it will definitely increase the number of photos I post to Flickrover the next few weeks, which should be fun. The only thing I think it’s missing is an AM band radio. The FM works really well, but when I listen to radio it’s invariably for the sport of BBC Five, or Capital Gold. Still, it’s a small complaint.

One final thing I should mention is this terrific little web site called mobile.feisar.com. It’s dedicated to hints, tips, software, themes & more for Apple Mac, iSync & SonyEricsson users, and it’s been a real lifeline in helping me get everything syncing nicely with OS X.