People often pour all their energy into developing beautiful, responsive pages for their websites—but the way visitors actually experience these individual pages is more often determined by the overall organization of the website. If your website is poorly organized, the effort you put into making your site pop goes down the drain. 

Organization is the glue that holds the marketing site together. Some visitors head to your site specifically to purchase your product, while others stumble across it by accident. By aligning the organizational strategy of your marketing site with the benefits and must-have features of your product, you cast a wide net, turning each piece of your website into a touchpoint for the full range of potential customers. 

In collaboration with UserTesting.com, we analyzed the website structure of 30 different SaaS companies. We looked at the organizational techniques of a broad spectrum of companies, from industry titans with multiple products and services on offer like Salesforce and HubSpot, to ones that excel in a single area, like Buffer and Trello. 

(For more on our methodology, go here.) 

By closely monitoring 1,800 minutes of user interactions during the testing experience, we were able to parse out the user journey across each website, from homepage, to product page, to pricing page, and finally, to sign up.(to get three free UserTesting videos use code "SaaSDNA" at UserTesting.com).

The Anatomy of a SaaS Marketing Site's Organization

SaaS marketing sites have adopted an assortment of shared organizational techniques. The ones we studied included a mix of the following:

• 93% of sites included a navigation toolbar at the top of the site
• 46% of sites use a fold-out navigation toolbar to display more information
• The median number of items per navigation toolbar was 5.
• 26% of sites link to case studies
• 33% list number of customers/users
• 20% include a receive demo CTA

Even though we surveyed a wide range of SaaS companies—from customer relationship management (CRM), social media marketing, analytics, social media marketing, help desk, and more—industry wasn’t a factor in organization. 

We tested the overall cohesiveness of a marketing site along two axes: ease of navigation, and clarity of information of the site. The first determined how well users were able to navigate each site, and the second evaluated how well that information was actually processed.

Navigation

Navigation is one of the most important aspects of your marketing site. It’s how users interface with your site—and you—for the first time. If users struggle to get around your site, they'll lose confidence in your company and your product. Create an intuitive, seamless experience for users, and not only will they be able to find the information they need, but they’re far more likely to take action on it.

To test the overall navigation of the marketing site, we asked users to do two things:

• Find the information necessary to choose the best product or service for you.
• Spend 3-5 minutes using the website any way you like.

Navigation is one of the most crucial aspects of your marketing site in terms of converting users into paid customers, and it needs to be easily facilitated by the organization of your overall website. The first question tests how easily users are able to make this jump, while the second allows us to trace the overall ease of navigation of the marketing site.

Find the information necessary to choose the best product or service for you.

After spending 2-4 minutes on the homepage, users were then asked to think aloud as they searched for the product, service, or plan, that best suited their needs, and then rate how easy this task was on a scale of 1-5  [1 = Very Difficult, 5 = Very Easy].

Highly-rated example: Mailchimp

MailChimp’s sleek, intuitively-designed website made it easy for users to navigate and find everything they were looking for. On the homepage, an autoplaying and looping screencast of a customized email campaign quickly gave users a sense of MailChimp’s product. The navigation toolbar created a seamless continuity  in users’ experience of the marketing site. They found it straightforward to navigate from the homepage, to the features page, to the pricing page. 

On these pages, information is always organized logically. On the features page, for example, features are arranged by complexity. Users start with MailChimp’s design templates and functionality, before scrolling down to developer tools, like API documentation. 

MailChimp’s pricing page is prominently displayed as the second option on the navigation bar, rather than being buried somewhere inside or at the bottom of the site. Asked to find the product or plan for their needs, users were able to smoothly transition from browsing features to finding the best plan for them.

Navigation is one of the ways users gained insight into product UX, and they strongly associated the layout of  MailChimp’s site with what they imagined the product’s actual interface to look like. They described MailChimp’s product as “simple,” “easy,” and “useful”—without actually experiencing the product. 

Users left the marketing site with an impressive overview of various benefits of using MailChimp, from Google Analytics integration, to automation capabilities, to customizable email design templates. The key to MailChimp’s marketing site is it packs in a whole lot of information, but presents it in easily digestible packets that users were able to browse through seamlessly.

Quotes from the responses:

