How To Design A Contact Page That Converts

Contact form design

How To Design A Contact Page That Converts

  • If the main objective of your website is to make your visitors get in touch with you, then, Keep contact option easy to find, so a visitor can quickly get in touch should they need it while going through your website.contact option
  • Give people what they want - Instead of having the form as the only mode of option for contacting you, Include an email and phone number, so visitors can quickly get in touch with you if they wish. Give them the fastest and easiest way to connect to you.
  • Link to active social media accounts like Twitter, Facebook, Instagram and LinkedIn to give visitors a way to get to know you better and to engage with your business.
  • Keep your contact us page short, sweet and to the point. Avoid unnecessary fields and words so your page remains as straightforward and simple as possible.
  • Many businesses while copywriting their contact page - mistake being crispier for being too professional. Sounding too professional would make you bit boring unless you deliberately try to be one. The more friendly you make your page’s copy, the better you’ll make your visitors feel and better chances of them turning into a prospect.contact form with copy write friendly content
  • If you are a big organization or a company providing various services under one banner, chances are that a lot of different types of people are visiting your website - and what these people want to contact about can vary widely. You can segment/filter the audience at the very initial stage by providing them with different contact options/types to choose from – instead of having all under the same roof.contact form with type select
  • Having some fields like the ones that ask for mobile number would prevent users from filling up the form out of privacy concerns. While asking for such information that are not mandatory but would be an added advantage - make them as an optional field and distinguish them, common and widely known way of doing it is to use asterisk mark (*) to mark mandatory fields or to write down ‘optional’ near the label of the fields that are optional.
  • Use proper placeholder texts to guide users while they fill up the form. In an attempt to shorten the length of a form or reduce visual noise, designers use placeholder text as an input label. This practice places the burden on short-term memory of the user. The label disappears as soon as the user clicks or types. The entry must be deleted to expose the label again.For best results, avoid using placeholder texts as input label. Create clear hints that are placed outside form fields. For better user-friendliness, move the placeholder content above the input field, but below the label.Placeholder text sample
  • Make sure your forms are mobile friendly. If your mobile visitors cannot easily read, complete and submit your form, you may lose their business. Make sure you minimize the number of form fields, use a single column layout and to have a clear action button. Also, avoid crowded drop-downs (example - country/state selection), instead use the auto-complete feature that completes the text as users input the initial letters.If you want to take mobile form design a step further and ensure your entire website is functional on all types of devices, you can implement a responsive website design. Responsive web design takes the user’s screen size, platform, orientation, and environment into consideration. This is a simple and effective way to create a great user experience irrespective of kind of device being used.
  • If you have a form, you’ll get spam. That’s the bitter truth. So you need a way to block spammers from flooding your form submissions. For a considerable period of time, the accepted anti-bot measure was CAPTCHA - a program designed to protect against spam bots by generating tests that only humans could pass. Up until recently, Google announced CAPTCHA’s death. The best alternative is to use reCAPTCHA. Instead of going through the cumbersome process of identifying bizarre texts, users had only to click a button to identify themselves as human. In terms of security and user experience, reCAPTCHA is a significant augmented form of its previous version.
  • Once users click the Send/Submit button, redirect them to a thank you page that explains what to expect next as in when and how you’ll be contacting them back and links to helpful content and resources. This page can also be used as a checkpoint to measure a number of conversions i.e the number of people who have successfully submitted your contact form, by using page view feature in google analytics, in case you have integrated google analytics with your website.
  • So what if an error has occurred and users couldn’t submit the form. You have to put up an error message text not just saying an error has occurred instead of a proper indication of why and where the error has occurred so that it would be easier for the user to rectify it. Read more about form validation and errors.
    error info in contact pageThank you


Please let us know your comments/thoughts