Plumbing Website Design

Plumbing Website Design – A Helpful Guide

Some businesses come and go. The tech industry, for example, is filled with them. A company senses momentum in a particular niche and rides the wave for a few months or years before eventually fizzling out when interest and demand disappear.

Then there are staple businesses. These are companies and industries that have been around for centuries and will still be around in centuries to come.

Plumbing falls into this latter category.

Plumbing might not be a sexy industry, but it’s stable, lucrative, and necessary. And despite its “offline” business model, increasing competition and changing consumer perceptions within this space means plumbing companies have to pay attention to online presence.

And if there’s one aspect of an online presence that matters most, it’s the website.

Importance of Good Plumbing Website Design

Importance of Good Plumbing Website Design

Most people have an intuitive understanding that website design matters, but in order to take it seriously within your own business, it’s important that you dig a little deeper and attempt to understand why it matters so much.

Here are a few of the top reasons:

  • First impressions. Did you know that 94 percent of a user’s first impression of your website is design-related? Or that it only takes a visitor 50 milliseconds to form a first impression of your site’s design? What about the fact that 38 percent of people will stop engaging with your website if your layout and content are unattractive? These are real statistics that have been unearthed as a result of millions of dollars of research. And the takeaway is clear: If you want to make a good first impression, website design is the most important element.
  • Brand trust. The relationship between your brand and your customers matters – particularly in the plumbing industry where you enter into people’s homes and work on sensitive systems that could cause serious damage and other repercussions if handled improperly. Establishing trust right away is a must. This gets fleshed out in numerous ways, but is heavily influenced by branding. A well-designed website can either establish or reiterate trust between your business and your customers.
  • Conversions. Effective website design does more than just look good. It also helps guide visitors’ eyes to the appropriate places on the page. You can use design to draw attention to specific offers, calls-to-action, or clickable elements. In this sense, it’s one of your strongest tools for boosting conversions.

There are obviously dozens of other reasons good website design matters, but most of them can be placed into one of these three categories.

9 Plumbing Website Design Tips and Best Practices

9 Plumbing Website Design Tips and Best Practices

The more you peel back the layers to understand why website design matters, the more clearly you’re able to see how a new or redesigned website could benefit your plumbing business. But before going any further, you need to understand some of the effective design principles and best practices between high-ranking and high-converting plumbing websites.

Here are a few powerful tips:

1. Keep it Simple

Good web design is simple, clean, minimalist, and frictionless. It’s about eliminating all distraction so that a visitor’s focus goes to the content and elements that matter most.

Study any effective website inside the plumbing industry (or outside) and you’ll see plenty of negative space (also known as white space).

The power of negative space is found in what it’s not. By providing a clean backdrop, white space fees up visual interest and attention to focus in on what really matters.

For best results, surround the most important elements in your design with negative space. Having said that, you don’t want the website to look boring. Other unique and color aesthetic elements can pick up the visual slack and draw attention to the page.

In other words, your background might be a gradient white, while the call-to-action button is bright red. It’s this sort of visual contrast that makes a big statement.

2. Use Visual Hierarchy

Visual hierarchy is the arrangement, color, size, and contrast of all the visual elements on a page. It refers to the assortment, order, and relative prominence as seen by human visitors.

There are certain laws of visual hierarchy that rule good website design.

Low visual prominence items tend to be small and textual. They’re located at the bottom of the page, have low contrast, and are more closely bunched together.

HIgh visual prominence items are usually large and visual. They’re positioned towards the top of the page, have strong contrast, and are surrounded by negative space.

3. Prioritize Above-the-Fold Design

So much of web design is still shaped by other forms of content design – including its cousin from decades ago: the newspaper. And if there’s one design element that we still use all these years later, it’s the notion of the “the fold.”

With a newspaper, the fold is the horizontal crease down the middle. Once creased, you’re left with half of the newspaper above the fold and half of the paper below the fold.

In newspaper design, this fold is a clear line of demarcation. Anything above the fold is going to attract eyeballs. Anything below the fold will see a dropoff in exposure.

The same is true in website design. Anything above the fold – which is the upper portion of the design that is seen without having to scroll down – gets exponentially more visibility than the portion of the page that’s below the fold.

In light of this, there’s a temptation to cram as much value as you can at the top of every page. But you have to balance the need for simplicity. A high-resolution graphic with a clear value statement and simple CTA is the best approach.

4. Sprinkle Calls-to-Action Throughout

While the above-the-fold content gets more visibility, research shows that below-the-fold content actually gets more engagement.

How could this be? And what does it mean?

Well, in the simplest terms, people are more likely to see what’s above the fold (since it’s the portion of the page that’s automatically populated when a visitor arrives). But most visitors aren’t going to click on a CTA or link without first learning more.

So what do they do? They scroll down and read the other content.

Scroll Depth

Research from Chartbeat – which analyzed 25 million visits – found that engagement peaks just below the fold.

So the best rule of thumb is to sprinkle CTAs throughout the page – including them at the top, just below the fold, and at several other locations throughout the remainder of the page.

5. Limit Tabs and Accordions

Did you know that upwards of 76 percent of website visitors are “scanners.” In other words, they aren’t reading your content word from word in some logical progression. They scan your page and look for the elements that stick out.

If you have a bunch of content hidden behind tabs, accordions, and elements that don’t reveal until they’re clicked or hovered over, you’re stifling engagement.

