One of the many things that proper WordPress website maintenance includes is staying on top of the plugins that are installed and any other little “extras” that have a way of piling up. But as the code piles up, it can slow your website down. And when a webpage loads slowly, people leave. That can mean lost business leads, customers who abandon shopping carts and new members who never sign up for your subscription. Google also takes page load times into account as part of its ranking algorithm, and beginning in July 2018 it will take mobile page speed into account for mobile results. Bad news for slow websites. We are going to go over a few of the major culprits that can slow a website down and how to improve WordPress website speed.
Image Size
Heavy (large file size) images are the most common culprit we see for slow page load times. A lot of website owners don’t even realize that they need to pay attention to the size of the photos they are uploading. Most people just take images from their phone or from their photographer and dump them into the media library. That is a big no-no if you if they want to improve WordPress website speed. Professional photos are actually the most problematic because they are generally high resolution and a large physical size (width X height), and taken with high quality print in mind. You don’t need that kind of quality for a website.
While a photo you get from a photographer or your digital camera might be 5MB, you probably want to reduce that file down to 0.1% of its original size, just 50KB!
A good rule of thumb is that large, higher quality images, like a fullscreen “hero” image that splashes across a homepage, should be no more than 100kb and smaller images, like headshots, should be 30kb or less.
How to Reduce Image Size
If you have a whole pile of heavy files, there are a few ways to reduce the size and optimize them for the web. The main things that you want to do are:
- Check the image resolution. Images used on the web should not be above 72 dpi (dots per inch).
- Reduce the number of different colors with lossy compression. Essentially, this eliminates some minute differences in shading. Usually you can do quite a bit of compression and not notice the difference from the original.
- Remove unnecessary meta data with lossless compression. The image file size will be reduced without losing any quality.
- Reduce the physical size of the image. You can do this by adjusting the image dimensions from something like 3500px X 3500px down to 350px by 350px, depending on what kind of image you need.
- Save for web. A lot of image editors have a special setting to compress images and optimize them for display on websites.
- Using Google’s WebP image format.
Tools for Reducing Image Size
Luckily you don’t need to be a Photoshop whiz in order to go through these steps.
- Online tools such as Reduce Images and Kraken
- Software such as Caesium
Image File Formats
- JPEG / JPG – Best for photos. You’ll need to play around with adjusting image quality upon saving to get an image that is as light as possible without noticeably sacrificing quality. JPEGs cannot have transparent backgrounds.
- GIFs – Great for simple graphics like icons, low quality images, solid blocks of color or animated gif files. They can have transparent backgrounds.
- PDFs – Ideal for higher quality files and texts like an eBook or brochure, logos, or other images that you need on a transparent background.
- WebP – a new format created by Google that creates images that are about two-thirds the size of similar jpegs. It’s currently supported on most of the major browsers, but is not as universal as the jpeg or gif format. That said, if set up properly, any images embedded in the WebP format won’t display as broken images in unsupported browsers but will rather will display in the jpegs or gif format.
Caching
Browser caching can help to reduce the number of requests the browser needs to make. It creates static files from your dynamic (changing) files and saves them on the user’s computer. By doing so, it allows the browser to check for any new or updated files and to download only the new ones, instead of requesting everything on the web page each time from scratch. The result is that the web server responds to fewer queries, and fewer files need to be sent to the user’s computer. It’s a sure way to improve WordPress website speed if done correctly.
There is server-side caching that some hosts offer. Most Managed WordPress hosting providers and same Shared Hosting providers offer caching, and it can make a big difference.
Additionally, client-side caching via plugins offers another level of performance optimization. Some of these plugins also offer minification and compression (see below for more on those).
All the Plugins
It’s easy to go plugin crazy. Who wouldn’t want to have more control over their widget displays, add newsletter signup pop ups, a visual page element editor with drag-and-drop functions, and fun doo dads on the admin dashboard? It’s like being a geeky kid in a geek candy store!
Plugins can add fun new functions and features to your website, but every time you add a new plugin, you pile on new scripts that need to load. Poorly coded or outdated plugins can slow down website performance dramatically. That’s why we include scheduled reviews of plugin use as part of our website maintenance packages. It is important to regularly evaluate your installed plugins, remove any that duplicate functionality, are out of date or are no longer used. Removing even one or two unnecessary plugins can go a long way to improve WordPress website speed.
Minification
Lines of code typically have all sorts of white space in order to make it easier for the coder to read. However, web browsers can read the code without it. Minification removes all data that isn’t required in order for the code file to be executed. As a result, the file is smaller and the code loads more quickly.
Server Location
Your website files and database are hosted on a special kind of computer called a server, that connects it to the great world wide web. The physical location of that server can affect loading times. For the best result, your server should be located near your target audience, or you should use a Content Delivery Network (CDN). A CDN takes a snapshot of your website’s files and stores them in various geographical locations around the world. Then it servers up the closest one.
Hosting Package
Most small businesses and organizations use a shared hosting account. It’s the cheapest option and more often than not it gets the job done. However, sharing resources means that the speed of your website is affected by the number of people using your server. This includes users on other websites you are sharing with. They might have traffic peaks or other things that in the end will affect your site performance and speed.
Website Speed Tools and Diagnostics
- YSlow – Available as a browser add-on tool
- Google PageSpeed Insights – Google’s online tool
- GTMetrix – another popular online tool
