Increase Website Speed is extremely important. It improves user experience, increases conversion rates, increases user engagement and even boosts your site in SERPs. It is especially important when it comes to mobile traffic.
After all, no one wants to go from a smartphone to a page that weighs 4 MB and wait for it to load for ages. Therefore I developed a simple 5 step guide to increase website speed test.
So what can you do to speed up website loading:
1. Reduce the Size of Site Pages
Too “heavy” content takes a long time to load. By reducing the size of your site pages, you automatically increase its loading speed. Also, you save money if the hosting provider charges you traffic fees.
To reduce page size, first, use HTTP compression. This reduces the size of text resources that include HTML, CSS, and JavaScript elements by 50% or more. To compress data of the HTTP protocol, technologies zip, gzip, and others are used.
To reduce the page size, ask your hosting provider or server administrator to enable the HTTP compression option. To evaluate the effect obtained, use one of the compression testing services, for example, this one. If the server administrator did everything correctly.
2. Reduce the “weight” of the Graphics
Graphics often represent 80% or more of the total page size. Therefore, it is very important to properly optimize the published photos. The following guidelines can help you reduce image size by 50% or more:
Publish photos in JPEG format, avoid PNG format. The JPEG format allows you to highly compress images without losing quality. For example, on the day of the presentation of Windows 8, Microsoft published a photo in PNG format on the main page of the site, the “weight” of which was 1 MB. A photo of similar quality in JPEG format is approximately 140KB. Do not overuse the PNG format for transparency. The transparency effect is beautiful, but not always functional.
Choose the quality level for JPEG pictures correctly. By reducing the quality of the photo by 25-50%, you will hardly notice the difference compared to the original image. This will significantly reduce the “weight” of the illustration.
Clean graphic files from digital waste. Various photo editors that your designer probably uses leave a lot of different data in the file, for example, comments, working versions of an image, unused palettes, etc. Your readers don’t need this digital junk. To clean up the file, use Pngcrush, or Smush.it.
While reducing the “weight” of the photos, try to maintain the aesthetic appeal of the site. Users and search engines value visually attractive resources more.
3. Simplify JavaScript and CSS
Using special JavaScript and CSS simplifiers reduce the weight of the corresponding elements more than standard compression technologies such as gzip. Simplification services remove unnecessary elements from the code and also shorten the names of functions.
To simplify the code for JavaScript and CSS elements, use software tools or online services such as the Online Javascript Compression Tool or Online JavaScript / CSS Compression.
4. Reduce the number of Browser Requests
The more requests the reader’s browser sends when loading a page, the slower it loads. To reduce loading times, you need to create conditions under which the visitor’s browser sends as few requests as possible. This can be achieved by reducing the number of photos, JavaScript files, codes of third-party resources and services, etc.
Have you ever wondered why Google’s homepage looks so austere? Probably one of the reasons is the desire of the developers to increase the download speed.
- Google saved on frills and curls but increased page load speed
But if you haven’t achieved Google popularity, a blank page on your site can upset your users. If the recommendation to delete all unnecessary is not quite suitable for you, use the following tips to reduce the number of browser requests:
Allow browsers to cache data. If your site’s pages are static, there is no need to “force” visitors to reload their content each time. Ask your server administrator or hosting provider to enable the option to cache photos, CSS, and JavaScript elements. To check the result of this action, use, for example, the Redbot service.
- Caching is not enabled yet
Combine and compress CSS and JavaScript files. By combining these elements, you significantly reduce the number of browser requests. This method is suitable for static pages. To combine CSS and JavaScript files, use special services and software like CakePHP.
Combine small photos into CSS sprites. This is especially useful for assets that have many icons, buttons, and other small images. Special services allow you to combine them into a single file called a CSS sprite. Use the SpriteMe tool to test the effectiveness of this recommendation in practice.
Please note that by enabling the caching option, you do not affect the website loading speed on the first visit. However, on return visits, the website loading speed will pleasantly surprise your customers. Unless they use cleaning utilities like CCleaner, of course.
5. Reduce the Distance between the Site and Users
If your hosting provider’s server is located in Singapore, visitors from St. Petersburg will have to be patient while waiting for the page to load. This problem is especially relevant for sites with “heavy” content, which are visited by users who are physically remote from the server over long distances. To address this issue, use Content Delivery Networks (CDNs) such as Amazon CloudFront or Akamai.
Hope this article about increase Website Speed was helpful. I managed to get 97A speed score on GTmetrix.com. You can test my website and see for yourself. Let me know how much you got.