What's New
Inside the industry and inside the agency
I've been designing a lot of forms lately and it's come to my attention just how much difference a well designed form can make to user experience. Sites can lose a lot of users based on the design of their forms. If a user is put off by an overcomplicated look, difficult to understand terminology or simply the length of this almighty form, they will usually exit the site never to be seen again.
But fear not, poorly designed forms are on the decrease and there are lots of useful write ups and pointers as to where you can put things right. Huzzah, I hear you cry! Huzzah indeed fellow form-filler-outers. Here are a few things I've come across in my form travels that have helped me create a clean and simple user experience for our clients.
Findings
1.
Keep it simple. This is an example of how I feel all forms should look. Cut out all the added extras that don't have a place on your form, leaving only the necessary fields that you require for the user to go to the next step. Its obvious to the user what is needed of them and they know it will only take a short while for them to be done.
2.

Colours play an important role in your designs. Users will want to know what are buttons, what will happen and what they should expect when they click on these funny coloured bits. Be bold with your colours but stick to a few and keep it minimal, make your final "continue", "Submit" or "YES THIS IS THE END" button the one that stands out the most so they know what to do when the time comes.
3.

Layout is king. It's the glue that holds your form together. I find it useful to adopt the mindset of the person filling out the form - what will they want to do first, where will they go next. For layout this style is the most popular, as it is set out in the natural flow as to which we read and process information. The steps of your form need to be logical and never misleading. If you have notes relating to a certain field make sure they are conveyed clearly and are noticeably linked to the field they relate to. It's good practise to ensure the length of your fields are comparative to the data that will be going in them for example: don't make your postcode field ten yards long and your email address field smaller than a newt's toe - the user will not be happy!
4.

A nice touch for those mammoth forms that are long but necessarily so - a progress bar! Divide up your content into sections of similar content steps and show the user exactly where they are in the process. It's always good to know how much you've done and how much you are still needing to do on mega forms - you don't want any hidden extras popping up when you don't want them!
5.

Finally, error messages. They are really important and vital to get right. In the rare occurrence that your user hasn't filled in a mandatory field on your form you need to tell them and show them exactly where they can put it right. They won't mind a little form-filling-in criticism if it means it gets the job done, so don't be shy, be clear :)
Happy forming!
Leave a comment
Contact us to discuss your digital requirements
Tel. +44 (0)20 7183 4999
- Accessibility (2)
- Advertising (4)
- Alterian Immediacy CMS (5)
- Analytics (1)
- Application Development (9)
- Awards (17)
- CMS (17)
- Ecommerce (8)
- Email Marketing (7)
- Fun Stuff (40)
- Hosting (3)
- Mobile (4)
- News (67)
- Pay Per Click (1)
- People (30)
- Project Management (11)
- Rich Media (6)
- SEO (14)
- Social Media (16)
- Systems Integration (6)
- Usability (10)
- Video (1)
- Web Design (44)
- Web Services (9)
- WickedWeb CMS (15)
- Windows Application Development (1)
Tags
- Analytics
- Application development
- Awards
- Brand
- Content Management Systems
- Digital Marketing
- Email marketing
- Fun stuff
- Homepage
- Hosting
- Mobile
- News
- Online marketing
- PPC
- People
- Print design
- SEO
- Sitecore
- Social media
- Strategic Consultancy
- Systems Integration
- Video
- Web design
- Web design and build
- eCommerce
Archive
- 2013
- 2012
- 2011
- 2010
- 2009
- 2008
- Twitter feed unable to load





