In this tutorial we will give you some tips on how to improve the speed of your WordPress site. Having a fast site is essential if you want to provide your visitors with a good user experience, and, at the same time, rank better in search engines such as Google and Bing, as they take into account the speed of page loads at the time. to sort the results.
Enable dynamic caching
Adding a cache (think of it as data “preloading”) for dynamic content has a significant effect on the speed of your Wordpress site. Here You can find a comparison between 6 caching plugins for WordPress app users.
Enable gZIP compression
For reduce data size that are transferred between the server where you host your site, and your visitors, you can enable gZIP compression for both images, CSS (“style sheets”) files, and JavaScript (programming language). By enabling compression, the web server will compress the data being transferred (sort of like creating a ZIP or RAR file) so that it lands on every mobile or desktop in the smallest (and fastest) way possible. Once the transfer is finished, the browser that is being used will decompress the content before being able to process it, but given the current data processing capacity of both computers and mobile phones or tablets, this happens in milliseconds; namely, much faster than it would take to transfer the uncompressed data.
This is how we can significantly reduce the size of the data being transferred (sometimes to as much as 10% or less than the original file). The easiest way to enable gZIP compression for your images, CSS and JS files is to add these lines to your .htaccess in the root folder of your WordPress installation:
## ENABLE GZIP COMPRESSION ##
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
## ENABLE GZIP COMPRESSION ##
Note: Before making changes to the .htaccess, always keep a backup somewhere on your computer.
Use a CDN
Content Delivery Networks (CDNs) are links between servers that store copies of your site's static content (images, libraries) on all of their location nodes. So, an individual in Madrid will access your site via a server located in Spain (perhaps in Madrid itself), while an Argentinian will access your content with the server closest to his region. Then, the data is sent from the server closest to the user, instead of from your hosting provider's main data center.
For more information on this, see our plans from Cloudflare CDN.
Optimize your images
Images are an essential part of the aesthetics of any website, but it is even more important to have them optimized. In most cases, on sites with multiple images it is the images themselves that slow down data loading the most, especially since an unoptimized image can weigh over 100kb, or much more.
Images are measured by size and weight. The size refers to its dimensions in pixels (example, 500px wide by 200px tall), while the weight it is merely how much the file is in kilobytes.
Use images with the appropriate size and weight. This implies, among other things, do not upload large images (for example, photos that are 1000 pixels wide) by letting Wordpress scale them to present them in smaller sizes. Make sure your photos and images are never larger than the actual size displayed on the screen (remember, Wordpress can display a giant image in a small sector of the screen, reducing its virtual presentation with a simple HTML command; To check this, just load a site with a desktop computer, position the mouse pointer over the image, right click and choose "view image". If when you view the image alone, it appears larger than the one you were viewing before, then that image is the wrong size for actual display.)
And now Let's talk about the weight in kb: An option to significantly reduce the weight of the images that you upload to your media library, and automatically, is by installing the smush-plugin.
Smushing compresses the images so that they weigh less, altering little or nothing their quality, but, in addition, it will remove from your JPGs (and other formats of bitmaps) certain data hidden but present: the date of creation of the image, the camera used for the photo, the gps coordinates, the angle of a lens and others are examples of a lot of information that hides a simple bitmap And we didn't even know it existed.
If possible, use sprites for your themes, and no, we do not mean the soda. The use of sprites is a CSS technique that uses a single image to display multiple layout elements on pages. This way, instead of loading dozens of small images (making requests to the server for each one), the images will be opened with a single request. sprites is a good etiquette when choosing your theme, so keep it in mind when looking for or buying themes.
Compress your JavaScript and CSS files
Compress CSS and JavaScript files (method minify, in the jargon) means that all unnecessary data from them, such as double spaces, empty lines, hidden comments in the code, and so on, will be removed from the files, greatly reducing their size. There's a lot online tools which you can use for free to activate the “minify” method that compresses the files. If you are already using the plugin W3 Total Cache, you have an option to automatically minify your theme's CSS and JS files. Here you can find a guide on Installation and Configuration of W3 Total Cache that will explain this process step by step.
Take advantage of browser caching
Leveraging browser caching means you can specify how long your visitors' web browsers will store your site's images, CSS, JS, and flash files in their own caches. This is useful for the recurring visit, and in practical terms means that a web browser will not re-download certain information from the server when it already pre-exists on your hard drive. Specifying the cache time, or manipulating it in your favor, is an excellent way to stipulate and/or lengthen the number of days that any browser will keep these files. If you don't, browsers delete images at a default time, but if you know that certain content on your site doesn't change for months (eg, the cover image of a note), then it's useful to trade over time. of the cache, to extend it as much as possible.
You can add these lines to the .htaccess to enable this manipulation technique.
## LEVERAGE BROWSER CACHING ##
ExpiresActive On
ExpiresByType image/jpg “access 1 year”
ExpiresByType image/jpeg “access 1 year”
ExpiresByType image/gif “access 1 year”
ExpiresByType image/png “access 1 year”
ExpiresByType text/css “access 1 month”
ExpiresByType application/pdf “access 1 month”
ExpiresByType application/x-javascript “access 1 month”
ExpiresByType application/javascript “access 1 month”
ExpiresByType application/x-shockwave-flash “access 1 month”
ExpiresByType image/x-icon “access 1 year”
ExpiresDefault “access 2 days”
## LEVERAGE BROWSER CACHING ##
Optimize your WordPress database
It is good practice to optimize your WordPress database from time to time. You can think of this as running a disk defragmenter on your local hard drive (and if you don't know what that is, don't worry). There are many alternative ways to optimize your database. If the hosting company you hire allows you to use the cPanel administrator, then you already have a very easy tool to achieve it: PHPmyAdmin (and now we are going to explain step by step how to do it with this tool). But if you don't have cPanel with your hosting plan, you can install plugins to achieve it, and a good example is admin, a very easy to use plugin with on-screen instructions.
Optimizing my wordpress database with PHPmyAdmin
Enter your address cPanel (probably yoursite.com/cpanel either cpanel.yoursite.com). Once inside, look for the PHPmyAdmin icon.
Once inside the phpMyAdmin interface, select the database that you have created with your Wordpress installation. In this case, “infoloco_infoDB” was placed as an allegorical name.
You will see a list with all the tables. Scroll to the bottom of them to find the “select all” and “optimize table” options. Look at the screenshot to guide you.
The moment you click on “optimize the table”, the process will automatically begin. Do not panic: depending on the size of your website, it can take between seconds and a few minutes.
When the process is finished, you will see the message “Your query was executed successfully”. And that's it!
You already have a lot of information and tools to start optimizing the content of your site, gain speed and climb positions in the search results. Let's do it!
Leave a Reply