What makes for a good website? You know, the one that immediately impresses instead of confuses. The one that you find yourself 10 pages deep instead of leaving after the 1st page. We’re currently redesigning our own site (www.17terawatts.com) and asking ourselves the same question.
Your website is an essential layer in your solar business’s software stack, a critical first link between your company and your customers. However, websites are continually evolving with new designs and more functionality, and your customers are evolving right along with them. Fortunately, there are fundamental rules to follow when designing a website that will always be true. In this post, we’ll break down these fundamental rules and give you practical tips on how to design an effective website for your solar business.
Web design: The two design principles
Our customers and readers of our blog know that we like to frame a lot of our work in terms of design principles. For web design, we follow two guiding design principles:
Don't make them think.
Answer their questions.
The first “Don’t make them think” applies to how information is organized on your website. The second “Answer their questions” applies to what information to include. Both are important to create for your customer a state of “flow” where they easily and naturally consume the right information and take the particular action you want them to take.
Design principle 1: Don't make them think
This first principle is based on the behavioral science framework developed by Daniel Kahneman, a Nobel Prize winning economist. He found that there are two parts to the brain: the first is the fact-acting part that relies on intuition, and the second is the slower-acting thinking part. Unfortunately, the thinking part of the brain is lazy. Most times, we leave many decisions and actions up to the intuitive part of our brains.
And this is how most of your customers are browsing the web and browsing your website. Making them think slows them down, breaking the state of flow and opening up the possibility that they get confused.
Here are 10 concrete tips to follow:
Tip 1: Follow existing design conventions
Conventions are important for your website because they require no explanation or thought. For example:
The company logo is in the top left corner and hyperlinks to the homepage.
The navigation is across the top on desktop or accessed via the hamburger menu on mobile.
There are standard icons to play a video, perform a search, share to social media, or make an appointment (Fig. 1).
If you do stray from convention, make sure the new design is clear, self-explanatory and certain that it will add value.
Tip 2: Design for billboards
We don’t read webpages, we scan them, looking for the first thing we find interesting. It is important therefore to create a visual hierarchy where the more important something is, the more prominent it is (Fig. 2).
Tip 3: Keep it clean, Limit your text
A webpage that is too busy or unorganized is like a teenager’s room, you don’t want to stay for long. Furthermore, paragraphs full of text take up valuable real-estate, especially when they’re placed on one of the main pages. Instead, use images, subheadings, and just a few lines of introductory text that are then linked to a separate page with more detailed information (Fig. 3).
Tip 4: Use terms that users understand
Certain terms might be commonly used in our industry, but does your customer, who most likely falls in the category of mass consumer and not early adopter, know what that means? For example, what do you think is more intuitive to a residential customer? A navigation link that reads “Residential Solar” or “For Homeowners.”
Tip 5: Use CTAs sparingly
There are a number of things you might want your customer to do while they’re on your website - schedule an appointment, download a resource, visit another page, etc. Prioritize this list and limit your CTA buttons to the most important. Having multiple CTAs can confuse the customer and diminish the importance of your most important action you want your customer to take. If you do have two CTAs on a single screen, consider having a primary button design and a secondary button design to create the right visual hierarchy of the two CTAs (Fig. 4).
Design principle 2: Answer their questions
The main reason customers come to your website is to get answers to their questions. Therefore, you want to use the site to answer their questions and if done effectively, lead them to the next stage of the customer journey. If not done effectively, your customers will simply bail.
The best way to approach this is to consider what questions your customers are generally asking at each step of the solar customer journey.
Tip 6: Include a blog & focus on long tail keywords
Step 1: Awareness - In this step, customers are becoming aware of the benefits of solar and becoming aware of your company. Questions during this step include:
- How does solar work?
- Who can install solar for me?
Since most of this is done by Googling certain questions, incorporating a blog is a great way to help potential customers discover your company. A blog should always be combined with SEO to maximize its effectiveness . An extra insider tip is to consider blog topics to attract what are known as “long tail keyword searches.”
Tip 7: Add a solar calculator & video testimonial
Step 2: Evaluation - In this step, customers are trying to rationalize the decision to go solar and in the context of multiple providers, which company to engage. Questions during this step include:
- How much will it cost?
- What are my options?
- Can I trust this company?
Your site should include a solar calculator, a section on the equipment you install, and testimonials. A video testimonial is worth 10x a written one. Not only do people trust video testimonials more (they can see it's a real person who really said these things!), but video content will also keep customers on your site longer, which can help your SEO and encourage them to continue to get to know your company. That being said, if you only have written content, showcase your solar customer reviews. Written social proof is better than not having social proof at all.
Tip 8: Provide a personalized customer portal
Step 3: Decision - In this step, your salesperson is closing the deal, providing direct one on one communication. However questions will still arise, and primarily revolve around “What’s Next?” Your site should include a customer portal that lays out exactly what your customer purchased and what to expect throughout the process.
Tip 9: Provide a personalized project tracker
Step 4: Installation - In this step, customers are in the backseat, being taken on the ups and downs of the solarcoaster. They’re mainly wondering, “What’s the status of my project?” Inside the customer portal, include a project tracker. This should be connected to your operation team's solar project management tool, so that all updates to the project tracker are automated and don't require additional work. If Domino’s can provide a pizza tracker, you should provide a solar project tracker.
Tip 10: Provide branded monitoring & marketing updates
Step 5: Service & follow on - Your job might be done, but for the customer, their journey is just starting. They’ll be wondering:
Is my system working?
What about a battery or an EV charger?
Provide your customer a way to monitor their production, how much they’re saving, and preferably all under your company’s branding (You won’t be surprised how many people think SolarEdge or Enphase is their solar company, but that’s for another blog post.) And use your blog to educate your customers about the latest energy products and services that might be most pertinent to them.
Conclusion
You will have to refine or redesign your website every so often to keep up with the advances and latest trends in web design. However, if you follow the 2 guiding principles (1) Don’t make them think and (2) Answer their questions, you’ll be afforded some slack.
One final bonus tip: Upwork is a great cost-effective place to find talented designers to help you with your website.
.svg)
.webp)
.webp)
.webp)
.webp)