Fast loading pages not only provide a better user experience, they also improve search rankings. Here are my favorite tactics.
Limit image size
Three factors are the main determinants of image filesize:
- Image dimensions in pixels
- Compression type (jpg, gif, png, webp, etc.)
- Degree of compression
First let’s discuss compression type. The short answer: use JPG for photographic images and PNG for images with large areas of precisely uniform color; this is mainly computer art such as most logos. Read more about compression types here: Choosing between JPG, GIF, PNG, and WEBP for web images. When in doubt, try each. (Be wary of using webp since Safari does not support it.)
The WordPress plugin Imsanity can handle the problem of resizing image dimensions and degree of compression. Once installed, you can configure it for the maximum size image you will allow and for the degree of compression, if JPG. JPG lets you control quality vs. file size. I configure it to leave PNG files as PNG and leave JPG files as JPG, and I trust the author (me) to know when to use each in creating the image before upload.
Be careful of plugins
Some plugins such as Imsanity are only active during editing of web pages and posts. They will not slow down your site. Plugins that control the appearance of pages or monitor user activity risk slowing your pages. Use them only if their value exceeds the price you pay in slower page loading. Use GTmetrix and Pagespeed Insights to monitor the affect of plugins on your page speed.
If you have access to CPanel, turn on the Optimize Website application to compress everything. This uses gzip compression for files sent to the visitor’s browser.
Wake Forest users: everyone with a website on sites.wfu.edu has access to CPanel, nicknamed “Dashboard.” Go to sites.wfu.edu, and click Dashboard. Login if requested with your WFU Google Mail credentials. Then look for Optimize Website.
These two compression methods are complementary. Use them both.
Install a website caching plugin
WP-Supercache is another plugin well worth installing. WordPress is a complex program that must to build each web page everytime a visitors hits it. That takes time. WP-Supercache saves a copy of the webpage that was built the last time until you make changes, and it can serve this cached version quickly.
Leverage browser caching
If a web page has not changed since the last time a user visited, then there is no reason to download a new version. Web pages load faster for repeat visitors if the page is saved in the browser cache. However, unless you specify how often a file may change, the browser may not cache it. Here is the way to cache your images and css files. You can add other file types such as html if you are more aggressive. If you are comfortable editing your .htaccess file (and if you know what this means and how to do it), add the following to .htaccess:
#Add expires headers by default
# Turn on the module.
# Set the default expiry times.
ExpiresDefault "access plus 2 days"
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
ExpiresByType text/css "now plus 1 month"
ExpiresByType image/ico "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 month"
ExpiresByType text/html "access plus 600 seconds"
Assessing your page speed
What are your speed tips?