Designing our websites primarily for mobile devices can have a beneficial impact on desktop versions, as we’ve discussed often in the past. There’s an extraordinarily good article on Smashing magazine called Best Practices For Mobile Form Design which although concentrating on mobile devices, will also give you many good ideas for forms on any screen size.
Forms are one of the worst parts of business web sites. Some of the problems are organisational, such as management insisting you demand prospects give you their address, mother’s maiden name and inside leg measurement just so you can email them something. The mantra here should be: “ask for no more information than you need”, and if the information you need is complicated, just ask for their phone number and call them to find out what you need to know.
But many of the problems with forms are to do with design. I’m not a web designer, but I do know enough to recognise that making forms functional and good-looking is difficult, and I suspect it’s beyond the skill set of many web designers. The article above really gets to the heart of what a successful form is all about, and will allow you to specify exactly what your forms should contain, what they should look like, and how they should operate. The rest is up to your web designer, and any lack of competence on their part should not compromise your site. Make those improvements and watch your enquiry rate rise.
Best Practices For Mobile Form Design on Smashing magazine
People who commission websites, like you and I, must be in awe of web designers. That’s the only way I can explain the way that we allow the look and feel of our sites to slavishly follow the styles that are in vogue, and which just happen to have lots of up-to-date, off-the-shelf templates which designers can use and save time. You can date the majority of websites simply by looking at them.
Some of the features which have come and gone weren’t great. Take links and buttons, for example, which I mentioned last week. Once upon a time all links were underlined blue text. If you’re under 30, you probably can’t imagine a web where everything looked like this. Then designers started experimenting with different colours (confusing), removing the underlines (design at the expense of functionality), buttons (which worked, in moderation), animations (which made everybody sick), rounded corner buttons (cute), shadows and 3D (which went out of control), flat design (as a reaction), and most recently, ghost buttons. These are the type of buttons which just have the text in a translucent or transparent box.
Now doubt is being cast on the effectiveness of this latest trend. Research has shown that stronger contrast between elements reduces the time taken to find information. This won’t come as a surprise to anyone who uses the proven technique of Common Sense. But the lesson to learn is that we should not be afraid to question website designers. Make them explain why they’ve chosen a particular way of doing things. In many cases, their only answer will be because Noupe or Smashing have told them that’s the trendy thing to do at the moment. And that’s not good enough.
I laughed when I saw Should I Use A Carousel? and I suspect you will too. I won’t give away the answer. However, if you’re an unashamed convert, or if you’re forced to have a carousel slideshow on the home page, then do read Ten Requirements For Making Home Page Carousels Work For End Users (If Needed) on Smashing Magazine. Test your own carousel out against the ten usability requirements specified at the end of the article, and if yours doesn’t conform, ask your designer why not. If sorting it out is expensive, ask yourself if you really needed it in the first place, and if you filled it up just ‘because it was there’. If the messages are all necessary, think about the quick and easy alternative of having smaller, individual panels showing all of the time.
Our business websites need to convey a reasonable amount of gravity, of course. But is that any reason for their graphic design to be boring? I’d certainly classify the majority of business websites as just that (and to be honest, I’d find it hard to argue that our own isn’t boring, from a graphic design point of view).
Unfortunately for all of us, our visitors don’t just look at business websites. They’re used to seeing some of the most leading-edge stuff which the web has to offer, on a daily basis. Without knowing it, they will be comparing us to that, and a graphically dull site is one from which it’s much easier to hit the back button.
I don’t think your next company website tweak should try to copy the most avant-garde stuff that the web has to offer. But it’s always worth looking at the best websites out there, just to stop yourself getting complacent. And who knows, you might even pick up the odd idea which really could be appropriate on a business site. Take a look at Original And Innovative Web Layouts on Smashing magazine for a start.
What does your website look like when printed out? Printed out on paper, I mean. Because however archaic that sounds, it’s something that people often still have to do, especially in a business environment – and particularly when researching or specifying products. Your prospects and customers will be printing pages off your website all the time. Sadly, what they print off might not be doing you any favours.
Go to a product page on your website and print it out from your browser. Don’t worry, I’ll still be here when you get back.
Good. What does it look like? Is it a nice, well formatted printout that you’d be happy to send somebody in the post? Or does it look like a photograph of what appears on your computer screen, complete with (now useless) menus and links? Is the type nice and legible, or does it clearly come from a source not designed to be printed out on paper?
The chances are that you might need a print stylesheet. This is generally accepted to be the best way to tackle the problem of converting web pages to paper. It automatically reformats the page to a more print-friendly format when someone hits “print” on their browser. The alternative solution is to have a separately formatted “print version” page (which can be plain text, HTML or PDF), but that requires a separate version of the page to be maintained, and for the reader to spot the “print version” link on the page before hitting the “print” button.
Any competent web designer will be able to add a print stylesheet for you (ask me to point you towards one if you don’t know any). It’s just an addition to your site behind the scenes, and won’t affect the normal operation of the website in any way. There’s a good background article here and some terrific hints which your designer might thank you for here.