During any website redesign—especially one founded on the Growth-Driven Design approach that’s characterized by rapid, monthly or bi-monthly sprint cycles of user experience improvements based on buyer data—it can be hard to figure out what to prioritize. With so many site elements and factors to take into consideration, it can be a daunting task. The Website Hierarchy of Needs provides a framework to prioritize website improvements and build a roadmap for long term success in leveraging your site as an effective growth tool for your business.
You might be thinking that a specific order of site improvements is the best way to go. If you are, you’re already keying in on the logic and structure needed to make any redesign a success.
To quote Stephen Bradley of Smashing Magazine:
Based on Maslow’s hierarchy of needs, the idea of a design hierarchy of needs rests on the assumption that in order to be successful, a design must meet basic needs before it can satisfy higher-level needs.”
So, yes, there is a hierarchy of web-design needs, but this is fraught with some controversy because of a contradictory belief that some design fixes don’t have to wait for others before they can be implemented. In other words, some lower-level concerns can be addressed at the same time that more higher-level ones are being implemented.
As you’ll read, there can be something of a gray area in deciding what really goes where in the design hierarchy.
We can’t stress enough how it’s smart to follow a design hierarchy during sprint-cycle improvements because you do need a basic structure that guides what to improve first.
The Basis of a Hierarchy of Web-Design Needs: Maslow’s Hierarchy of Needs
American psychologist Abraham Maslow was influential in his field. He’s known primarily for his Hierarchy of Needs, a theory he first published several decades ago in his paper entitled “A Theory of Human Motivation.” Though it speaks primarily to human behavior and its motivations, it has resonated in other fields like marketing and, yes, design due to the omnipresent, psychological aspects of marketing and design.
In a nutshell, Maslow proposed that we human beings have a slew of needs ranging from lower- to higher-level. This is why it’s become popular to represent his theory in a pyramid, with the lower needs forming the base and the higher needs found at the top.
His groupings, from lowest to highest, are as follows:
- Physiological (Necessary for survival of our species) – food, water, shelter, clothing, sex (procreation)
- Safety – personal/physical security, monetary security, physical and mental health, support in the face of illnesses or accidents
- Love/belonging – friends, family, intimacy
- Esteem – self-respect, self-confidence, master
- Self-actualization – understanding and reaching full potential
The problem with Maslow’s theory is that it’s just that, a theory. It’s therefore open to criticism, which it has consistently received. One of the biggest criticisms is centered on the belief that it’s not necessarily vital to first achieve the lower accomplishments on the pyramid before actualizing the high-level ones. In other words, some people can well develop self-confidence without having complete physical health.
Now that you know the basis of the hierarchy of web design needs, we can explain specifically how Maslow’s theory can carry over into web design.
Market 8’s Approach to the Hierarchy of Web Design Needs
After much thought, at Market 8, and with great input from Luke Summerfield’s Growth Driven Design movement, we’ve settled on our specific hierarchy of web design needs, which we’ve grouped into three categories from lowest to highest:
- Functional site: Your website functions as it should: first technically (bug free), it’s easy to use, and that it presents your solution properly as opposed to lag behind what your company actually offers (you won’t believe how common this is).
- Persuasive site: Your website addresses the core needs, specific to them, and triggers them to take action.
- Advocate site: Your website is looked at as a useful resource, with helpful tools that are used, maybe on a regular basis, and that helps you get the word out becoming an advocate for your business.
Why Defining Hierarchy of Needs for Your Website is a Good Idea?
We see the Website Hierarchy of needs as a good heuristic to keep in mind when building a short, mid, and long term roadmap for improving your site.
In an iterative web design approach, such as Growth Driven Design, the hierarchy of web design needs is helpful since it provides a fundamental structure for your team to take in terms of prioritizing the importance of a sprint focus vs. another. This is especially important when there are a lot of ideas competing for time and budget.
You need to keep your team and budget laser focused on those things that will make your website contribute more to sales."
It’s important to preface this next section by stressing this: There isn’t a once-size-fits-all or cookie-cutter formula to your web-design needs.
Is it possible to skip ahead in the hierarchy?
Just as in human beings as it relates Maslow’s hierarchy, this doesn’t mean that you could launch some purpose-specific campaigns to enhance digital word of mouth, which would fall under the Promoters hierarchy, before spending months optimizing your landing pages on the CRO hierarchy.
However, if you do skip ahead, for instance do CRO before completing value, you must accept the fact that you’ll end up spending on punctual local optimizations on different pages of your site, as opposed to reaching the global optimum. That means, if you do CRO before completing Value, you can get your eBook campaign to perform at 50% conversion rate, but when your buyer takes the next step to learn about what you do and encounters a mediocre page on your site, you would have purposedly create a leak on your site.
Another example of why skipping ahead in the hierarchy isn't a great idea: you can’t expect to have your website present valuable content to your buyers if your site’s usability is horrible and it’s just an impediment for anyone to even read the content on your web pages... or, you can’t expect to spend thousands on building an amazing asset (something such as HubSpot’s website grader), if your website doesn’t even present what you do in a clear and compelling way (Value / Personalization).
First things first: fix the most basic things in your site first before moving on to anything more ambitious."
What's the benefit of the Website Hierarchy of Needs, again?
So in short there are 3 things that make defining your website roadmap based on your website’s hierarchy of needs a must-do:
- Keeps your team and budget focused: on a smaller set of tasks at a time, and what metrics should they be focused on moving.
- Helps you set clear expectations with stakeholders: on what will be accomplished, and why, and what will not be accomplished, and why.
- Makes progress measurable: since each one of the hierarchies has a specific set of metrics, it becomes quite easy to identify if measurable progress is being made
Now let’s break down into the specifics of each hierarchy, why is it important, and how we at market 8 have decided to measure them.
The Functional Site
A functional site is one that just gets all of the very basics right. As a result, it’s a site that will perform in the sense of being a live website that people can access and interact with.
When you have a functional website, your website functions as it should: first technically (bug free), it’s easy to use, and that it presents your solution properly as opposed to lag behind what your company actually offers (you won’t believe how common this is).
The 3 hierarchies in this level are:
Goal: Build a consistent, predictable flow of new visitors to the website.
Why is it important: To make data-driven improvements on the website you need to have a basic critical mass of new visitors to the site. This is an area where other the Growth Driven Design and other marketing initiatives need to work together.
Key metric: Total # of sessions - why not unique visitors? Considers every new session that a user has on the website, as a new opportunity to engage
Indicators: Unique users, SEO Rankings (# of keywords ranked for in the top 10 positions), PPC value of those keywords, # of blogs posted, # of visitors to the blog, # of inbound links.
Constantly being live on the Internet, so that people can find your site:
- Fresh blog content creation
- Social content promotion
- Paid traffic campaigns
- On-page SEO, cover all your basics and make sure your SEO is setup right
Goal: Buyer’s key most points of pain are addressed in different key areas of the website, and that those key areas are intuitive and easy to navigate.
Why is it important: To make sure that the value presented on the site is important for the buyers. You want to make sure that the information presented is high quality, and presented in an engaging manner.
Key metric: Bounce rate: Number of sessions that resulted on a straight bounce. - We assume that the visitors that bounce off directly from the site, are an indicator of low engagement.
Indicators: NPS (Net Promoter’s Score using a question such as: “How useful did you find this content?”), time spent on site, total # of page views, % of returning visitors, top visited pages, top exiting pages, website readability score.
These are some of the things that you’ll look to accomplish in the Value hierarchy:
- Ensure that the website presents the actual value proposition of the business, and that it is accurate. Make sure it displays correct information, with all the copy showing accurate product or service descriptions, about and contact info.
- The website needs to empathize with the buyer on what the problem is, make sure to eliminate / change all fluffy or jargony content that doesn't add value.
- Identify the behavior of converted customers, and identify the pages that were part of that journey. - Improve those pages copy and design to make the content more consumable, more engaging?
- Being consistent with your marketing and business strategy; for instance, if you want to sell a product or service or just grab leads’ contact info, then your page flows have to be designed specifically for those specific goals.
- Be beautiful and treat your leads and buyers to a visually appealing aesthetic (but not distracting), as studies also show that beautiful websites will make a much better impression on site visitors.
- Make sure that you have identified specific goals for each key page on your site. When you do that, and prepare the message, copy and design around that specific goal you are likely to get a better result than if you just "type up content and get a designer to create a page for you - oh and throw some offers...." Weird thing!
- Heuristic reviews by the UX team, to make sure that the most important relevant content, is easy to find for the user.
- Run live usability tests to make sure that key tasks on the website are easy to execute. For a B2B website you can go by the main user flows your site is designed for (which you must have figured ont by now).
- Run and monitor readability score on key pages of the site, and setup tasks to improve website readability on weak areas. The website readability score indicates basically if your website is written in a way that's easy to understand for your buyers. Regardless of how sophisticated your target audience is, a website readability score of grade 6-8 is what you need to aim for.
Programming Research, a company that builds QA software for the C programming language, does it right. During the research phase they found that the entire category has a low market penetration due to the fact that buyers are mostly unfamiliar with the innovative automated techniques they provide. Instead buyers are normally opting for simple and manual bug reporting solutions.
Therefore they built a website page that explains in an engaging way why their QA analysis tools is many times better than a typical manual bug checker. They even had a video with one of their top clients explaining why automated QA solutions are a must - what a better way of selling something than having your own customers do the talking, right?
Goal: To ensure that the user does not have technical impediments that affect its experience when navigating the site.
Why is this important: You can’t expect the buyer to educate himself, understand your solution, consume your remarkable content, nor have a great experience on your site, if it is plagued with bugs, broken links, disjointed navigation, or simply is just too slow to load or not mobile friendly.
Key metric: Website Grader score: a composite rate of how the website performs in 4 areas: Performance, Mobile, SEO, Security.
- B2B Heuristics Grade - this is a heuristics audit we do on websites to evaluate whether or not the website utilizes the 10 key usability heuristics on the most visited pages of the site.
- Customer Centric Grader - this is a proprietary scoring method that evaluates in a capability-maturity model, the ability of a website to peform as an effeective customer-centric sales tool for the company.
- Other indicators include Broken links and PageSpeed performance score.
- Run a broken link checker like Xenu Sleuth or Broken Link Check every month to make sure that there aren't any broken links.
- Run PageSpeed performance insights on the top pages of the website to identify if there are any page load speed issues both on desktop or mobile, and follow the suggested recommendations to improve your site's performance.
- Run routine checks to ensure SEO tidiness throughout the site using tools like MOZ or HubSpot. These tools help you identify exactly which pages need in-page SEO work: page titles, meta descriptions, headings, etc.
- Make your site secure implementing an SSL certificate. It won't only make your site unhackable, it also sends good signals for SEO nowdays.
The Persuasive Site
In marketing, persuasion is one of the most powerful, psychological principles of all time.
One of the best references that sums up this phenomenon is Dr. Robert Cialdini’s book called “Influence: The Psychology of Persuasion.” Here is an article we wrote about it and how it applies to B2B websites.
The persuasive site functions well, delivers value, and becomes a an effective tool to grow your business. Once the basics are covered, the focus of the persuasive site is then to optimize for conversions, maximize qualified lead generation, while becoming a valuable resource for your buyers.
A persuasive site is looked up to by your buyers as a resource they can use to consult information, help them formulate their problems, and make recommendations.
Conversion Rate Optimization (CRO)
Because at Market 8 we specialize on creating websites for the longer journey, B2B buying processes, we have adapted this hierarchy to reflect conversion through the entire buyers journey from awareness to decision.
Goal: To maximize the qualified lead capture across all of the funnel stages.
Key Metric: For this particular hierarchy we recommend having 5 different key metrics to get a real sense of how leads are flowing through the funnel. Therefore we'd track the # of leads that enter each one of the following stages:
- Customer (leads becoming customers)
If you are running paid traffic campaigns, we recommend you add the following key metric:
- Leads generated from paid traffic
Note we recommend tracking actual number of leads generated at each stage, as opposed to the conversion rate. Yes the rate is important, but the actual number is what ends up paying the bills.
To understand what lies behind the number of buyers at each stage, the indicators are simply the numbers behind each of the leads generated at each stage:
- Sessions: # of sessions to Awareness, Evaluation of Decision pages where the funnel stage conversion is expected to occur
- Conversion rate = conversions / visits to those pages respectively
- Top 5 generating leads at each stage of the funnel - to get a sense of the amount of improvement that is possible on each one of the pages.
- Sales - Total revenue from leads generated or converted through the website.
- Contrubtion to Sales - Total revenue from the target accounts vs. total revenue.
By focusing on actual numbers of leads & customers generated throughout the funnel all the way to paying customers, as opposed to simply focusing on the rates, we make sure that improving the website's performance in this hierarchy result in real business growth.
- Implement a growth optimization framework that guides you and your team through a routine audit process of the analytics.
- Identify where the top 20% of the opportunities to grow. Growth opportunities can be either related to improving conversion rate, increasing traffic to a high converting page, or putting triggers in the way of motivated buyers. It's not all about conversion rates.
- Dig deeper in each one of those growth opportunities and identify points of friction.
Once you have setup the high level indicators for every key step in the conversion process, you can setup a conversion event funnel in Google Analytics. For example this is how a funnel looks like for an organization's membership subscription page:
Here are a few of the top performing landing pages in our website (you'll see the poorest conversion rate aside from the Contact page is upwards of 30%). By focusing on the actual # of submissions as opposed to the conversion rate, it is clear what our focus should be to further improve our conversion to awareness.
In another case study a Fin Tech firm improved the overall marketing contribution to sales by 53% by focusing on this hierarchy for 2 sprints in their Growth Driven Design process.
Focus on Growth optimization, not only on conversion rates; growth opportunities can be either related to improving conversion rate, increasing traffic to a high converting page, or putting triggers in the way of motivated buyers. It's NOT ALL ABOUT conversion rates."
In the stickiness hierarchy your focus is to get your users to come back to your site on a regular basis to solve problems, self educate, and continue their buying journey.
Goal: To create regular users of the website.
Key Metric: # of visitors returning to the site in a set number of days.
We recommend stratifying this metric by number of times that the returning visitor has come to the website, and then look at the trend over a few months to get a real sense of whether stickiness is moving upwards or not.
From those returning users you'd also want to know:
- Browsing rate: or # of pages viewed per session
- Pageviews to the blog or other key subscription pages.
- Pageviews to the resource center (if your website has one setup) - A resource center is an area where you offer searchable advanced content.
- # of subscribers to the blog, or other key subscription areas.
- Setup a resource center or content hub that makes it easy to find content that is really relevant to the specific problem your buyers are facing. Categorize your content for this purpose at least by topic and industry.
- Invite users to subscribe to push notification updates using tools like pushcrew.
- Implement nurturing email campaigns to bring back buyers to the site and continue their buying process.
- Retarget users that follow certain behavior on your site.
- Emphasize subscription forms in key places on your site; but don't place them randomly on the site. Instead sell the value of subscribing.
For one of our clients, where we have been focusing on increasing the quality of the content offered, and organizing the layouts to make it easy for the buyers to find relevant content, the stickiness report looks something like this:
Green little arrows are good, red ones are bad. Overall it seems like we are being successful at making buyers return to the site. It looks like that trend peaked in August.
Here are some good examples of resource centers:
The Nielsen Norman group has an extremely simple yet very very good resource center where they list their reports. They have key elements in this page that entice the user to come back often to the site: a Free Reports area, and a Latest UX Research update area. They also make it very easy for the user to explore very relevant research topics.
SaaStr Academy is another pretty good resource center, that makes it easy for users to find content that's pretty relevant to the user:
Now let'w look at some not-so-good ones:
In contrast see what really is happening with most content hubs today. It appears that in the intention to be cool and good looking, the customer's interest is completely overlooked in some designs of resource centers.
See how much friction is in this resource center homepage for Openview Labs. It's a shame because the content is pretty good, but it's just impossible to consume effectively:
Here is another questionable content hub, by Uberflip, a content hub maker :.
Looks cool, but the fact that individual posts or ebooks are much more predominant than the topics makes it just hard to deal with for a user really looking to get their head around what can be learned here.
At the time this post was written there seemed to be a whole new holy grail: Account Based Marketing. The new big thing.
Although the concept has been around for a while, the reenergized focus on Account Based Marketing, perhaps as a result of limited ability of traditional Inbound Marketing activities to really make a dent in marketing contribution to sales. Overall marketing contribution to sales for most companies that have executed inbound still hovers around 25-30%, depending on the type of solution. Oracle is famous for having a marketing contribution to revenue north of 60%.
Whatever the case is, the personalization hierarchy is the stage at which you can start effectively targeting specific segments of named accounts, using or repurposing content and assets that have already been created while working on covering previous hierarchies.
The personalization hierarchy is the stage at which you can use your site to target specific segments of named accounts, aka Account Based Marketing"
Goal: To customize the experience to specific personas to best fit their needs.
So first you need to define a segmentation criteria for personalization on the website.
Key Metric: The personalization hierarchy requires a compelte set of focus metrics pertaining to each one of the target segments, with a few additional:
- Coverage - Total # of accounts in the targeted segment.
- Impressions - Total # of ad impressions from the target list
- Audience - Total # of sessions (traffic) from the target list.
- Conversion Rate Optimization (Awareness, Evaluation, Decision leads)
- Customers - Total deals closed from the target list
Indicators: In addition to the same set of indicators that were used for each one of the key metrics above, we'll list the following indicators to better understand our penetration into the target list.
- Usability/Value - Same as defined above but for the accounts in the target segment
- Stickiness - A measure of whether accounts in the target segment see the website as a resource and keep coming back.
- CRO indicators - as defined in the CRO hierarchy, but for the leads in the target segment.
- Engagement - Number of target accounts with a conversion
- Target Account Reach - Ratio of Engagement divided by Coverage
- Target Account Penetration - Number of contacts per engaged account
- Contrubtion to Sales - Total revenue from the target accounts vs. total revenue.
- Sales Cycle Time - Total time between first visit, and conversion to customer
- SQL Throughput - # of decision stage leads per period
- Start by defining highly targeted segments. Avoid generic segment definitions such as: "Companies between 10MM and 50MM who want to grow their business..." This kind of definition is too broad and will often render useless.
- Define a specific buyer persona and value proposition for each targeted segment
- Personalize your content and website to communicate your value proposition to that segment. If you have access to smart content features in your CMS, this is the time to do it.
- Define inbound/outbound target tactics and initiate the process of going after accounts in this segment. It's all in: targeted advertisement, social, cold calling, inbound tactics & SEO specific to this audience, etc.
- Develop nurturing workflows specific to this target audience.
- Setup an integrated contact record, so you can gather all of the behavioral learnings and start collect data as early in the process as you can.
How do you know if your segment definition is too broad?
Simple; make it pass through the Value Proposition Test:
If your stated value proposition to that target group does not compel the buyer to action, it means that the problem for that target segment is not well defined, or you don't understand it well enough...
Which means that the segment is too broad, or that your solution is not well formulated for that target group.
You'll know you've nailed your value proposition for your target segment if it compels the buyer into action in one of 3 ways:
- Opportunity for improvement
- Threat of deterioration of current status
- Fear of loss of current position (the most powerful one)
Here is an example that Pardot used to target their buyer group in their early hyper-growth stage.
"Companies between 50 and 200 employees, from which 5 to 50 of those employees are in sales & marketing; who at least one 1 full time markeing manager; who have salespeople in linkedin, indicating they have a consultative sales process; who invest in adwords for direct response marketing; with one newsletter subscription box in their homepage, indicating they have some kind of email marketing program"
And they still made subsegments from there...
Specific enouth? you bet.
Were they able to formulate a value proposition (that's truly valuable) for that segment - yup!
Examples of Personalization in Action:
Domo is an enterprise-grade business intelligence. Their solutions are in the medium scrutiny level probably averaging north of $50k per deal in ARR. This kind of purchase is multi-layered, which means that there are going to be multiple levels of consensus and approval in an organization before finally making a purchase decision. Domo has the advantage, however, of having a product that can be tailored to be extremely useful and attractive for every role in the organization, so every potential stakeholder with some level of responsability in the firm, has also the potential of becoming an advocate.
Hence the "role" has become a central focus for them to personalize both website content, and advanced content (downloadables, etc.).
Solutions by role:
Content tailored by role:
The Advocate Site
The advocate site level is a hierarchy level that allows the website to act as an exponential multiplier. Meaning, it helps your company get the word out and get an increasing exposure to new audiences, by enabling and exploiting word-of-mouth.
The two hierarchies in the Advocate site are: Assets, and Promoters.
Assets are advanced tools that are so good that customers would actually be willing to pay for them, but you offer them for free.
This is more than just eBooks, or other valuable content focused on education. Assets solve real problems and are used as tools by the buyers. In the process of using them, if the asset is truly helpful, buyers tend to develop a possitive attitude towards the brand, become leads, and recommend the tool to peers.
Goal: Create assets so valuable that the customers would be willing to pay for them (but you offer them for free)
Key Metric: # of leads generated by the asset
Indicators: To track the full performance of an asset we need to measure the funnel for that particular asset:
- Visits - # of sessions to the asset page
- Starts - # of sessions in which users started engaging with the asset but did not go all the way through
- Leads - # of leads generated (users that used the asset from start to finish)
- Conversion Rate - Leads / Visits
A prime example of this is HubSpot's website grader:
Some SaaS firms' sales model have Assets embeded in their model through Fremium licenses. Builtwith is a tool that scrapes websites to identify technologies being used on them. You can consult one-off websites, which is a great asset for future buyers and at the same time demonstrates some of the of the tool.
The hypothesis is that once the buyer gets the benefit of utilizing the free asset to gather intel about a particular lead, they will be in a better spot to pay for a license:
Promoters and assets may work well together. If the asset, or content you have made available so far is truly valuable and buyers are engaging with it, you can take an extra step to get your current users to share it with their peers.
Goal: To develop an organic word-of-mouth for a particular conversion point.
Key-metric: k-factor, which measures the growth rate of websites, apps, or a customer base. The formula is roughly as follows: k=i*c
i=number of invites sent by each customer (e.g. if each new customer invites five friends, i = 5)
c=percent conversion of each invite (e.g. if one in five invitees convert to new users, c = .2)
Initiatives: Here are some things that you could do to boost your k-factor:
- Start simple: install as "share with a friend" widget after every download on your website
- Consider adding a conditional step in the opt-in process that requires users to invite their peers to unlock an asset or an exclusive piece of content.
- "Download with a share" - consider offering some assets in exchange for a tweet or other social share.
A classic example that have gave fame to this model is Dropbox. You can get free space when you get your friends to open an account:
Here is another example of an opt-in thank you page where the user is required to share the invitation with 5 peers to unlock the offer:
Conclusion: Building a Roadmap Using Your Website Hierarchy of Needs
If your approach to making your website to do more for yuour business is to engage a web design firm to do a one-time project every few years, I'm afraid to tell you that is dead flat the wrong approach and you will end up wasting a lot of your company's resources.
Tranforming your website into an effective salesperson that has a role in contributing to sales is a long term journey. And like any journey, having a roadmap is better than not having one.
The website hierarchy of needs gives you the ability to "address first things first"
With this framework you can prioritize a long list of activities in the precise order in which they should happen so you can maximize your ROI. In our experience, it is not uncommon to have a full 2-year outlook of things that should be done on a website, and know the exact order in which they should be done. To build a roadmap it's enough to create a gantt chart with a brief description of the focus hierarchy for each one of the sprints to come.
Also, keep in mind that improving your site based on the hierarchy of needs, is not a trip in a single direction.
The website hierarchy of needs is an iterative approach. Just as your products & services evolve, so should your website, so once you have successfully taken a website through the whole hierarchy you can come back to a particular hierarchy to further improve the focus metrics.
If you’re already at the stage where your usability is good, then it can always be improved. GDD is the design approach that will constantly look at your site data from real users to determine what problems in the user experience they’re facing that lead to lost conversion and sales.
While a web-design hierarchy isn’t the be-all and end-all of design, it’s a smart place to start to determine what your site needs in an ongoing basis.
Have you had experiences with ongoing website improvements?
Have you used a framework that helps keep priorities in order?