The speed of a website has become a key element in the success of any digital project or company with an online business. Whether it is a corporate site, a blog, an eCommerce or a showcase site.
Load times directly affect the user experience, search engine rankings, and conversions that result from increased visibility, notoriety, and authority in one’s industry.
Today’s visitors, who are used to increasingly fast and fluid browsing, are little patient with sites that are slow and may abandon a page if the loading time is too long.
Therefore, optimizing the speed of your site is important to ensure that people stay and interact with your content. Also because Google values abandonments (Bounce Rate or bounce rate), as a negative experience, and takes this into account when ranking sites in the various SERPs (Search Engine Results Page).
That’s why it pays to do a website performance check and, if necessary, implement some optimization techniques, such as compressing images, reducing unnecessary code, implementing browser caching, and optimizing source code. These practices can further help improve loading speed and the overall user experience on your site.
With the use of suggestions and guidance from some speed testing tools, critical points can be identified to take corrective measures and improve the overall results.
In this article you’ll learn how to optimize the speed of a site, both on desktop and mobile, what slows it down, how to control performance to improve user experience, search engine rankings and conversion results.
Website speed test: recommended tools
One way to evaluate the performance of your website is to subject it to speed tests. A recommended tool for this purpose is Google’s PageSpeed Insights. To learn more read the article we wrote on how to interpret PageSpeed data.
This tool analyzes your site and provides an assessment of its performance, identifying potential problems and suggesting solutions to improve loading speed.
To be specified, to tell the truth, that the results of the test are not always the most reliable, in the sense that as always you have to evaluate every aspect in the light of awareness. The tool expresses its score (0-100) on the basis of analyses that are not always true.
Therefore, it is good to test with other analysis software.
In addition to Pagespeed Insights there are other tools for testing site speed, among them, GTmetrix, Pingdom Tools, and WebPageTest.
Some allow you to choose the country from which to test, and this contributes to more truthful data.
All evaluate factors that Google considers fundamental, such as loading time, the size of resources, the optimization of HTML code, the essential signals.
Common errors and solutions to speed up the website
Delete unnecessary Redirects to reduce redirections
Redirects can negatively affect the loading speed of the site. They are implemented to prevent visitors from landing on a 404 page, non-existent, but it is true that an excess of redirections slows down the loading time and the speed of the site.
The solution is to minimize the number of redirects and make sure they are necessary and well configured.
Check for unnecessary redirects and replace them with direct links to the landing page. Also, consider using 301 redirects instead of 302, as the former are permanent and can be cached in your browser, thus reducing loading time.
Enable and leverage browser cache to improve your site speed
Use the “Cache-Control” HTTP header to specify how your website’s resources should be stored in the user’s browser cache.
The browser cache is thememory in each browser that stores files that do not change, which remain static on the website, among them the logo, product images, CSS files, etc.).
By storing the files on the user’s computer or device, you will improve the loading speed of your site, as the files will not have to be downloaded every time, on each new visit.
Use a cache plugin to improve the performance of a WordPress site
If you’re using WordPress as a platform for your website, you can leverage caching plugins to improve your site’s speed.
Some plugins, such as WP Super Cache, W3 Total Cache, and WP Rocket,allow caching of generated resources, reducing the time it takes to dynamically generate content for each request. This means that visitors will receive content more quickly.
Choose a good hosting
Choosing a suitable hosting plan is another important factor to improve the loading speed of your website.
A low-priced host can give you the idea of convenience, but in the long run you’ll find that the problems, with an initial saving, are many. And your site is at stake. Because even if it optimizes everything, a slow server still penalizes speed.
Select a reliable provider that offers high performance and adequate resources to handle the heavy traffic load. Here’s how to transfer your domain to new hosting.
Use a Content Delivery Network (CDN)
If your site discloses content that reaches different regions of the world, so if your services and products also travel abroad, and your pages are accessible by users from other countries, consider a CDN.
In practice, when the server receives a request, the one closest to the user is used, benefiting the reduction of latency time and loading speed.
A Content Delivery Network is a worldwide distributed network that stores a copy of your website’s resources, such as images, scripts, and CSS files.
Optimization of the site resources
Reduce the weight of images and compress them
Due to their weight, images can be a cause of slowing down a page. Therefore, it is important to optimize them to reduce the file size, without compromising visual quality.
In this regard, use more current and web-friendly image formats, such as JPEG or WebP, SVG, and compress images using software such as Photoshop, Gimp or TinyPNG (for both PNG and JPG), an online platform.
Refer resources that block the display
View-blocking resources, such as JavaScript and CSS, can delay page loading. It is advisable to delay the loading of these non-critical resources or to use techniques such as CSS inlining to reduce initial rendering times and allow faster display of the main page content.
Choose a lightweight and optimized theme
Choosing a lightweight, optimized template can go a long way toward optimizing site speed.
Avoid heavy, complex themes that take a lot of resources to load. Instead, opt for optimized themes with clean and lightweight code that allow for quick display of content.
Among the free themes optimized for WordPress, you can consider
- Astra
- GeneratePress
- OceanWP
- “Schema”
- “Neve”
All five have free versions available on the official WordPress repository. However, some of them also offer paid versions with additional features and advanced support.
Among the Page Builders, on the other hand, the most highly rated to date are:
- Avada
- Beaver Builder
- Elementor
- Divi Builder
- Thrive Architect
- WPBakery Page Builder (ex Visual Composer).
Reduce the execution time of JavaScript and CSS
The execution time of JavaScript and CSS can affect the speed of the site. One solution is to combine JavaScript and CSS files and minimize unused code.
Another good practice is to place JavaScript files at the bottom of the HTML document and CSS files at the top, to ensure progressive loading and optimize performance.
Minify CSS, JavaScript and HTML
Minification consists of removing blanks, comments, and unnecessary characters from CSS, JavaScript, and HTML files. All this useless source code is read by Google’s spiders, a waste of time.
To optimize speed, you can reduce the size of HTML, CSS, and JavaScript files by removing blank spaces, comments, and unused code. This process reduces file size, allowing pages to load faster. You can use online tools or special plugins to reduce file sizes without altering them in an automatic and simplified way, such as UglifyJS for JavaScript or CSSNano for CSS.
Implementation of GZIP compression
GZIP compression reduces the size of files sent to the user’s browser. By compressing HTML, CSS and JavaScript files via GZIP, you can significantly reduce page load times without loss of quality. Check with your hosting for the configuration of GZIP compression.
All of these solutions are the answer to some metrics that Google has introduced over time to evaluate the performance of a website. Let’s see them.
Improve Core Web Vitals (Essential Signals)
The Essential Signalsrepresent a set of metrics defined by Google to evaluate the experience and interaction of web pages in their entirety, and not just in terms of site speed. These metrics have become another key factor for ranking on the search engine.
Read the guide to Core Web Vitals to go into detail about each metric and how you can resolve any related critical issues.
Content Layout Shift (CLS)
Content Layout Shift (CLS) is a metric that measures the visual stability of a web page during loading. It indicates how much visible content changes position in the rendering of the page, thus of the frequency of unexpected shifts in page content.
Among the elements that affect most, the loading of web fonts, such as Google fonts, iFrames (e.g., YouTube videos), and images
A value of less than 0,1 is considered good. A high value of CLS can cause a frustrating experience for users, especially if clicks or actions are performed accidentally due to unexpected content movements.
To reduce CLS, it is advisable to specify the size of content, avoid placing ads or elements that load asynchronously, and properly manage the page layout during loading.
Largest Content Paint (LCP)
The Largest Content Paint (LCP) represents the time it takes for it to loadthe largest visible content at the top, typically, of the page. This element can be an image, a block of text, or a video.
A low LCP value indicates that the main content is displayed quickly to the user.
To improve this parameter, you can optimize images, text, and videos, reduce server response time, use high-performance hosting, and reduce the weight of CSS and JavaScript files.
First Input Delay (FID)
The FID measures the interactive response time of the website, that is the time that elapses between the user’s interaction with the interface and the browser response (eg: click, scrolling, type in an input field) that displays the first content on the screen.
An ideal FID is less than 100 milliseconds, since this delay time is generally imperceptible to the user.
To resolve the possible problem related to this metric, action will have to be taken by reducing the execution time of JavaScript, the rendering of the web page, and the influence of third-party code.
In summary:
- Minify the code
- remove or reduce unused code
- cache optimization.
INP (Interaction to Next Paint)
This metric measures the response speed of a web page to a user input (mouse click, touch). refers to the response time of a page after user input. But it will become effective only in March 2024.
TTFB: Time to First Byte
The Time to First Byte is not part of the Essential Signals package, but nonetheless, it is a another important indicator for evaluating the performance and speed of a Web site, because a shorter TTFB represents a faster server response time to user requests.
In fact, the TTFB measures thetime it takes for the server to begin responding to the browser request. Essentially, it is the time between the moment the user requests a page to be opened and the moment the browser begins to receive data.
The TTFB depends on several factors, including network latency, server load, server speed, and website code efficiency.
To reduce TTFB, several measures can be taken, such as optimizing server code, using caches to reduce data access time, implementing a CDN network to distribute content closer to users, and, certainly, choosing a high-performance web hosting.
In detail, you can optimize with these interventions which I also report here, although some have been mentioned in previous paragraphs. But since these are interventions related specifically to this metric, I restate them here for clarity of information:
- Install the SSL certificate on your web server. The process varies depending on the web server you use (Apache, Nginx, IIS, etc.).
- Optimize hosting and web server – make sure your hosting has enough resources like CPU, RAM and bandwidth. Update the web server software to the latest version to reduce overhead.
- Optimize site code, reduce the number of (images, CSS, JS, fonts) required for each page by removing unnecessary code, compressing resources, using asynchronous loading for JS/CSS, etc.
- Merge CSS and JS files into a single file to reduce the number of HTTP requests. Minification removes gaps by reducing file size and increasing download speed.
- Enable GZIP compression for CSS, JS and HTML files (can reduce file size by up to 70%)
- It implements caching.
- Optimize the images
- Optimize SQL queries – inefficient SQL queries can slow down page processing and increase TTFB.
- Use a CDN to direct users to the nearest CDN server, improving speed.
- Redirect your site from the HTTP protocol to the HTTPS protocol. After enabling HTTPS, some site resources (images, CSS, JS, etc.) may no longer load correctly. Fix these links to make them point to HTTPS.
- Activate HTTP/2 protocol, more efficient than HTTP/1.1.
- Activates an updated TLS protocol.
- It uses optimized DNS. Services like Cloudflare offer optimized DNS that can route users to the fastest CDN server, improving TTFB.
Please note: HTTP/2 and TLS 1.3 do not necessarily improve TTFB, but they do make the connection more efficient.
Improving the overall performance of the website requires a combination of technical optimizations and marketing strategies, acting on several fronts.
Optimization also rests on a solid content marketing strategy, on the quality content that the search engine is increasingly evaluating, then with good copywriting, taking into account the searches (and attached intents) of people who are looking for consistent answers, based on experiences and knowledge of the world they are entering.
