4 Points that Make for a Kickass Contact Page

When it comes to performance of your website, a well-constructed contact page is one of the essentials that’s often overlooked. Too many business owners assume that a contact form is all they need to make people connect with them. In fact, the contact page is one of the most important ones. It should act as a major lead-generator.

As well as leads though, the contact page is where your customers will go to get in touch with you about anything, from product complaint to site feedback. It should clearly show site visitors how to reach the information they require. For example, many contact pages send users to the FAQ first. There most of their questions are likely to be answered with no contact necessary.

A good contact page should be designed with one main goal in mind – to satisfy the customer seeking ways to connect and make them return.

Your contact page should:

Function: A no-brainer, but I still come across contact pages with broken links and even placeholder Lorem Ipsum text. Your contact page must work or it won’t convert.

Contain a form: Some sites just post email and phone numbers. You should always include a form too, so people don’t have to pick up the phone or open up their email client.

Contain relevant contact information: This includes your phone number, email address and ideally, a map showing the physical location of your store (in case you have one). Let people ditch the form and contact you directly if they prefer to. Also include buttons linking to your social media accounts like Facebook, Twitter and the like.

Look great: Contrary to popular belief design matters a lot in contact pages. Keep it in similar style and design quality as your homepage, at the least.

dreamstime comic of elvis with wayfarers business

Include well-written copy: On the contact page, less is more in terms of text. Still, it should be well written and contain calls to action to hand out to the user shortcuts to solutions.

Be responsive: The mobile revolution is here. Make sure your whole page is fit for it or you’ll miss out.

Load quickly: Your site should be fast and the contact page is no exception. If a site fails to load in under 3 seconds you lose a devastating 40% of your leads. That shows just how important site speed is.

Be easy to find: Visitors should never have to spend time searching the contact page. Ensure to link to it in the footer and in the main navigation menu.

#1: UX and the Contact Page

Good UX (User Experience) is at the least as vital on the contact page as it is on the rest of the site. The idea is to align the goals of the visitor to that of the business.

jeff sarmiento landing page example

Forms like the one on this beautiful contact page are still the most common way for people to contact businesses on the web. This means that it’s something to be included from the very start of any web development project and be planned out carefully.

Buttons should be used sparingly too. Your webvisitors won’t embrace a different button for every conceivable option. Keep it simple and utilize design tricks that draw the visitors’ eye to where you want them to look. Buttons can have a dramatic impact on conversion. A/B-test both different color and button text versions to see which perform better. It’s a good idea to carry out testing on various elements of the page, concentrating on one design element at a time.

You can A/B test:

  • Button color
  • Button text
  • The form
  • With and without images
  • Text
  • Images with and without people

#2: The Contact Form

Another area in which many sites fail, usually because they ask for far too much information. Sure, you may want to build your list with as much detail as possible, but that doesn’t matter to the site visitor. They certainly don’t want to part with lots of valuable information whilst bothering to type on a tiny mobile keypad.

screenshot picture of designwise contact page example
(Image Courtesy of designwise)

The form should contain input fields for:

  • Name
  • Email address
  • Phone number

You shouldn’t make it necessary for people to input their phone number in order to contact you. Many people don’t like giving out their number. If forced, they will either abandon the form or simply type in a fictitious number.

#3: The CTA

Your call to action can appear a couple of times on your contact page, generally in the text and on a button. A good contact page will contain a CTA that says something along the lines of ‘contact us today for a free demo’ and the button text will say ‘submit’, ‘go’, or similar.

If you think that colors and text on CTA buttons are subordinate, then a test carried out for Performable might change your mind. In an A/B test, a red button was tested against a green one for conversion.

screenshot picture of resumator homepage red green cta button

Red means ‘stop’ or ‘delete’ to most people whilst green is associated with going ahead. Still, the the red button outperformed the green by a whopping 21%.

So yes, color does matter, as does the text that’s used on the button.

Bear in mind that with colored buttons in the front, the colors you choose for the background also matter. Create contrasts, so the button stands out from the page. Don’t forget to consider what users who are color blind will see.

color palette differences color blindness color blind

Above you find a simulation of what people without and with color blindness see. The colors for color blind are similar in shade and completely different to how healthy eyes will display them. Since red and green are on the opposite sides of the color spectrum, they complement each other. Placed side by side, they are very difficult for a color blind person to distinguish. So never pair colors such as these on your site, and especially not on a contact form page.

When it comes to your CTA button, it’s vital to pay attention to details if you want it to really perform.

#4: The Copy

As mentioned above, the copy too is very important on your contact page. Your text should use short, punchy sentences and not spread to paragraphs. The headline copy should be around six words long and instantly tell the visitor why they are there.

screenshot image of contact page example
(Image from alexarts.ru)

If you really feel the need to add lots of text, use bullet points. These are easy to take in and don’t take up much space. However, think of mobile visitors who might not want to zoom and scroll in order to contact you. Anything that requires the user to work to reach their destination means that you’ve lost them. So review that copy, think short, simple, dynamic and punchy instead – that’s what gets result.

Finally, the probably most important thing is to always have someone on hand to reply to queries that come in through your website. If you display a contact phone number prominently, then you should have a customer service rep ready to answer calls. If you use email or contact form information, then you should aim to reply promptly. Don’t use the office junior who only works two days a week. Your contact form is a way for people to get in touch and find out more about your business, products and services. As such, make sure that someone is always available to represent your company.