Last updated Jun 16 2020

How to research for your website redesign

Just like you wouldn’t start a house remodel by knocking down walls without making sure they’re not load-bearing, you shouldn’t approach a website redesign by simply removing everything you have and restarting from scratch. You first need to understand what’s working and not working on the current site—so you know what can and should be preserved. And that includes: 

  • Which pages your customers usually land and convert on
  • What’s already driving users there
  • Why they’re converting (or why they’re not)
  • What’s acting as a barrier
  • What can be improved vs. what’s already performing well

Here is a two-part research framework to help you get started finding all the data you need (and more) to carry out a successful redesign. We wrote this with an ecommerce website in mind, but most of it is applicable to non-ecommerce sites as well.

Part 1: how to identify and categorize your top paths
Part 2: how to identify your customers’ drivers, barriers, and hooks

Part 1: how to identify and categorize your top paths

A handful of URLs on your website likely contributes to a large percentage of conversions: any untested or careless changes to those pages could potentially break the experience and tank revenue as a result. But other landing pages may not have many visitors, or may contribute to an irrelevant number of conversions. The two types of pages are clearly not created equal—you need to be way more cautious in the first case than in the second.

You can use this framework to categorize your pages into four main groups:

website-redesign-categories
  • Pages you need to redesign with extreme care (in red) these pages have high traffic and conversions, which makes them extremely important for the health of your business. Anything you break here will have far-reaching consequences. 

  • Pages you need to redesign with care (in yellow) → these pages have high conversions but low traffic, so anything that breaks here will affect a smaller amount of visitors than the previous case—but they still need to be handled with care, so as not to cost your business in the long term.

  • Pages you need to improve (in green) → pages with high traffic but low conversion offer a lot of opportunities for improvement, seeing as they receive a lot of traffic but there is nothing crucial conversion-wise you might break.

  • Pages you can redesign without worrying (in grey) → changes you make here are probably not particularly noticeable anyway, because of the low traffic. Redesign away: these are some of the most risk-free pages on the site.

Here are the 3 steps you need to take to identify and categorize your top paths with Google Analytics:


Step 1: collect data in Google Analytics
Step 2: organize and categorize the data in Google Sheets/Excel/a spreadsheet
Step 3: segment your traffic further in Google Analytics

Step 1: collect data in Google Analytics

  • Head to your Google Analytics account. To get started, you want to have a substantial enough amount of data to account for seasonality and random blips. In this example, we’re going to use 3+ months:
1-select-time
  • Go to Behavior > Site Content > Landing Pages. This gives us a good idea of where people land on and start their journey across your website:
2-landing-page-data
  • We are now going to identify the paths that bring 80% of the traffic and/or 80% of the conversions. Use the selector to show 50 of your top pages:
3-row-selector
  • Export the data and import it into Google Sheets (or Excel, or any other spreadsheet format you might want to use):
4-import

Step 2: organize and categorize the data in Google Sheets/Excel

  • Simplify your spreadsheet by taking out unnecessary columns. Leave Sessions (so you can check the traffic) and Transactions, Revenue, Ecommerce CR (so you can check for conversions and value) only.
5-delete
  • Create a column to the left of the Sessions one, give it a descriptive name such as % Total Traffic, and use it to calculate the percentage of traffic to each page as part of the total:
6-percentage
  • Select enough pages to reach 80% of the traffic. Highlight them: these are your high traffic pages.
8-top-traffic-pages
  • Repeat the previous steps for the Revenue column (depending on how you evaluate ‘conversions’, you may want to do this with the Transaction column instead).
  • You should now highlight the pages that bring you the top traffic and/or are responsible for the most revenue/transactions on your site. 
9-top-pages
  • Remove everything you have not highlighted (everything that is neither top traffic nor top conversion) to make the spreadsheet even more straightforward:
9-top-pages-b
  • Look at the relationship between traffic, conversion rate, and revenue, and tag the pages accordingly based on the four available categories.

