We all hate slow websites. But did you know people actually get stressed if they see a spinner load symbol?
On top of that, slow websites are bad for business. Mobile has become the biggest device category and is increasingly being used as a “conversion device”. Mobile page speed thus impacts conversion directly. In this blog, we’ll discuss further whyand how to improve the speed of your website.
There is only so much you can do if a user has a really crappy or unstable connection, on a train for example. So we’ll focus both on design solutions, tricking people in making your website “feel faster” and actually making it faster by improving the load performance.
On avg. we pick up our smartphone:
– 80 times a day,
– every 12 min we are awake,
– less than 30-second sessions.
That means a few seconds are in fact a big deal and your users are not going to be patient if your website loads slowly.
Website speed has a direct impact on the engagement of users. Google’s research has shown that slow websites have higher bounce rates and worse overall user experience.
Slow websites give people more stress than watching a horror movie.
Luke Wroblewski – Conversions@Google 2018
Google has always focussed on delivering the best onsite user experience possible.
Waiting for a website to load is not a good user experience.
https://moz.com/blog/how-website-speed-actually-impacts-search-ranking
Put the focus on the progress, not on the progress indicator. If you keep people busy, like showing the gradual progress of your website, time feels quicker.
Uncertain waits feel longer than certain waits!
Skeleton screens have become quite common and are a good example of gradual progress of the website loading.
Let’s compare a website with a face to face conversation. In a conversation, we like it when people give small cues, like nodding or “uhu-ing”. That way we know they’re still with us = certainty.
Feedback expectations in a conversation.
The same holds true for websites, we want small indicators something is actually happening. Rather than an endless looping spinner, not providing us with any information something is actually loading = uncertainty.
Website gradually loading by having an optimized critical rendering path.
The first step should always be analysis, gathering as much insights and data as possible. An objective look at the speed of your website in different network conditions and browsers. It might also be a good idea to check your web analytics which devices and browsers users commonly use to visit your website.
Tools to check the speed of your website:
Check out this video of how to use the DevTools in your browser to audit and simulate website performance!
The tools you’ve used to analyze should give a few good pointers which files are heavy and why your web pages are slow.
Prioritize by impact and feasibility! Optimize the primary content of your website first! What are your most viewed pages? Which are most critical for conversion?
Also, question everything on your website. Do you really need as many images, that fancy JS animation? Does it improve the goals of my website and does it improve overall user satisfaction?
Don’t forget why websites suck: People like to add stuff.
Heavy images are often a big culprit. Resize images using an image editing tool (Photoshop) to the right size.
Use free image compression tools like Google’s recently released https://squoosh.app/ or automate image compressionwith https://imageoptim.com/, https://tinypng.com/.
Clean up your code! Developers like to reuse code & plugins. But do you really need Russian error messages on a Dutch website?
Minifying means you leave out any info/ characters from a file, the browser doesn’t need to render your website.
Consider themes, plugins, apps, and widgets, basically any third-party script.
Choose your hosting carefully because the response time of your server will greatly impact your website speed. Your server response time should be under 200ms. Put some thought in web server setup, configuration, capacity & maintenance.
Try to limit the number of HTTP requests you send to your server. By merging several scripts or stylesheets where it makes sense or limiting the number of images on a page.
Check out HTTP/2 and research & test how it can impact your performance.
This is one of the best ways to make your website feel fast while actually being big and slow. It is the content that is in the visible part of the screen of your users. A.k.a. the viewport or “Above the fold”. E.g. lazy loading images which on the bottom of the page.
When a user re-visits your website, make sure he doesn’t have the load the same resources twice!
Many items like logos, images, script, stylesheets etc can be cached, drastically reducing load time.
Re-audit using the same tools and exactly the same settings (e.g. location or throttling) to objectively measure your website speed.
Having a clear performance target and follow-up helps the team focus.
Document your website speed metrics:
Time to interactive: Q? Is it usable?
Ultimately, improving the speed of your website is about the impact on your KPI’s and your user engagement. Be sure the look at the impact on those metrics!
As you can see optimizing the speed of your website is a team effort! If you want a durable long-term approach, bring together your Web Analyst, CRO, Webmaster, Developer, and IT. Even if it is a temporary project…, that will help with the awareness of website speed by the proper stakeholders throughout the organization.
Want to share some thoughts? Don’t hesitate to drop a message at jonas.goddeeris@humix.be or contact Humix if you want to get started.
Sources:
Special thank to:
