Contact Page Web Design

Is the Contact Page Web Design of your web site worthy of attention?

Is it worth to pay a lot of attention to Contact Page Web Design? Why can’t you just leave a phone number or email address? If you have asked yourself this at least once, our web development team has some advice for you in this article.

Everyone knows that a page with company information is a mandatory part of any site. The fact is that the more original your Contact page is, the more likely it is that a visitor would be interested in what you offer no matter what industry you are part of.

A working contact page is beneficial to any sphere.

  • It can increase the satisfaction of your customers by helping solve their problems through this page.
  • It could help improve your products and services by getting valuable reactions from your customers.

In the modern IT-world, communication should be two-way. You are already familiar with the example of one-way communication, such as TV, newspapers, radio, and magazines, but online communication is better when it is two-way.

This includes small talk between companies and potential buyers. As a result, both parties benefit from this. That is why a good page is so important.

It is very important to know how to do this type of page in the right way.

How should it work? Let's take a look!

A contact page should include 6 main components

Let's start with the main one and consider the information that should be given there about Contact Page Web Design.

1. Contact Form

A form is the easiest way to communicate with you through your site. Most websites use forms on their page.

However, some forms are:

  • too complex
  • too unfriendly to the average user

No matter how simple the touch form may seem, it is actually a combination of several components. They all need to work together to make the best user experience possible. Website visitors are more likely to fill in short forms, as they require less effort.

Advice on how to create the best form:

  • you should use as few form boxes as possible and be especially careful with complicated text areas and drop-down lists
  • stimulate your potential buyer to fill in the fields by specifying the correct format
  • phone numbers and dates can be a pitfall, especially for foreign visitors
  • point out the required fields that are necessary to fill in (they are usually highlighted with an asterisk *). It is safest to clearly indicate required and optional boxes.
  • It would be useful to highlight the active field. It can be indicated as subtitly or brightly as you wish.

2. Address

The next step is the address. A business with a traditional store should not forget to mention its address. If you have many addresses, then add them all to the Consult Us page. This will be more convenient for your client.

zendesk contact page

3. Telephone

The presence of a telephone number evokes a feeling of trust. This is often seen as a sign of a real-life company and can really help your business.

4. Social networks

Many websites began to add links to their social networks to the contact page. This is a benefit for 97 % of sites. For modern visitors, this is important.
Businesses are getting bigger and bigger and many offer customer support through various social networks (sometimes even seven days a week, around the clock), which makes social media connections especially important.

5. Email

It is not very convenient to use e-mail. It's easier to fill out a simple and short form than to follow a link. However, there are situations where the customers just need to communicate with you via email. This happens especially when they need to attach a file. As they can't do it in the form, so it's better to use email.

6. Buttons

There is no contact form without a submit button. It should be at the very end.

- "send message" instead of
- "send"

to unintentionally customers what they are doing.

A trend of Contact Page Web Design from last year was to turn on the reset button or clear the form. Do not do this, as users randomly click on it.

There is nothing worse than printing a thoughtful, detailed message and losing it due to the reset button.

Locate your Contact Us page in the footer or header

It makes no sense to have the best page in the world if the users cannot find it. Adhere to some Contact Page Web Design traditions to help them!

In general, all the links to your contact information can be located in two places:

1. Basic Navigation is the perfect place to link to a contact page

Visitors usually expect to find your contact page in the right corner, because it is considered as an element of secondary value.

Therefore, you just see the link to this page as one of the less important elements of site navigation. We can also look at sub-navigation in the upper right corner of the monitor.

This is also a practical position for the contact page.

By the way, it is better to avoid placing it in a drop-down menu, since it is easy to miss it there.

2. The footer is another popular place

The footer may contain a link to a page or to the most important information about you. It is difficult to predict the flow of visitors to the page, so placing links in at least two of these places would cover you.

Now you can be assured your visitors could find the path to your main information

14 effective tips that should apply to your own Reach with Us page!

There is no one-stop explanation for making a good Reach Us page. Any website or business requires certain elements that may be redundant on other types of sites. There is much additional information or properties that would prove useful on this page.

  • For traditional stores, include hours of operation.
  • Larger companies could link to their Live Chat.
  • E-commerce sites could build user confidence by posting their VAT number.

Tips 1. Make your information convenient

Ease of use of the information would protect your visitors from the disappointment with the contact page.

  • Instead of images, include your information as HTML text. HTML text can be copied and pasted, making it easy for the visitor to save your information.
  • The email address must use the mailto link. This gives the visitor the opportunity to click on it and send a message without having to copy the address.

