I have seen some pretty bad form ideas during my tenure as a UI designer, this one beats them all. While renewing my Surfer Magazine subscription over at magazines.com I ran into this hall of fame form blunder…

magazines.com payment form
…not so bad right? Wrong, as soon I you tab into billing address you get this…

disappearing labels
Where did my label go? I have no idea what to type in this field do you, looks like billing address. Nope there are two fields for billing address below, so I guess I will have to clear the field and tab out so I can see the label again. Yikes, that was awkward.
I almost abandoned my cart out of principal and would have if Surfer Magazine hadn’t neglected to ask me if I wanted to renew. Maybe they are mad because I moved to Portland, anyway I soldiered on and finished the purchase but I bet not everyone has enough land locked surfer motivation to push them though this form trickery.
Labeling your form has been well researched by Luke Wroblewski and countless others, there is really no excuses for this type of UI hackery.
Print the labels outside the fields run a A/B split test on it and I bet you get increased conversion rates.

just a bit more space to make it work

There are no comments yet for this article, be the first!