🔥Important word of advice: the process we followed so far looks at landing pages, but in an ecommerce setting you obviously will also need to evaluate pages that form part of the overall customer journey and lead to purchase, such as account sign-in, basket, checkout steps, etc. In our example, the basket and sign-in pages both qualify as a ‘redesign with care’ because of their high conversion, low landing traffic status—but since they both will be seen by a lot of people throughout their journey, you can move them to the ‘redesign with 10x care’ category:

10-tagged-pages

Step 3: segment your traffic further in Google Analytics

Once you have your top paths, it’s time to dig a bit deeper into each page—because it’s not just the URLs themselves you’ll need to focus on, it’s also (and mostly) the people visiting them. Let’s use /home as an example:

  • Start by applying a secondary dimension such as Device Category and look for differences in behavior. For example, in this case mobile devices bring less traffic but a much higher conversion rate and overall revenue than desktop:
10b-devices
  • Make note of this into your spreadsheet. In this case, it’s worth splitting the /home row into two separate desktop and mobile rows, and treat the two slightly differently—mobile clearly needs to be handled with more care than desktop:
11-mobile-devices
  • Apply other secondary dimensions such as Country, especially if you’re selling across multiple countries, and look for interesting patterns. For example, you’d probably need to treat US traffic particularly carefully as it accounts for almost half of the traffic and over 93% of the revenue, but India accounts for almost 8% of the traffic yet there are no conversions and that’s something that could be investigated:
12-countries
  • Keep making notes into your spreadsheet. If it looks like a bizarre rainbow at this point, you’re probably doing it right 😉
13-countries-devices-update
  • You can then move to ecommerce specific reports from Conversions > Ecommerce > Shopping Behavior or Conversions > Ecommerce > Checkout behavior and look for anomalies or interesting data points from the segments you’ve identified this far. For example, we’ve already found that people from India don’t convert, but this report shows that 2% of them do actually add things to basket—they just never complete their purchase. The question to keep in mind for future steps would be: why?
14-ecommerce-report

You might not find anything ground-breaking in this data, but the point is to keep investigating and digging. At the end of this process, you should get to a table that looks like this and have a fairly clear idea of how to behave with each page or set of pages:

15-redesign table

Part 2: how to identify your customers’ drivers, barriers, and hooks

Once you’ve identified your top conversion paths, you’ll have a good idea of how much care to apply when redesigning each individual page (or set of pages) people land on and browse through. Now it’s time to dig deeper into who these people are, why they got to your website in the first place, and what is stopping them or moving them forward.

You cannot do this in Google Analytics, so your next move is to combine data from GA with insight from third-party behavior analytics software like Hotjar. In the next few sections, we’ll show you how to do using a simple research framework one-pager that you can download and use throughout the next part of the process.

16-hotjar-website-redesign-process-plan

A. Identify your top personas and what drives them to your site

Visitors and potential customers come to your website for different reasons: 

  • To know and learn something specific about your products
  • To get in touch with you directly (e.g. to find a customer service number or a store address they can go to)
  • To learn how to do something (a task, an action) with one of your products
  • To buy something from your site
google-research.png

If you treat all visitors the same or make assumptions about why they are coming to your site without validating it with real data, you won’t be able to tailor the redesign experience and/or prioritize the right messages for the customer segments that are most important to your business. The first thing to do is define your top personas and their drivers.

⚠️Why this is important: user personas are realistic representations of your visitors and customers; they help you get a clearer sense of who your ideal customers are, why they are reaching your website, and what helps them in their path to conversion.

How to do it → set up an on-page survey using Hotjar (they’re called Polls within the dashboard). In the Questions section, add three open-ended questions in this order: 

  • A question to identify the DEMOGRAPHIC that matters most to you:
    How would you describe yourself in one sentence?
  • A question that helps you uncover what is driving visitors to your website (their ‘driver’):
    What’s the main reason for your visit today?
  • A question to identify what may be stopping them from an action (their ‘barrier’):
    What, if anything, is stopping you from [action] today?
