Contractor Website Design

When your customers are on the internet looking for a roofing contractor, they are either in a researching mode or a buying mode. The best contractor website design will have their website set up for both types of customers.

This means, having clearly communicated information that is laid out in a way that helps the customer find what they need as quickly as possible. So we’ll go over a few of the key ways to set up your website to become the best lead generation website.

UX And Contractor Website Design

UX stands for user experience. There are quite a few things that go into the user experience on your website. From the colors to the layout of the page and the information.

Perhaps you’ve experienced this before, where you land on a page and can’t find what you’re looking for, you get frustrated and leave the site. That's the type of contractor website design we’re trying to avoid.

Clear Communication

Within the first few seconds of someone getting to your website, they need to know who you are, what type of roof work you do (flat, shingle, commercial or residential), what locations you work in and how to contact you.

What they need to know

Who you are: “ABC Roofing.”
What you do: “Residential roof repair and replacement.”
Where you work: “Serving Baltimore & DC Metro area.”
How to contact you: “Fill out a form, schedule an estimate, call this number.”

Contact Information

You need to make it as easy as possible for your customers to contact you. The picture above is a great example of a contractor website design. On the homepage they have five ways for someone to contact them. The contact us page, a phone number, a “get a free estimate” landing page, a form and a chat window.

They are using each method possible for contact, texting with the chat box, emailing with the form, calling with the phone number. So no matter what method the customer prefers, there is a way.

The contact information is also clearly seen the moment you land on the website. The user doesn’t have to look for it, which is exactly what you want. A customer shouldn’t have to click through to another page in order to find the contact information. Which is why you will often find the address and contact info at the bottom of websites, in the footer.

Colors And Design Of A Website

It’s important to understand how to use the design of your page to help customers navigate your site. For example, the size of your font tells the reader what to look at and read first. People naturally look at pictures before text. When we read text, we’ve been trained to read the larger text first.

In addition to this, we’ve been trained to read the page from left to right. And we’ve come to expect certain information to be laid out in certain ways on the site. For example, we assume there will be a navigation bar on the page, typically at the top.

Regarding colors, certain colors communicate certain things. Red can communicate danger, or it can be a way of grabbing our attention. So if all the text on your site is black and your buttons are in read, it clearly communicates to your customer what they can click on.

Check out the contractor website design in the picture below. Notice how your eyes naturally see certain aspects before others.

From the example above, you’ll see how the color blue is associated with the buttons for communicating, such as the form, “schedule a free estimate,” and the chat option. You’ll also notice the size of the text tells you what they want you to read first.

So creating your contractor website design must have these elements to help the customer navigate through the page quickly. Because time is everything. And you can follow these examples for each page of your website.

The Buyer's Journey

Every customer, when getting to your website, will either be in a researching phase or a buying stage. So it's important to have information for each stage of the journey.

The stages are awareness, consideration and decision. In each stage the customer is asking the following questions.

Awareness: “What’s wrong with my roof?”
Consideration: “What’s the right solution to fix the problem?”
Decisions: “Who do I hire to fix it?”

Awareness Stage

First the customer needs to figure out what is wrong with their roof. So they might call out a few contractors and do some research on the internet to educate themselves. They both say the shingles are what's wrong with the roof. One contractor says it needs to be repaired and the other says it needs to be replaced.

In this first stage, the customer will probably search things on the internet such as, “how long do shingles last?” “When should I replace my roof?”. So these are the types of content you want on your site. Both as individual pages and as options to select on other pages.

This picture below is a great example of how a roofing company is helping their customers in the awareness stage by helping them identify parts of their house and educating them on it.

This answers the first question, what's wrong with my roof. But it doesn’t answer the next question, of what's the best solution.

Consideration Stage

Now that the customer has done some research and knows the shingles are damaged, they move on to the next stage, consideration. They are asking themselves, what is the best way to fix this problem.

In this stage they could be asking, “should I repair or replace my roof?” Or, “shingle vs metal” type questions. The reason being, they know what's wrong but now they are considering all their options. Options between material and options between methods of repair.

Once they land on a solution and they want to move forward with a replacement. They are stepping into the decision stage.

Decision Stage

In the decision stage, one of the big questions is going to be deciding between companies. They need to figure out which roofing company to go with. This is where reviews, testimonials, local job photos and references come in hand.

Reviews, testimonials and so on help to build trust in your brand. When someone trusts you they are more likely to hire you. This is why you want to have this sort of content on your website, to show the customer the reviews or testimonials you have received.

The above photo is another great example of two different ways to build trust, a testimonial video and badges that communicate reputation. This company is doing a great job with their contractor website design.

Let’s Work Together

Get in touch so we can start working together.