Improving Your Website User ExperiencePosted by Ryan Jones on Jan 24, 2019. Reading time: 10 mins
We covered understanding your website performance on the blog last month, but once you understand your website performance, how can you improve your performance?
It’s not a magical black box. If your website performance is poor, you are probably providing your visitors with a poor user experience. So what do you do and where do you start? Well, you are probably part of your own target audience, or have friends, family or staff that are. They can start testing the usability of your website.
The big not-so-secret here is that if there are aspects of your web pages that annoy you, or your staff, they’re probably the same things that annoy your customers! Making small changes can make your website more user friendly and definitely improve your bounce rate!
Simple user experience issues we come across all the time include:
Slow load times
Research by Kissmetrics indicates that a 1 second delay in page loading times can result in a 7% reduction in conversions, and 40% of people abandon a website that takes more than 3 seconds to load.
Performance is part of the foundation of good user experiences, so if your site is slow this can have a negative impact on your revenue stream. Essentially, the performance of your site plays an integral role in determining whether your business will be profitable, or not. DoubleClick, for instance, found publishers whose sites loaded within five seconds earned up to twice as much ad revenue than sites loading within 19 seconds. In this case, higher performing websites (i.e. the ones with faster loading times) were able to engage their audience more effectively.
Ensuring your site loads efficiently means less chance of losing potential clients and more revenue for your company. If you want to see how your online performance is impacting your revenue, check out this Google Analytics Impact Calculator tool.
One note - you should use a testing tool that allows you to test from a server closest to you and your customers, as your website must be hosted as close as possible to your target market. This will make your website load faster for your local customers.
Refuel use GTmetrix and Pingdom Tools, plus the Page Performance tools from our friends at WP Engine. GTmetrix allows you to sign up for a free account so you can change the server to Sydney (our local!) and accurately measure your speed.
What is a good speed? As fast as possible, but it depends on your website. With the tracking codes and interactivity we need in modern interfaces, we aim for 1-2 seconds.
Page sizes have continued to increase since around 2011 which has meant leaving more mobile users out of the loop. Websites that take 5-10MB to download a page aren’t just slow, they cost mobile users money with limited data allowances.
Lightweight, fast websites give the best user experience, which sometimes means you have to compromise on your imagery and fancy videos.
The key contributors we find to page sizes and poor load times are:
Photos, logos and images
It’s always great to add a nice photo to a website. A picture tells a thousand words! But the images that come straight off your camera are massive files, and will slow your website down. Too many people just take the photos of their camera and upload them to the website.
For website use, often you will display the image a fraction of the size of the file on the camera. An image off your camera might be 4500x3500 pixels, but when you use it on your website you might be displaying that image as a preview and showing it at 150x100. Using the image in the right dimensions can significantly reduce the download size of the image and improve the usability of your website.
You also need to select the right image format. JPG is great for photos, PNG great for transparent images and logos.
What is the best way to reduce the image size? There are a few key tools we use:
- Adobe Photoshop - If you have a copy of Photoshop, you can use the “Save for web” or “Export As” function to export your image in the exact size you need it on your website, and experiment with different image formats to get the smallest file size with minimal impact on image quality.
- TinyPNG - Once you have your image, you can upload it to TinyPNG to compress the image as much as possible without degrading quality. Depending on how you prepared the image, TinyPNG can half the image size. The best news: you can use TinyPNG online for free.
- ShortPixel - If your website runs on WordPress, ShortPixel is a great, semi-automated image optimisation option. You can do a bulk image optimisation when you first install it, significantly reducing image size, then set it up to automatically optimise images as they’re added to the website. We use ShortPixel with all our managed WordPress hosting clients.
If you use Pingdom Tools to test your website speed, it will show you what percentage of your website download is images. You can run Pingdom Tools before and after image optimisation to really see the difference in download size, speed, and percentage of images.
YouTube videos take time to download for your customers. YouTube has some fancy techniques to reduce the impact of this, but they still add to the page download size through the initial video player and scripts.
If you have a lot of videos on each page, this will significantly impact your page size and your download speed. Easiest way to optimise this? Reduce the number of videos on each page, and cut them back to your most impactful.
By now hopefully you know you should be using Google Analytics to track your website visitors. Maybe you’re also using the Facebook Pixel to track Facebook traffic, or Hotjar to develop heatmaps of how your users interact with your website. Add Drift, HubSpot or some other kind of live chat tool and your site is loading a lot of scripts.
All of these scripts add to the site download size and time, slowing your website down.
The best way to manage this is to move all your tracking/measurement tags - Google Analytics, Facebook Pixel, Hotjar, etc - into Google Tag Manager. Not only does Google Tag Manager make it easier to publish these tags, but it also optimises your tag loading so that they don’t slow your website down as much.
When you’re doing this, take the opportunity to check if you still need them all. Is your website still loading that tag your old website designed added 3 years ago, but you can’t access the data? It’s time to delete it.
Poor compatibility with mobiles
How does your website look on a mobile phone, or a tablet? Are there features available on desktop that aren’t available on mobile? With global web traffic from mobiles increasing to a point where more traffic is generated through mobile phones than desktop computers, mobile compatibility is key to getting this audience to convert.
Some of our clients are now getting 80% of their traffic from users on mobile phones, so if your website isn’t responsive on a mobile phone, it’s time to fix it!
Even if your website is responsive, or you have a dedicated mobile site, make sure your design elements work properly on the smaller screen. One thing we test when we do website reviews and usability testing is are the important elements of the website all visible on mobile, and in the order we need them? Are the calls to action visible high up on the page?
Start Engaging Real People!
To keep your online performance high, you should always consider real life and real world consequences and perception. For example, as many people browse on a mobile device, knowing that your customers could be viewing your site through LTE, 4G, 3G, and even 2G networks is vital. In fact, lots of people are browsing more slowly than you may realise according to web analytics by Calibre.
Users engaging with your site on a mobile device, or a network that may be slower, have the same expectations as users engaging with your site on a laptop or faster device. Ensuring your site loads and shows important information quickly should not be underestimated, and much of that involves ensuring your site doesn’t overload your users’ data plan or force them to spend more money to view larger sized pages on the go.
The visual design of a website becomes irrelevant if your users can’t load the page to begin with. It is therefore your job to ensure your users will be able to see your content in the real world, not just on the best and fastest running devices.
Not sure where to start?
Refuel Creative can help! We offer once off Search Engine Optimisation and website usability audits to help you understand how your website is being seen and used by visitors, and providing you with a practical, prioritised list that you can implement over time. You’ll learn:
- How long your website takes to load, what are the main culprits, and how you can make it faster.
- Where your website traffic is coming from.
- How you rank in organic search, and where your competitors rank.