18-persona-questions

Use the Targeting option to set the survey to appear for specific devices on your top landing pages (the ones you identified in the previous steps).

17-persona-survey

After collecting a number of answer that is representative of your website traffic (e.g. if you get thousands of visitors a day, don’t stop after collecting 10 or 15 answers!) follow the steps from this article to identify your user personas and organize your answers into a list of the main ‘drivers’ that people want to fulfill on your site.

✅Next: fill in the redesign research plan with your top 3 drivers and personas

B. Identify where and why people are exiting your website

While many people may arrive at your website, only some of them complete the journey to conversion (if you’re in ecommerce, the average conversion rate you can expect hovers around 2%). People who came without a desire to convert are unlikely to be swayed; but some of your visitors may be actively trying to complete an action, and something on your website is stopping them from doing so. That’s why the next step in your redesign process is investigating what, if anything, is currently not working on your existing pages. 

⚠️Why this is important: you want your redesign to help even more people who visit your high-traffic, high-conversion pages convert, so you need to figure out why some currently don’t.
How to do it → you need to dig deeper and answer these two questions:
1. Where are people leaving the site?
2. What could be causing them to leave?

#1. Find where people are leaving your site
Head back to your Google Analytics account and reach Behavior > Site Content > Exit Pages. Make a note of the pages with a high exit rate:

19-exit-pages

Bear in mind that some pages should have high exit rates (thank-you pages, for example, are a prime candidate: customers got what they came for and now they’re naturally ready to leave). But pages like your contact form, pricing page, or shopping carts are common culprits for drop-offs; and you can use the Conversions > Ecommerce > Checkout Behavior report to find where people exit their session on their way towards a purchase.

In our example, most drop-offs happen on the Billing and Shipping page:

20-checkout-behavior

This answers the ‘where are people dropping off’ question—and now, you need to investigate the why.

#2. Find the most problematic section(s) of the drop-off pages Once you know that people leave on a specific page or set of pages, you want to investigate what is making them leave at that point in their journey. Start by setting up a Hotjar Heatmap:

21-heatmap

Hotjar will record your visitors’ actions on the page (including mouse scrolling, clicking, finger tapping or swiping on mobile) and render them in the form of scroll maps, click maps, and move maps to help you see which parts of the page people are interacting with, skipping past, and/or ignoring.

what is a heatmap

In addition to heatmaps, review Session Recordings to see how people interact with the page as part of their wider journey. Use the filter function to find sessions that end on your drop-off pages:

22-recordings-filter

As you watch the selected recordings, make a note of whether your visitors:

  • Hesitate when performing an action
  • Frequently click in frustration or U-turn back to the pages they’d just come from
  • Can see all the content as you intended it to be seen
  • Are able to interact with buttons, links, or clickable elements
  • Encounter bugs and/or broken elements

Combining insights from heatmaps and recordings will give you a much better sense of how to proceed with your website redesign: which page elements to preserve, which to remove or edit, and what changes to make to the overall site flow to allow people to find what they currently cannot.

✅Next: fill in the redesign research plan with the top 3 barriers or obstacles you have identified.

Useful extra reading

If you are new to heat maps, check out this multi-chapter heat map guide that will help you get started. If you need an efficient method for not drowning in mountains of data, here are some tips to get actionable insights from user recordings in 6 steps.

#3. Collect feedback on what’s ruining the experience Hotjar Heatmaps and Recordings can help you make sense of your customers’ journey across your website and on specific pages, and you can even come up with a pretty solid list of what’s working and isn’t based on observation alone—but you still need to hear directly from your customer so they can confirm your hypothesis and tell you exactly why something needs fixing.

Start by setting up Hotjar’s Incoming Feedback widget on your pages, and wait for people to leave their comments:

23-incoming-feedback

In addition to rating their experience, your visitors will be able to take screenshots of specific page portions they want to comment on. Filter the results for the high-exit pages you found in the previous steps, and start reviewing your results by making a note of all ‘hate’ and ‘dislike’ comments (but also take note of the positive feedback, so you don’t remove what people already like!).