• "It’s very easy to use and navigate. When you have so many things going on, it’s important that your email marketing or email campaign platform is very easy to use, and you don’t have to spend a lot of time trying to figure out where to find certain features. MailChimp makes it really easy, it’s not all over the place. Usually, platforms are all over the place and hard to navigate."
• "This was much more simple to find.You can see the pricing tab right from the beginning, and which category you fit into best."
• "I like the fact that when I’m looking for pricing or the different packages, it's actually not hidden somewhere on the website."
• "The user interface is pretty easy and simple to teach. The interface is simple, with different levels of knowledge for users."

Lower-rated example: Buffer

Buffer’s website posed an interesting problem for user navigation, because it didn’t actually have a navigation toolbar. Instead, users were greeted with the company’s tagline on the homepage, and a blue free trial call-to-action—one of the only navigation options immediately available. Two users went ahead and signed up for the free trial, which gave them a detailed sense of Buffer’s product by running through basic onboarding—connecting to a social media account, and scheduling a post. 

The issue was that when it came to learning more about the product, most of the users were left lost, unable to navigate outside of Buffer’s logged-in web app. They had a difficult time locating actual pricing and plan information, which on the marketing site was presented only through a small floating banner at the bottom of the site: “Are you using social media as a business? Try Buffer for business.” 

When asked to find more information about Buffer’s product or a service, two of the users completely overlooked the banner, and struggled to find how they would pay for the product. Once users reached the pricing page, Buffer’s product, features, and customer testimonials were all nicely spread out and easy to understand—the difficulty was getting there in the first place.

The problem was one of continuity. Because Buffer’s marketing site eschews a navigation bar, users lacked a common frame of reference while jumping between the home page, web app, and pricing. While they appreciated Buffer’s product, they were frustrated and turned off by the site’s navigation options—or lack thereof. One user even repeatedly clicked on Buffer’s logo, mistaking it for a sandwich menu button. 

Buffer’s website tries to drive user activity into a linear flow—get them inside the product as quickly as possible, and trigger an aha! moment. However, users wanted to be able to explore the site on their own, and were frustrated by their inability to do so. Unable to learn more about Buffer, users felt forced into signing up for the free trial.

Quotes from the responses:

• "Okay so, let’s see, I'm going to try to see if there's a new thing else on the homepage I can click on besides this button and it doesn't look like it, except for the sign in but I don't have an account yet. So I'm going to click this blue button."
• "I think it was difficult because it was confusing how it works."
• "I don’t see anywhere I can learn that information here on the page."
• "I think a video on the homepage would be helpful as far as just explain a little bit more of the service, to see it in action here before you start your free trial."

Key Takeaways

• Keep your navigation easy to use and clean. Remove unnecessary items.
• Simplicity is good, but not at the expense of functionality. Users like to explore for more information—even if only to browse over it briefly. Allow users to get to know you through your marketing site, not only through product features and plan details, but “About Us” or “Culture” pages.
• Continuity is the backbone of your marketing site. Make sure users don’t get lost. When evaluating your marketing site, you need to look closely and holistically at user experience, which needs to be unified across the homepage, pricing page, and free trial. Think about your marketing site as a funnel in and of itself, and carefully plot out user journeys.
• What seems intuitive to you won’t necessarily prove the case with your users. Make it easy to navigate your site via actions like scrolling by including a button, or a symbol. Emphasize the most important functions of your marketing site.

When users know where they're going on your marketing site they're saying:

When users are lost on your marketing site they're saying: 

Information on your marketing site

The clarity of information on your marketing site is crucial to its organizational effectiveness. Users quickly browse and skim your site, and as they do it’s vital that you organize information so that they’re able to both absorb it and dive deeper as needed. 

In order to get through to users, the hierarchy of information is key. Just as important as the actual words on your website, is the way that they’re presented—without structure, content becomes meaningless. At the end of the user testing experience, we asked users to do the following tasks:

• Describe what this company does in 1 sentence.
• How confident are you that your description of what this company does is accurate?

These questions gauge how well users processed and retained information after spending time on each marketing site. If a user is highly confident that their description of the company is accurate, but completely misses the mark in the 1 sentence summary, the organization of your site isn’t working properly. 

