Use labels & placeholders

Lots of people don’t think they need to be told what to do when filling out a form, but we’re here to tell you that it is always a good idea to give your end user a nudge in the right direction.

Labels are the part of the form that tell you what the field is, and it is usually placed outside of the field. A placeholder is usually located within a field and tells you an example of what information you are expected to put within that field.

For example, some websites utilise contact forms when you are trying to locate a parcel. So your label would be “Order Number” and the placeholder would be something like “e.g. 12569897”. This means that there won’t be any confusion, and the end user knows that the information they are inputting is correct.

Form labels example from uxplanet.org

Make it mobile friendly

Many website visitors are now using their mobile devices to browse the internet, which means it’s even more important to not only make sure your website is mobile friendly – but to ensure that your call to actions and forms are intuitive.

Screens are getting bigger on mobile phones, but that doesn’t mean we should be stingy when it comes to UX (that’s user experience). Doing small things like making a numerical pad come up when they’re typing in a phone number, or advancing them to the next field when they click confirm on each section can have a huge effect on the mindset people have when using your website on a small device.

Fix errors as you go

It can be easy to make mistakes, even when you have clear labels. We would encourage that you set up an error finder, so that when a wrong piece of information is inputted it gets picked up before it’s sent to you and you’re left picking up the pieces thinking “what is that email address meant to be?”.

You should only make sure that this is triggered after they have moved on to the next field though, as it can cause more problems & confusion if it immediately says “oops something is wrong” when they’re still typing in the same box.

Hubspot.com giving you an inline heads-up about possible mistakes

We have received your message!

You should always give your end user confirmation that the information has been submitted successfully. Lots of businesses choose to send confirmation emails that go straight to your inbox so you know that it has been sent, however if you don’t want to do this a simple message that pops up on the website as soon as it has been sent is a good alternative.

You should make sure that you say thank you for taking the time to fill out the form, and also explain what they can expect to happen now that their information has been sent. It’s also an ideal time to suggest a service, post or product to keep their attention and interest.