1. Allow visitors to scroll over your homepage.
There was a time when we were hesitant to make our web developer, especially your homepage, too long. This was done to avoid consumers not scrolling, so people were compelled to cram as much information as they could into the most common screen size used to view their website.
Those days, however, are long gone. According to a 2018 study by the Nielsen Norman Group, the first two screenfuls of a website page, up to 2160px horizontally, accounted for 74% of total viewing time. As a result, there’s no reason to be hesitant about designing a more robust below-the-fold experience.
Make the most of the space on your homepage.
Three to five parts that help route new and returning users to the essential elements of your site are a solid rule of thumb.
What should the titles of these parts be? This list may go on forever, but here’s a quick rundown of some of the most important elements:
- Proposition of value
- Video for the introduction
- a list of services
- Specifications of the product
- Concerning your business
- Success stories/case studies
Many of these points are well-represented by Zenefits.
Their homepage provides an interactive experience that takes you through a quick description of the tool, platform features, testimonials, and a call to action for a demo.
Users will have a good understanding of what Zenefits can achieve for them and how clients have enjoyed using the platform by the time they reach the bottom of the page.
If you want to learn more about the architecture of the best site, check out this fantastic infographic or this in-depth post that reveals more critical homepage aspects not included here.
2. Don’t be terrified of the blank page.
Whitespace is an important design element that serves to break up the page and make it more readable. White space, often known as “negative space,” refers to the empty spaces around objects on a page that are devoid of content or visual features.
Whitespace is also crucial in the design process and the placement of website elements. Less whitespace can dictate which parts are supposed to be related to one another owing to their proximity, while more whitespace can dictate which portions are independent and direct the eye.
Vidyard has always done a fantastic job with this. Their portions are always well-spaced, allowing them to sit comfortably within your viewport without being crowded by sections above or below.
This allows consumers to focus on individual parts of a website page and instantly see where each portion begins and ends. This can be quite useful for directing your user’s attention to vital content like a call-to-action or value proposition.
Check out these all-stars for more instances of websites that are doing this well to help you with your upgrades.
3. You must optimize your website for mobile devices.
It’s more important than ever to optimize your site for mobile devices.
If you didn’t know, 80 percent of internet users own a smartphone, and according to Google, “61 percent of consumers are unlikely to return to a mobile site they had problems accessing, and 40% visit a competitor’s site instead.”
If I were you, I’d be a little concerned.
But it’s much more than just being visually responsive. Customizing your website to meet the interests and desires of your visitors is a must. Consider why someone might visit my site on a mobile device. What would they be looking for? Is my background allowing them to execute those things with ease right now?
Using the website of Chili’s as an example, you can see how the desktop and mobile versions are very similar. As a result, when consumers switch back and forth between the two for orders over time, there are some parallels that make utilizing the website comfortable.
They also make it simple to do what their website is all about: ordering food. On the mobile website, the button for this is constantly visible, so you can order whenever you’re ready without having to navigate to another page.
If your website isn’t mobile-friendly, take a look at some of these amazing mobile sites to see how they’ve made their consumers’ mobile experiences as easy as possible.
4. Make it simple to find pricing.
If this circumstance sounds familiar to you, please let me know.
You’re looking for a new SaaS solution to solve a problem you’re facing on the internet. Let’s use a project management tool as an example for this story.
You’ve spent the last hour evaluating a few pieces of software and believe you’ve found one that seems promising. With that in mind, you begin your search for pricing.
So you go to the pricing page and find yourself on a page that looks like this:
You’re probably a little frustrated at this point. You can even ask if this indicates that it’s too costly. What exactly are they trying to conceal? Why make the effort to call and inquire?
So you’ve decided to quit the site and investigate the competition.
If your site follows a similar pattern, or if it doesn’t have a pricing page at all, your users will think the same way.
I can’t emphasize enough how critical it is to include price on your website. It “allows visitors to complete their research (as any modern customer desires) and, in the end, qualify or disqualify themselves, avoiding your sales team from spending time on someone who isn’t a good match.”
You could be concerned that competitors would simply try to undercut you or that your price is too complex to display on your website, but in truth, you should be more concerned with properly educating your prospects on why your pricing is the way it is and the value you provide.
If someone is only seeking for the lowest possible price, they are most likely not a good fit for you.
With this in mind, let’s take a look at a website that does a good job of making price stand out. Trello makes it simple for users to determine which pricing tier they belong in and how much it will cost them.
The features included in each tier are listed below each tier in the pricing chart, so comparing them is as easy as reading left to right. The use of green buttons in the latter two tiers also helps to draw attention to the more desirable selections.
Take a look at these sure-fire strategies to help you get started on a solid pricing strategy.
Create a self-selection experience for your audience.
As someone who gets overwhelmed while buying on e-commerce sites, I can’t tell you how relieved I am when I discover tools that can assist me in selecting the correct items for me.
Self-selection tools guide users through a series of questions in order to arrive at a specified sort of outcome. These outcomes could be a personalized quote, a product, or an answer to a high-level query (for example, ‘What is my personality type?’).
This type of tool can make it much easier for consumers to figure out what the greatest items or services are for them without having to scour your website for the information.
Amazon’s product recommendation selection, located beneath specific items on the site, is my favorite, seemingly simple tool. When you give something a thumbs up or down, the tool automatically switches to other things in the feed that it thinks are closer to what you’re looking for.
Needless to say, this simplified my search for the ideal vase!
The product configurator for the best range oven from IMPACT client Yale Appliance is a less scary recommendation tool to look out. This essentially merely filters through products based on the inputs you choose.
Users can decide which options work best for their situation using precise iconography, resulting in the best product being given to them. Users will save numerous hours of scouring the website and the hassle of phoning a sales representative as a result of this.
Additionally, the faster you deliver your prospects to what they’re looking for, the more likely they are to buy it.
While this is likely to be a later project, it is a valuable tool that can help your company stand out from the competition and provide a unique experience in your industry.
5. Iterate and test
Your website should not be static, but rather a live, dynamic part of your business. It’s possible that there’s always opportunity for improvement. Improving key aspects of your website can help you increase conversions, time on page, and pages per session, but figuring out which solution would work best for you is the difficult part.
This is when A/B testing comes into play. When you test two different versions of a page against each other, you can see if certain parts are causing problems for your users.
Your pages may be operating effectively in some circumstances, but they may include obsolete information. A/B testing the page’s content can reveal how big of an impact it has on session duration or conversions.
In other circumstances, you might wish to check to see if design changes have an impact on a page’s performance. Simple adjustments like button colors, headers, and copy revisions can have a huge impact on conversion rates.
All of that said, you may use tools to generate A/B testing, multivariate tests, or even heat maps to see what consumers are doing instead of taking a set-it-and-forget-it approach, especially if you don’t know what to alter.
Each test can give a wealth of information about why users interact with sites in specific ways.
From here, I’d keep an eye on these tests and tools on a weekly or bi-weekly basis to observe how the adjustments you’ve made are influencing the performance of your page. Checking often also allows you to make changes sooner rather than later if things start to go wrong.
I propose using heat mapping tools like Lucky Orange or Hotjar, as well as A/B testing programs like VWO, Omniconvert, or A/B Tasty.