How to significantly improve the speed of your website
Loading speed of your site is an important ranking factor in Google’s search engine eyes. This can be improved with the help of a specialist, but if your site is built on WordPress, I have good news for you. You can improve your Page Speed score!
What is Page Speed Insight?
Page Speed Insight is a product offered by Google, meant to offer support to any webmasters who want to improve their site’s performance, both on mobile devices, and desktop.
How does it work?
Page Speed Insight measures the time elapsed between when a user accesses a new page until the content is rendered by the browser. Score that a site can make is between 0 and 100 points. As it is higher, the better for site performance. Any score over 85 points is a good score, and scores under 85 points in need of improvement.
Why you need a good Page Speed result?
The purpose of the Google search engine is to give users the most relevant results and the best experience possible. Nobody wants to wait for seconds until a site is fully loaded, and in this case, is why the loading speed of a website has become a ranking factor.
How to improve the Page Speed?
To begin, visit Google Page Speed Insight and see what stage is the score of your site, both on desktop and mobile.
Depending on the score you get, Google will make some suggestions for improvement, divided into three priority indicators:
Suggestions for improvement indicated by red exclamation mark have the greatest impact on your site, and if you solve those problems for sure your score will increase significantly.
The ones marked with a yellow exclamation mark to have little impact, and Google recommends repairing those problems only if it doesn’t involve a lot of effort.
And finally marked with a green check mark indicates that there are no major problems.
Most often fixes recommended by Google are related to:
- removing JavaScript and CSS resources that block content
- leverage browser caching
- reducing server response duration
- reducing the space occupied by JavaScript code
- optimizing images
- minimizing CSS file size
- HTML file size reduction
- Gzip compression enabled
All these suggestions offered by Google can be implemented with WordPress plugins, so you will not need the intervention of specialists.
1. Resizing and compressing images
It’s one of the easiest things you can do with the greatest impact.
Each image that would be included in the web page should be resized accordingly: if the maximum width of the web page where the picture is found is 768px, then the image is resized to this size.
After resizing, the image is compressed to remove any data on the device used, time and other things stored in the image that is not useful.
2. Enable gzip compression and browser cache
This is done at the server level by activating Gzip compression or manually adding the following lines to your .htaccess file:
[markdown]
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddType x-font/otf .otf
AddType x-font/ttf .ttf
AddType x-font/eot .eot
AddType x-font/woff .woff
AddType image/x-icon .ico
AddType image/png .png
AddType text/css .css
[/markdown]
3. Avoiding redirect sites
Automatic forwarding of one page to another contributes to a negative experience. Eliminate any HTML or PHP redirect and replace with the desired page.
4. The elimination of the Java Script and CSS files that are blocking the visible content
Java Script files are included in the footer and rarely need them to be present in the head section. The site structure can be split into sections and only the necessary CSS to display the first section or the visible content, to be displayed.
5. Compressing files CSS
If you have multiple CSS files, is best they added in a single file for compressing.
Try using: https://www.giftofspeed.com/css-compressor/
This online CSS compressor can take your CSS scripts and automatically detect and remove older CSS scripts that modern web pages do not use to display your web pages. It also minifies unnecessary large CSS rules into much smaller code. The actual style and layout of a web page will not be affected by using this compressor.
By removing or minifying all the unneeded code it reduces the file size of your CSS scripts. Having a smaller sized CSS script means your visitors can load your website faster because they need to download fewer kilobytes.
6. Compressing HTML files
Once the site is developed, compress all the HTML code, similar to the CSS.
Try using: https://htmlcompressor.com/ or http://www.textfixer.com/html/compress-html-compression.php
Textfixer – compress HTML – this online HTML compression tool will save space in your HTML files and make them much smaller by doing the following:
- Removing text line breaks from the code
- Removing tab spaces
- Replacing double spaces with single spaces
7. Compressing Java Script files
Try using: https://jscompress.com/
JSCompress.com is an online javascript compressor that allows you to compress and minify your javascript files. Compressed javascript files are ideal for production environments since they typically reduce the size of the file by 30-80%.
There are a number of reasons why compressing your javascript files is a good idea:
- Quicker download times for your users.
- Reduced bandwidth consumption of your website.
- Reduced number of HTTP requests on your server when combining many javascript files into one compressed file, thus reducing the server load and allowing more visitors to access your website.
- Comments and whitespace are not needed for javascript execution; Removing them will reduce file size and speed up script execution times.
8. Reduce server response time
It’s a very good indicator to discover if the server slows down the loading speed of your site. What you can do is to discuss with your hosting company when this occurs.
7 WordPress plugins that will help you improve your site’s performance
47% of users abandon a site that loads in more than 2-3 seconds. If you want to have happy users, learn how you can use the following WordPress plugins to significantly boost the performance of your site.
1. Tiny Compress Images
Download address:
https://wordpress.org/plugins/tiny-compress-images/
Alternatives:
- Smush Image Compression and Optimization
- ShortPixel Image Optimizer
- WP Smush
- Optimus – WordPress Image Optimizer
Tiny Images Compres helps you save up to 40-70% space on the server and have a site that loads faster, compressing images that you’ll automatically upload.
Each image contains information regarding the type of camera used, the date it was taken, the author and much other information that most times we don’t need. These are preserved even when you resize an image, for example, maintaining the increased number of KB.
Compressing images is the one that removes this information while optimizing picture quality with no visible quality losses.
Some of its features:
- Automatically optimize new images on upload
- Optimize individual images already in your media library.
- Easy bulk optimization of your existing media library.
- Resize large original images by setting a maximum width and/or height.
- Preserve copyright metadata, creation date and GPS location in the original images.
- Supports compression of animated PNG.
- WooCommerce compatible.
- Optimize and resize uploads with the WordPress mobile app.
- Dashboard widget with your total savings.
- No file size limits.
2. P3 Profiles
Download link:
https://wordpress.org/plugins/p3-profiler
Without a deep knowledge, most times you install a lot of plugins that will help you in what you want to do (from adding a form, galleries and other things).
The more plugins you have installed, the possibility that your site will load slower grows. Some plugins, even if not using them unnecessarily consume resources and apelază file or database.
But you can rest easy now, P3 Profiler scans your entire website and discover what plugins work hard and slow down your site. Once you have discovered, you can uninstall them from your site.
3. Wp-Optimize
Download link:
https://wordpress.org/plugins/wp-optimize/
Alternatives:
- WP-DBManager
- Optimize Database after Deleting Revisions
- WP-Sweep
If you are concerned about the performance of your site and the experience that users have when browsing your site, then this plugin will help you get a site that works quickly.
WordPress stores all the information in the spam comments and revisions information about plugins. Optimizing, preserving and using only what you need, you’ll get a better website.
Before running this plugin, make sure that you have a database backup if something didn’t work properly.
4. W3 Total Cache
Download link:
https://wordpress.org/plugins/w3-total-cache/
Alternatives:
- WP Super Cache
- WP Rocket
- WP Fastest Cache
40% of users abandon a site that loads in more than 2-3 seconds and the chances that they will come back are quite small. That is why speed is important when you want to have happy visitors.
W3 Total Cache generates static files that display them as you need without loading your entire site. Before running this plugin, make sure that you have a database backup if something didn’t work properly.
5. BJ Lazy Load
Download link:
https://wordpress.org/plugins/bj-lazy-load
Alternatives:
- Lazy Load
- Rocket Lazy Load
- a3 Lazy Load
- Speed Up – Lazy Load
- Crazy Lazy
Images are the main factor for a site loading slowly and usually they are loaded simultaneously.
Lazy Load images load depending on your action, the concept is simple: just upload the original images that the user sees when entering the site, then scroll while giving upload photos from the visible area.
6. RICG Responsive Images
Download link:
https://wordpress.org/plugins/ricg-responsive-images/
This plugin works by including all available image sizes for each image upload. Whenever WordPress outputs the image through the media uploader, or whenever a featured image is generated, those sizes will be included in the image tag via the srcset attribute.
Together with the compression plugin, you can get effective optimization of images.
7. GTmetrix Plugin for WordPress
Download link:
https://wordpress.org/plugins/gtmetrix-for-wordpress/
The plugin analyzes and generates reports on the performance of your site. Give an overall score of the speed and, the total size and other useful information about each file.
There is also the online version which you can access here.