There’s a time and place for tabs, but your best information should be visible at all times.

6. Use Pictures of People

Engagement rates, click through rates, and conversion rates all see huge lift when you use real pictures of people instead of animations, stock photos, or abstract graphics.

Stock photos might be the norm in this industry, but you can do better. Pay a professional photographer a few hundred bucks to follow you around for half a day and take some pictures. Use these to populate your website design and you’ll instantly garner credibility and trust.

7. Leverage Video the Right Way

Video is something every plumbing company should include in their website design. Just make sure you’re using it the right way.

Feel free to incorporate video at the top of your homepage and on service pages, but give visitors control over what they watch. (Autoplay videos – particularly videos that autoplay with sound – are seen as intrusive and frustrating.)

8. Keep Forms Simple

Forms are an easy way to collect leads, schedule appointments, or even book service calls. But don’t make the mistake of asking for too much information.

A good opt-in or submission form asks for the bare minimum information. If you can get away with nothing more than a first name and email address, use a two-field form. If you need other information, be discerning in what you ask for. A phone number or mailing address can be a major turnoff (depending on the purpose of the form).

9. Ensure Responsive Design

We live in a world where people quickly switch between devices. While many people still access the internet via desktop browsers, smartphones and tablets are popular too.

Use a responsive design to make sure your web design effortlessly scales down to the proper screen size without hurting the user experience. This level of consistency strengthens trust in your brand.

How to Build a Plumbing Website

Now comes the practical part: Building a plumbing website.

Here are some of your options:

  • DIY from scratch. This option is not for most plumbers. But if you happen to have a background in coding or the free time in your schedule to learn how to develop and design websites, it’s something you can try. It requires a lot of patience and creativity to execute, but allows full control over every element on your site. (It’s also a whole lot easier to make changes and revisions at a later date when you’re the one who architected the website in the first place.)
  • DIY with a builder. If you want control over the process, but don’t have any coding or design skills, you can use a website builder. Every major website host now has a drag and drop website builder. Some are more intuitive and user-friendly than others, however. And if you’ve never used one before, you might find them finicky and cumbersome.
  • Purchase a theme. This option sort of goes hand in hand with the previous one. You can actually purchase a website theme from a designer and plug it into your website. Then all you have to do is go in and swap out the different text fields and images with your own content and graphics. This option is great if you’re looking for a simple copy and paste approach, but you’ll find it difficult to make major changes without any knowledge of how to code.
  • Hire a freelance designer. The website design industry has undergone significant democratization over the past decade. There are now freelance design marketplaces online where you can find designers with varying levels of experience across a wide range of prices. The benefit of this option is that you can communicate directly with one person. This streamlines the process and gives you control, without requiring a ton of your own time.
  • Hire a web design service. Finally, if you want the most professional, streamlined, hands-off process possible, you can hire a web design service. This gives you access to the best web designers at a predictable cost and with less risk than hiring an unknown freelancer.

As you can see, there are an abundance of options to choose from. And if it helps you to wrap your brain around the “how-to” portion of building a plumbing website, you can just think of it in terms of DIY vs. DFY (done for you).

DIY options include any method that requires your input – i.e. the first three options on this list – whereas DFY methods are completely hands – i.e. the latter two options.

If you have more time than you do money, DIY is a reasonable choice. If you have more money than time, a DFY service is a superior approach.

Real World Plumbing Website Design Examples

Okay, enough theory.

Let’s get granular by examining a few real world plumbing websites.

This will give us some visual examples and illustrations to flesh out the theoretical tips and best practices previously highlighted.

Example #1: AJ Buerkle HVAC

AJ Buerkle HVAC Website Design

This website is clean, simple, and easy to navigate.

Notice the use of social proof on the home page (including trust badges and a clear value statement).

AJ Buerkle HVAC Plumbing Web Design

If you scroll down just below the fold, you get a CTA (which is a best practice based on the aforementioned Chartbeat study.

Call-To-Action Website Design

Even the navigation menu is clean. (There are no dropdown menus or accordions with these tabs. One click takes you straight to the page.)

Plumbing Website Design Navigation

Example #2: The Pink Plumber

The Pink Plumber Website Design

This website instantly stands out because of its use of negative space, simple graphics, and a clear value statement above the fold.

While the navigation menu could use a little help, the simplicity of the content throughout the page is something that other plumbers could learn from and replicate.

The Pink Plumber Website Navigation

Example #3: Jake The Plumber

Jack The Plumber Website Design

This website is far from perfect. (In fact, in many ways it has a lot of web design mistakes.) But it’s also highly effective.

Rather than using the generic stock photos that you see on so many plumbing websites, they’ve taken the time to integrate real pictures of their team. This builds instant trust.

Jack The Plumber Website Images

Build Your Next Website With DEV.co

Regardless of which direction you choose to take with your plumbing website, we would love to be a resource for you. Whether you need a developer or designer to assist you, someone to handle things from start to finish, or a consultant to bounce ideas off, we’re here to help.

Contact us today to learn more about our design and development services!

Ryan is the VP of Operations for DEV.co. He brings over a decade of experience in managing custom website and software development projects for clients small and large, managing internal and external teams on meeting and exceeding client expectations--delivering projects on-time and within budget requirements. Ryan is based in El Paso, Texas.
Connect with Ryan on Linkedin.
Ryan Nead