If they’re able to concisely sum up your product, however, it shows that you’ve accomplished one of the hardest things in marketing—capture someone’s attention, and ingrain your message.

Describe what this company is doing in 1 sentence

After browsing the entire marketing site, users were asked to provide one-sentence summaries of each company. They were then asked to rate how confident they were in these summaries on a scale of 1-5 [Rating Scale: Not at all confident to Extremely Confident].

Highly-rated example: Shopify

Shopify’s website does a great job of communicating information clearly and concisely. Users were extremely confident in their understanding of what the company does—providing e-commerce solutions for small businesses. While Shopify offers multiple products on its marketing site, users clearly understood what the company does throughout the UserTesting.com experience. 

The success of Shopify’s marketing site lies in the way it organizes information—which is organized around the point of sale: “Sell online,” or “Sell in person.” This structure is customer-centric, rather than product centric. Rather than overwhelming users with a million different features, features are structured around the company’s main value proposition: “sell anywhere.” 

Because of this, users were able go deeper and deeper into the aspects of Shopify’s product that they gravitated towards, whether it was setting up an online store, or the ability to sell via mobile. One user even pointed to Shopify’s mobile integration, and the ability to set up event based shopping in his summary—retaining a detailed understanding of what Shopify offers. 

Arrow tooltips made it easy to switch between different features of Shopify’s platform—along with screenshots of the product—all on the same product page.  By the time users got to the comprehensive features page, with 64 different features listed split into 9 different categories, they already had the background knowledge to pick out what they were looking for. 

Even though Shopify offers multiple products and services, ranging from an e-commerce store to a physical point of sale,  users walked away from the site with a specific understanding of the company, based on the aspects they found most compelling.

Quotes from the responses:

• "Provides an integrated online store resource or mobile shop setup for events and retail."
• "This company provides a website space that allows for small businesses to interact with customers through an online venue."
• "Helps you build your own website."

Lower-rated example: Salesforce

When a company’s marketing site includes multiple services, it’s difficult for users to understand what the company does overall, and even harder to concisely sum the company up. Salesforce presents a particularly striking example of this. While users were able to highlight specific features or products, they struggled to provide a larger umbrella description of what the company does.   

One user rated his understanding of the website with a 4, but said of the site, “I think it’s basically an analytics company that helps you manage your information.”Another user clicked on the products tab, selected the “App Cloud” service, and left the marketing site thinking that Salesforce helps startups build apps.

The sheer quantity of different services product offerings on Salesforce’s marketing site left users feeling overwhelmed and confused. Although the complexity of Salesforce’s products necessitates a weightier marketing site, users didn’t feel clearly guided in one direction or another. They were paralyzed by the number of choices available, and as a result, they more or less randomly chose between the different options. 

Part of the problem was that some users weren’t familiar with terms like “CRM” or “Customer Success” which left them unable to piece together a common strand throughout the company’s marketing site. Further, this feature-driven marketing copy prevented users from finding the product or service that would actually serve their needs. 

Interestingly, while multiple users felt overwhelmed by the amount of information on Salesforce’s website, they also described Salesforce’s platform as comprehensive—some felt that given more time, they could come out with a clearer understanding of the company.

Quotes from the responses:

• "They help businesses with the analytics and tracking of data and sales."
• "This company helps businesses with many services to get the app online and social."
• "Provides an umbrella of core business functions that would otherwise be overwhelming to create for one's own business environment."

Key Takeaways for clarifying copy

• It’s easy for users to feel overwhelmed or underwhelmed. The key to an effective marketing site is how deftly walk the balance between the two. Always aim towards providing utility and value, while cutting down on marketing and advertising fluff.
• Present information prioritized by order of importance. Users like simple design, but prefer it when important or particularly useful information is readily visible, without having to navigate too much.
• Repetition of information attracts attention and encourages interaction. Users don’t read your marketing site—they skim it. Make sure to reiterate the core information you want to communicate across your marketing site in a variety of forms and visual aids.
• When your marketing site offers multiple products or services, eliminate choice whenever possible. It’s always important to guide users throughout your site, but this is especially the case when you offer a variety of different services. Use benefit-driven language to maximize impact.

When users get your site, they're saying: 