24-incoming-feedback-example

As an additional step, go back to using on-site surveys to prompt direct answers from your visitors. Set up a one-question poll and ask one of these questions:

  • Quick question – if you decided not to [action] today, what stopped you?
  • Quick question – what is missing on this page?
  • Quick question – what, if anything, is stopping you from [action] today?
25-question-barrier

Analyze your open-ended questions based on the results you collect. At this point, you should start to see some barriers that might be stopping visitors from completing specific actions on these pages: your redesign should investigate whether you can resolve them with design, clearer copy, a different page architecture, or other on-page changes.

✅Next: fill in the redesign research plan with the top 3 reasons why customers leave your website—in their own words.

Useful extra reading

Read more about setting up and using on-site surveys on your site to collect customer feedback.

C. Identify what persuades your customers to convert

At this point, you’re almost there: your final step is identifying the nudges or ‘hooks’ that push people to convert. And for that, you need to talk to people who have already converted—and get to the bottom of what almost stopped them, and what ultimately propelled them forward.

⚠️Why this is important: without asking people who have converted about their experience, you will not be able to identify conversion-boosting insights or ‘hooks’ that you can amplify for all other visitors; similarly, you will not be able to understand the fears and/or concerns that almost stopped these people on their conversion journey, so you can address the same obstacles for everybody else.

How to do it → set up a post-purchase survey on your thank-you page (or send a survey via email to your new customers soon after they convert) and use it to ask these three questions:

  1. How would you rate your overall experience?

2a. If the answer to question 1 is positive, ask: What did you love the most about the experience?

2b. If the answer to question 1 is negative, ask: What can we do to improve the experience?

3. What almost stopped you from completing your purchase?

rate-experience

At this point, you can also review data from your Incoming Feedback widget (which we discussed in point B) and filter by ‘love’ to see if there are any on-page elements that your customers and users particularly appreciate.

home-test-page

Pro tip

A website redesign deserves a lot of in-depth customer investigation. In addition to using polls and surveys on your pages, talking to existing customers about their pain points is a valuable source of information. Contact 5-10 of your top customers (those who fit your user persona and have purchased multiple times) and see whether you can ask them a few questions about their order, in person or via phone call. You might need to offer an incentive for this, such as money off their next purchase, for people to agree—but we guarantee it will be money very well spent. 

Read the ‘own the relationship with your customers’ section of this article on product/market fit for a few practical tips on how to get started with customer interviews.

You can also go back to Session recordings, and compare recordings of people who visited your purchase confirmation URL (and have therefore converted) with recordings of people who never made it there:

recordings

Then, spend a few hours diving into your recordings, asking yourself:

  1. Are people seeing important content?
  2. Are people clicking on key page elements (links, buttons, and CTAs)?
  3. Are people confused by non-clickable elements?  
  4. Are people getting distracted?
  5. Are people experiencing issues across devices?

You might find that people who do convert click key buttons like a CTA, but those who exit without purchasing don’t. Similarly, you might find that non-converters spend a long time hovering over your navigation bar, something that customers don’t do. What you’re looking for is not just how people navigate through the site from page to page, but also how they behave within a page: what did they stop at, what's sticky, what attracts attention.

✅Next: fill in the redesign research plan with the top 3 hooks and top 3 fears/concerns people experience when converting on your website.

Next steps

As you fill in your redesign research template, you will see that existing issues and potential opportunities start coming into sharper focus. Something we recommend at this point is that you use the filled-in template to summarize the data you have gathered so far and present it to your teammates/colleagues/stakeholders. You can then open up a discussion, collect more and different insights from other team members (for example, Sales and Success teams who are in regular touch with your customers) and find a collective way forward for your website redesign.

Your must-have during a website redesign

Sign up for a free Hotjar account, set it up, and find out what to keep and what to change on your website as you approach a full redesign.

Free forever. Get started!
Hotjar-8-tools-behavior-analytics