Whether you’re just starting your first WordPress blog, or you already have an established WordPress blog, you no doubt will have plenty of images in your media library over time. Lots of images that are too large in size can cause your site to run slowly. Image optimisation is something that you can do to reduce the amount of time it takes your site to load. There are also other potential benefits such as increasing your Google Page Speed score, which may increase your Google ranking. With some simple WordPress plugins and a few handy tips and tricks, it’s very easy to do and doesn’t take too long.
WordPress Plugins for Image Optimisation
Smush Image Compression and Optimisation
Award-winning Smush Image Compression and Optimisation plugin for WordPress by WPMU DEV is a superb tool for image optimisation. Not only can you optimise any new images or existing images on your site using lossless compression techniques, you can also resize your images too! Simply enter a maximum width and height and your large images will scale down as they are being compressed.
EWWW Image Optimizer
EWWW Image Optimizer is another great plugin to optimize and compress your images without losing any of the image quality. EWWW also optimizes your images as you upload them so you don’t need to make a conscious effort to optimise your images every time you add them to the media area. In addition to this, you can also optimize all the images you already have in the WordPress media library with just one click.
Regenerate Thumbnails is another great plugin to help you optimize any images you already have on your WordPress site. This is great to use if you change the dimensions of your images or if you switch to a different theme which uses a different featured post image dimension.
Each of these plugins are really handy for optimising your images either when or after you upload them, and we recommend you check them out.
Uploading your files in the right format is really important to understand. If you are uploading computer graphics such as line drawings, text and logos, then using PNG is the best format to use. This is because PNG is a lossless compression format so your text, graphics and logos will still appear crisp and sharp and you will not lose any quality. If however, you are uploading photographs and images that contain a lot of colour, then JPEG is the best format to use. This is because JPEG is a lossy compressed file format which means the images load faster due to the compression.
Using the Alt Attribute
Making use of WordPress’s built-in Alt field is great for SEO. Think of how a search bot indexes a site; it looks through your website pages and reads its content. When a search bot comes to an image, however, it obviously isn’t able to see what the image is. This is where the alt attribute field comes in. The alt attribute allows you to add a description to your image so the search bot can read what the image is about. This is really great for SEO and is highly recommended.
Naming your Images Correctly
Naming your images is important for both your own reference and for SEO optimisation. Using the correct terms when naming your images can have a big impact on how they rank, so this step should be considered carefully. You can also add any relevant keywords to your image file names to improve your overall SEO score.
Uploading images at the correct size
Uploading images at the correct file size is very important for quality and load time performance. This is the first step in image optimization and is worth considering before you add your images to the media library. Huge image sizes in the thousands of pixels are not ideal! If each image in your media library is exceptionally large, the performance of your blog will be compromised considerably. Therefore you should resize your images on your computer before you upload them to your blog. If for example, you need to upload a thumbnail image at 250 x 250px, then you should export the image at that size before you upload it. This will save you and your user’s valuable bandwidth which will decrease load time and improve Google Insight scores. Result!
To make your logo appear crisp and sharp on all screens you simply need to create two versions of your logo, the normal size version and then another version at exactly double the dimensions. You then need to save your two logos with the same name but adding @2x to the file name of the larger logo. So, for example, you would have logo.png and firstname.lastname@example.org. You can then upload both logos to your media library and use the smaller of the two logos within your theme.
Using a Content Delivery Network (CDN)
This one covers both images and other content on your website and is worth looking into.
What is a Content Delivery Network (CDN)?
A CDN is a string of servers that hold your content in many locations across the world. What this means for your users, is much faster load times as the content is provided by the server that is closest to their location. This is useful because if you have content on servers in the U.S, Australia and France, and someone views your website from the U.K, the content will be delivered by the server that is located in France as that is the closest server to their location. Amazon, RackSpace and MaxCDN all provide great CDN’s at affordable prices, and if you want a more comprehensive list of FREE content delivery networks to get you started, check out the link provided.
What do you think about image optimisation?
We love hearing from you here at Sculpture Qode and welcome all your comments! Let us know what you think about image optimisation (or anything else for that matter) in the comments below.