When users don't get your site, they're saying: 

Conclusion & Main Takeaways

The organizational structure of a SaaS marketing site depends on the nature of your product. As a result, the categories for organization aren’t set in stone, but operate on a range—no one structure is better than the other. It’s important that you choose organizational structure according to how you want users to interact with your site, and tailor it carefully to how your product and brand are best showcased. 

From the SaaS marketing sites we analyzed, we distilled organization into 3 basic categories based on how they direct user interaction.

Linear Organization

Companies: Buffer, Trello, Slack 

With linear organization, the website directs users to a very specific trajectory, typically along the lines of homepage —> product tour —> free trial. Sites organized linearly often hide their navigation bars at the bottom of the homepage, or eschew it completely. When you have a relatively simple, straightforward product, linear organization is effective at driving engagement and action from your marketing site.   

These sites are effective at driving users towards specific information and actions by limiting the range of navigational options available to them. The tradeoff is that users aren’t able to browse the site at their own pace, and they don’t always proceed in the direction laid out for them. They’re often wary of signing up for a free trial, especially when required to enter in their emails or connect a social account, and even more reluctant to do so when they can’t find the information they’re looking for.

Recommendations:

• What you think is intuitive often isn’t the case for your users. Make sure you emphasize in-page navigation options clearly, with the use of buttons and symbols to direct the user experience—for example, to scroll down for more information. When your website is organized linearly, it contains a lot less—so each individual piece of the site becomes much more important.
• With linear organization, you direct users toward signing up for a free trial as quickly as possible. It’s therefore important to design the onboarding flow of your free trial to replace elements of the more traditional marketing site, like the product tour, so they don’t feel like they’re missing any information.
• It’s difficult to predict user interaction with your site, no matter how easy and intuitive it might seem. Make sure to test it. If going minimal and linear is meant to achieve a certain result, check to see whether that result is being achieved—and don’t be afraid to add more information back if you find that you’ve gone too minimal.

Wheel Organization

Companies: Basecamp, Campaign Monitor, Shopify, Qualaroo, Zapier, Hightail, Insightly, Localytics, MailChimp,  Mixpanel, Pingdom, ZenPayroll, Qualaroo, Hootsuite, Help Scout, Geckoboard, Chartbeat 

Wheel organization is centered around the homepage of a website. These sites are connected by a consistent navigation bar across the site with 4-6 main navigation options, typically a variation on product, pricing, resources and blog. These sites are good at directing users in multilinear flows, whether it’s exploring product features or customer testimonials. 

These different directions tend to operate with little overlap. The information is presented simply on the pages, and there isn’t a rabbit hole of ever expanding pages and options to go—rather, they’re tied back together by the homepage. 

Recommendations:

• Presenting users with too many options detracts from the efficacy of wheel organization. Leave your navigation bar uncluttered, and try to use slides and expanding “learn more” CTAs rather than linking to new pages.
• The homepage is the anchor that holds the wheel together. Make sure it clearly communicates the value proposition of your product and makes the CTA easy to act upon.
• When using wheel organization, it’s important to focus on the most vital information, and avoid the temptation to over-market and over-sell your product.  

Complex Heirarchy Organization

Companies: Salesforce, HubSpot, Box, New Relic, Optimizely, Uservoice, Intercom, Base, Wistia, Zendesk

A complex hierarchy is characterized by more depth than other models of organization. These sites provide users with many different options with fold-out navigation bars presenting users with many different options. Navigation on these sites is often nonlinear and provides users with a lot of choice in terms of where they go, from exploring the features of one specific product, to speaking to a sales rep, to signing up for a free trial. 

Companies employ complex hierarchies when they need to communicate a large quantity of information, and have various desired outcomes for users browsing the marketing site. 

Recommendations:

• A complex hierarchy can often be confusing to users. Make sure that they know where they are at all times by creating continuity across the site. Use design to build a unified user experience across the site.
• Because a complex hierarchy already presents users with a lot of choice, it’s essential that you limit choice whenever possible, and cut out extra fat.
• Only choose this type of organization if you really need it—i.e. your SaaS website includes various services and products to choose from, and require the complexity of this model to explicate fully. Don’t unnecessarily bulk up your site with more pages and options to appear more professional.