With this technique, however, there may be a problem because of spambots collecting email addresses associated with the mailto link.

You can get rid of spam bots, however, with the help of various special services.

Tips 2. Phone numbers should be interactive

Thanks to a small snippet of code, smartphones recognize phone numbers and provide the ability to call them. It is really convenient for mobile users.

Tips 3. Give an interactive Google Maps

Businesses that rely heavily on their traditional stores often benefit highly from the use of an interactive map, giving visitors the ability to find their way to retail outlets immediately.

Showing a store address is good, and adding an interactive map is even better!

Thanks to Google Maps, you can paste in this useful feature. You should enter your address in Google Maps and click on the link icon in the side column. It's not easy but you can call a web developer to help you.

Do you know that you could adapt the card for yourself? You could edit map colors, add custom pointers to the map, and create a legend.

Tips 4. Don't forget about search engine optimization

As a visitor, you would instantly recognize the address on the page. The search engine needs a little help in recognizing various elements. This problem can be solved by applying structured data.

Structured data is an HTML markup form that provides search engines more information about the core meaning of the content. You could take another step and wrap this block in an address element.

Tips 5. Use form validation

Internal validation can prevent some form fails. The need to submit and resubmit the form due to incorrect data or data in the wrong format is very annoying.

Tips 6. Response that the message was sent successfully

Visitors enter their private information, write a message and click the “send” button.
- What's next?
- Do you get a message or not?

Assure your visitors that the message was sent successfully by displaying the appropriate message. It’s also a good idea to use a confirmation email.

thank you page wishdesk

The same advice applies to errors. Displaying a failure error with sending a message is a necessity that can prevent any future disputes. The error message should be friendly, so avoid displaying alarming error codes.

Tips 7. Your customers should be a priority

Your potential customers should be a priority for the company. Show them that they are your main focus by converting website visitors into the leads. Design your site to be convenient for your customers. Put Yourself in Your Customer's Shoes.

Tips 8. Check everything on your page

This is obvious, but take the time and check everything on your page. Broken and incorrect links can adversely affect your business. If the email or phone number does not work, then why do we need the Contact page?

Tips 9. Make an effective website design

It should look great. A page with your information should not be the most interesting thing on the site, but you should not neglect it. If the "Contacts" page is poorly designed, then there is a very high probability that people will not want to work with you further.

Tips 10. Fill the page with well-written text

You could attract and retain a visitor on the page using texts containing a call to action and information about what your brand offers to the user. This would help you establish a long-term relationship with customers.

  • you should not overload the page with long uninformative texts;
  • use a descriptive headline with keywords. The heading at the top of the main page is either descriptive or useless. The headline should include keywords. If visitors ask themself where they are, the design has failed.
  • the title is a unique opportunity to use the target keyword phrase.
  • a clear headline is better than a smart one. It just has to explain the main thoughts.

Tips 11. It must be adaptive

