If you’re building a new WordPress website, you need to think carefully about the type of content you include and how it’s presented.
For example, adding images to your WordPress website is a great way of boosting the user experience, but you need to make sure that they’re well-optimised.
Poorly optimised images can result in slow website speeds, a poor SEO score, and a high visitor bounce rate. With this in mind, I decided to put together this list of the best ways to optimise images for your WordPress website.
1. Use The Right Image Size
When you insert pictures into your posts or page content, ensure that you’re using the right size. If you only need a small image, then only insert a small image. Similarly, make sure that you’re using high enough resolutions for important or very detailed images.
For example, if your WordPress theme displays images at 600 x 600 pixels, but your image dimensions are 1024 x 1024, you’re just adding unnecessary pixels that will eat up your space and reduce loading speed.
Photoshop and GIMP can help you crop and resize your images. That said, you can also do the same using simpler tools like Paint (for Windows), Preview (for Mac), and Canva (browser-based).
2. Compress Your Images
It’s imperative to make sure that your images aren’t too large, otherwise they will take up too much server space and take longer to load. Compressing your images will reduce their file size without affecting their dimensions and without a noticeable loss in quality.
I always recommend compressing your images before you upload them to your WordPress site. This means that even if you have an image compression plugin, it will have less work to do so it doesn’t stress your server.
Image editing software such as Photoshop and GIMP can compress your images. Alternatively, there are also online image compressor tools that you can use for free.
If you want to compress images that are already on your website, installing an image compression plugin will do the trick.
3. Pick the Appropriate Image File Type
When exporting your images, choose an image format that’s suitable for your needs. The right image format will improve your website loading speed, SEO score, and user experience and take up less space.
WebP
Developed by Google, WebP is a fairly new image format that’s supported by most web browsers and image editing tools. Since it was created to replace JPEG, PNG, and GIF, it supports lossless and lossy compression, alpha transparency, and animation. WebP images also have a significantly smaller file size, so it’s the best choice for reducing website load times. Just make sure that your website builder supports it.
JPEG
JPEG is a great choice for photography, graphic design, and other websites with colour-rich and complex images. It supports 16 million colours, has a relatively small file size, and is supported by all image editing tools, browsers, and website builders. However, it loses image details during compression and doesn’t support transparency.
PNG
Just like JPEG, PNG supports 24-bit colour. What’s more, it supports transparency and utilizes lossless compression. The vivid colours and sharp graphics of PNG files come at a cost though since they typically have larger file sizes. This means that PNGs shouldn’t be your go-to file format if you want to boost your website’s speed and SEO rating.
4. Name Your Images Correctly
Your image names play a large role in helping search engines understand what your images and content are about, ultimately increasing your SEO value. It’s therefore crucial to use image names with short, descriptive titles that include relevant keywords.
Limit your image names to 5 words and use hyphens to make it easier for search engines to understand. For example, instead of “cateatingfish.webp”, a better name would be “cat-eating-fish.webp”.
5. Use Alt Tags
Similarly, alt tags also present a great SEO opportunity. On the surface, alt tags are designed to provide information about an image for those who are visually impaired or who decide not to load images for some reason.
However, alt tags are also scraped by search engine crawlers to make sense of what your images are about. This means that your alt tags can help you rank a page. So, you must use descriptive alt texts that are slightly different to your image titles and less than 125 characters.
6. Integrate ‘Lazy Loading’
Lazy loading is a great way to reduce the load time of pages or blog posts with a lot of image content. Instead of trying to load all the images at once, this technique involves using a plugin to prioritise loading the images on the visitor’s browser view. Usually, this means that each page is loaded from the top down, significantly improving the visitor experience.
7. Take Advantage of Images Caching
Image caching reduces the load on your server and improves your website’s performance by storing copies of your images in a cache where they can be easily retrieved. Some plug-ins can do this for you simply by turning it on in the settings.
8. Host Your Images on a CDN
A content delivery network (CDN) is a global network of servers that can speed up the delivery of your website’s images and other content to visitors by allowing them to download those files from the CDN location nearest to them.
For example, if your website is hosted on a server in Western Australia, website visitors from WA won’t have any problems loading it. However, what if visitors from Eastern Australia or other countries visit your website? Since they are farther from your server, it will take longer for your images and other content to get transferred to their locations, resulting in slow loading times and poor visitor experience.
A CDN makes it easier for your website visitors to load your images and other content by storing them in different data centres worldwide.
Using a CDN means you’ll have fewer plugins to deal with since they can also compress images and cache without increasing memory usage. Plus, good image CDNs deliver the best-optimised images for each visitor depending on the device they’re using, further enhancing user experience.
9. Disable Hotlinking
Most hosting dashboards have a hotlink protection option which you can turn on to protect your images from off-site linking. This stops other people from using your hosted images on their website, saving you server resources and money. Even if you don’t mind their use of your images, they should still download it and upload it to their website.
Final Words
If you want to build the best WordPress website possible, you need to make sure that your images are optimised. You can start with the techniques that are easier to apply before moving on to those that require more investment in terms of money and time. With these tips, you’ll soon be on your way to a WordPress website that loads faster, ranks higher, and provides the best user experience.