How to Optimise your Webflow Website with User Recordings

Nikolai Bain Profile Picture

By Nikolai Bain

Updated: 

Mar 1, 2021

Posted: 

February 18, 2021

How to Optimise your Webflow Website with User Recordings

Share this article

How to Optimise your Webflow Website with User Recordings

Prefer video?

Watch the video version of this blog post on my Youtube channel.

Watch Video 

Ever wanted to be able to watch the visitors who use your website? With user recordings, you can, and all without having to sit outside in a tree with a pair of binoculars.

User recordings show you individual journeys of your website visitors. Rather than focusing on an average of data points like you see with analytics, you instead get to see exactly how an individual user browses your website; every pause and action taken as the user moves around your website, and when they leave.

There are a couple of benefits to having user recordings set up:

  • Find bugs - sometimes when implementing new changes you can forget to do QA on every page all the time, so you will often find small bugs and issues that you missed
  • See recordings from different devices - since you will see recordings from users with all different types of devices, you can start to see how your website differs and where you might need to make adjustments for popular device types
  • Watch where users take more or less time - by watching an individual recordings, you can focus more on why someone might be spending more time to read something, or moving straight past a section you thought was important
  • Observe false clicks - though you can also see this through heatmaps, you can better observe where users are incorrectly clicking on something, and also when users are rage clicking

Now that you know why user recordings are so useful, let's set them up.

How to set up user recordings

We are going to use Hotjar to set up user recordings, as it's free and super easy to use. You will want to first create an account and add your website.

Then find the tracking code and copy it.

We are going to paste this code in the head code section of the Webflow website in the project settings. After adding it and republishing your website, you can now turn on user recordings in Hotjar.

Click on the Recordings tab, and click 'start recording visitors'

And that's it! Wow, that was easy.

But as you know, any tool set up and left forever is not going to be of any help. You can now leave Hotjar for a week or so, and then jump back in to watch your recordings.

Once you've come back to Hotjar after a week, you should have plenty of user recordings to watch. They are sorted by how important they are based on how long they were on for, and how many actions they took.

Though you can go through and watch as many as you want, you only have so much time in the world, so try and only focus on the recordings that are going to be helpful.

To start, you want to try and recognise any unusual or bot-like behaviour, such as in the list above - a user that is on 1 page for an hour and takes 147 actions (clicks).

You can skim or ignore these users, as they usually won't tell you anything important.

When it comes to good recordings, you'll likely want to see above 10 actions, and being on the website for around 5 to 30 minutes. Longer is also fine, but it usually means that users have the tab open for a while without activity, and in this case there might be a lot of blank time to look through.

You also want to make sure they are in a location that is sensible to your target audience, as there is no point in optimising your website for customers you don't want.

Pick a good recording to watch from the list.

Watching a user recording

Now you can go through and see how an individual user is browsing your website. You'll want to enable "skip pauses" so you aren't watching parts where the user isn't moving.

See how the website visitor navigates around your website, what they focus on, and what they glaze over.

It helps to take small notes as you watch through it. You can either do this via an external app such as Google Docs, or click the "Add comment" button to make the note in HotJar.

You want to end up with a list of insights about how the website visitor is using the website and why they might be taking certain actions.

Speaking of actions, you can also click the actions tab to see the list of every action they took throughout their session. You can click on an action to go to the point in the video when the action was taken.

As you go through the recordings, ask yourself:

  • Were users taking the actions you wanted or expected?
  • Were they moving towards your goal in a meaningful set of steps?
  • Why did they leave when they did?
  • What are they looking for on my website before they take action?

Taking action on the insights

As always, it's not enough to just collect the information, you now have to take action on it.

With your lists of insights, try to understand what they mean, and what meaningful change on your website could have improved the users experience or made it easier for a user to move towards a certain goal of yours.

You might decide to add more detail in a certain section, add more CTA's through the page or remove some, emphasise a certain section more to get a user to take action, or so on.

To improve overtime, all you need to do is make improvements such as above based on insights you've collected, and do this iteratively on an ongoing basis.

By doing monthly check-ins on your data, you can be up-to-date with how website visitors are using your website, and how you can improve it.

Summary

In just a couple of minutes you can get user recordings set up on your website and benefit from them for the inevitable future.

User recordings assist to improve your website in several different ways by showing you:

  • Where users are coming across bugs
  • How your website differs on different devices and browsers
  • Where users take more or less time on a page
  • When your users are clicking incorrectly on static elements

By taking this information to make adjustments to your website, you will help improve the user experience of it, and overtime this will result in a clearer website, happier website users, and more sales or sign-ups.




Webflow Templates Cover

Don't want to build from scratch?

Start with a Webflow template and have your new website up in no time.

Nikolai Bain Profile Picture

Written by

Nikolai Bain

I'm a Webflow professional partner and template designer who helps users learn to use Webflow better.

More about me

Ready to learn more?

I've worked with countless businesses around the world. Maybe you'll be next.

Get in Touch