Due to the fact that mobile communications now occupy a significant part of Internet traffic, you should make sure that your "Contacts" page is displayed and works normally on all visitor`s mobile devices.

Plus to find your physical location, users can use the map on their phone.

Tips 12. Ask for the most relevant information

Contact us text-ability could create or destroy a contact page. Request only the most relevant information. You can avoid a headache by showing the correct input field format and applying internal validation.

Tips 13. Avoid the abundance of different colors

Try to follow one color scheme without adding extra colors to it.

Tips 14. Post photos of real people

People's faces have a unique psychological strength. They are the best way to say, communicate with us!

From birth, a person constantly sees different faces of people. Over their life, these add up to hundreds of completely different individuals. They have some kind of magnetic force. This is the main thing that is required in web design.

Analysts at NN Group found that users pay more attention to photographs and other images containing relevant information, but ignore stock images taken from public sources. Photos of real people not only attract attention but also contribute to conversion.

Best 9 Contact Us Page Examples

Speaking of good forms design, let's look at these examples for inspiration.

1. Survicate

This page of digital marketing company Survicate has a very informal atmosphere. They know what a form page is. But don't be fooled! This page still serves to fulfill business goals, giving you the opportunity to describe your project. It is important that the company requests only your name and email. A small number of fields to fill out is an excellent technique for attracting users to register.

Survicate Contact Page Web Design

2. Thinkingbox

What we really like about Thinkingbox is that they use the modern visual design of their business page. This is effective, especially when you consider how often people try to find a company using their smartphones. What is really interesting in this example is that Thinkingbox uses the very pastel background of their Contact Us page. In addition to this, all the necessary information looks pretty clear and understandable.

Thinkingbox Contact Page Web Design

3. Evolve Artistic

As mentioned earlier, it is very important to know the purpose of the user's contact. Evolve Artistic created a way for guests to quickly find out what information they should provide for further communication.

evolve artist Contact Page Web Design

4. Ghost Games

Ghost Games has managed to create a page that highlights the brand itself. Any gamer will instantly recognize the Electronic Arts logo and be able to relate the company to the world of electronic games. This is a great example of consistent marketing.

ghost games contact page web design

5. Moz

You don't need a flashy design to have a cool backchannel page. Moz decided to make it simple and understandable. They used a nice blue background and a bold yellow CTA. The form itself is simple and straightforward. Below is a map that resembles a cartoon frame. That's all — and it shows that you do not need to overload users.

 moz contact page

6. Let’s Travel Somewhere

Of course, touch pages designed in the form of some kind of object, say, in the form of a mail envelope or postcard, look very original. This is a very interesting solution that immerses you in the atmosphere of the site.

lets travel somewhere contact page web design

We've also told you why travel websites need responsive design before.

7. Brown’s Court Bakery

This is a laconic and vintage page with a beautiful design. It is important that not only the phone number, email and links to Facebook, Twitter and the blog are indicated, but also the operating time and physical address.

Brown’s Court Bakery also noted that they have Happy Hours from 5 p.m. to 7 p.m. daily.

browns court bakery contact page design

8. Music City

This is a great example of a page that is both professional and informational. This page is very cozy and calls for direct communication.

Music City contact us page design

9. Simply Chocolate

As the name implies, the theme of the site is based on chocolate, so the designers primarily used a dark color palette. You could find how to evaluate your company web color palette for accessibility on our site.

The page has unique graphics and scroll functions to display an assortment of chocolate. The background of each theme emphasizes the ingredients used in a particular type of chocolate, which helps users make an informed decision when choosing chocolate.

In addition, the footer is designed to be large enough to contain all the contact information in detail.

simply chocolate contact page web design

The obvious fact is that the more inventive you are at creating a touch us page the better. But still, there are certain standards that you should follow.

Contact Us Page “standards” include the following:

Many technical requirements apply to the design of the page, but let's keep in mind one of the most important points is visual styles.

  • fields are broad, friendly and enticing
  • free space and indentation would serve you well
  • forms arrange all the fields vertically instead of placing them next to each other. This reduces the number of necessary movements of the visitor’s gaze when filling out the form
  • the page should be combined with the visual features of the site
  • logo is in the top-left corner
  • horizontal navigation is in the header
  • search bar is at the top of the page
  • links to social networks are at the bottom of the site
  • responsive design

What do most customers say about a Contact us page?

  1. “I like simple and modern design,” is what most customers say when discussing the look of a future site. They often give Apple as an example. Visitors do not like cluttered pages.
  2. They love space. In other words, an e-commerce site should strive for visual simplicity.
  3. Google conducted a large-scale study, studying the tastes of the audience. Analysts came to the conclusion that traditional web design with a navigation bar on the left side, a content area in the middle and a sidebar on the right is inefficient.
  4. Most users gravitate towards a simple and clear single-column pattern. Therefore, it is better to demonstrate one important element on the screen, changing focus as you scroll.
  5. The Google study said that “high prototypicality” correlates with the perceived beauty of the template. In other words, strange is not always beautiful. A website that follows web design standards is more likely to appeal to customers.
  6. According to the polls, the sites considered the most beautiful have both high prototypicality and low visual complexity. They are clean and simple. If you want to stand out from the competition, this is great.
  7. Do experiment with logos and slogans, but not with the template. This is not the place to experiment.

In general, giving recommendations on Contact Page Web Design is a difficult task, because many difficult to predict factors influence the final success of a business. Even with 1000+ successful web projects, it’s hard to say what works best and for what reason.

Use the tips mentioned above to make your Page Web Design better. Make sure that all the information follows these standards and works well. If not, well, you definitely need our help. You can always connect with Wishdesk web designers to make a new, appealing and accessible Contact Us web page!


Don't miss out on our future blog posts


Check out our Privacy Policy for more information.

Join our newsletter to get blog updates straight to your inbox.


Don't miss out on our future blog posts


Check out our Privacy Policy for more information.