Best ways to improve your website speed
Importance of a Website Speed:
When it comes to investing in a site’s improvements, the question of decision-makers is “is it costing me business?”. If the issue is your site’s speed, then the answer to this question is almost a BIG YES!
Improving your website’s speed brings several benefits. Let me share some stats with you.
- 40% of people don’t wait for a site to load for more than 3 seconds and leave it immediately.
- If the page loading speed of a site on mobile is more than 5 seconds, 90% of people are more likely to leave the page even before it is fully loaded.
- According to the BBC, they lost 10% of visitors for every second added to the loading speed.
- Pinterest observed a 15% increase in sign-up rate after improving its website performance.
A website with a faster speed improves user experience, and therefore, investing time, recourse, and money in continuous monitoring and improving your website performance can make your users and stakeholders both happy.
Tools Required for Website Speed Test
- PageSpeed Insights
- To get an accurate set of results, use the options that represent your website the best. For instance, if you can choose a location, select the one that aligns with your audience location closely if not completely.
- Many tools provide data about both desktop and mobile speed. If this option is available, analyze both sets of information as mobile website speed is usually slower than desktop, and thus, requires more consideration.
- Testing only the homepage is not a smart move. Analyze your analytics and test your most visited or top landing pages as well. Many websites have different features between pages and that can affect loading speed differently. Therefore, perform tests accordingly to ensure a better user experience.
Key Website Speed Metrics
- Load Time – the overall time a page takes to load
- Page Size – the size of all assets that are required to load a page
- Total Blocking Time (TBT) – how low users are blocked from interacting with a page’s element
- Time to First Byte (TTFB) – the time required by a browser to receive the first byte of content from the server
- Number of requests – requests made by the browser to the server like fonts, images, etc.
- First Contentful Paint (FCP) – how long does it take for a user to see the first bit of content on the screen
- LCP (Largest Contentful Paint) – the time it takes for the largest text block or image to appear on the viewport
- CLS (Cumulative Layout Shift) – measurement of the amount of layout shifting during page load
- FID (First Input Delay) – how long does a browser takes to start responding when users interact with the page
How to Improve your Website’s Speed
Now as you have data and a good understanding of all metrics, you need to identify opportunities to make improvements to your site. Most testing tools identify the issues and make recommendations, thus making things easier for you.
Some of the common culprits of a slower website speed are:
- Server Speed – a slower server response adversely affects several metrics including LCP and TTFB. Try to explore options for server optimization and any other database to ensure quick responses, especially around cache and compression.
- Images – behind large page sizes and increased LCP time, images are usually the main culprit. Make sure to optimize dimensions and file sizes for all images present on your website.
- Third-party Code – some third-party codes like plugins, widgets, and codes can increase load time if they are not managed properly. Be careful what scripts are you using on your website and optimize them wherever possible.
- Redirects – redirects increase the TTFB, so try to avoid them where unnecessary.
- Web fonts – using too many fonts on a page can increase FCP, especially if a visible fallback is not in place. Try to limit the number of fonts used on a page and try optimizing them with the best practices.
- Styles and Scripts – code files that need to load before the content can block loading and are known as “render-blocking”. Render-blocking increases your site’s FCP and LCP, therefore, keep them limited and make sure that all assets are properly compressed. Scripts that need to load after the content should also be optimized so they can load as quickly as possible. This is important because the longer a functionality takes to load, the higher your FID, CLS, and TTI metrics will be.