How to Optimize Images for SEO in WordPress

They say a picture is worth a thousand words, and never has this been more true than when building a website. Using images on a website is an effective way to visually communicate what your site is all about. Clearly, quickly, easily.

An aspect that is often overlooked when incorporating images on your website however is how to optimize images for SEO success. In this article we look at the various SEO tactics you can utilize when using images on your website to make sure your site is successful. Let’s jump right in. 

Image Alt Texts

Alt text also referred to as alt attribute or alt tags is basically a snippet of detailed information describing what an image is depicting. The first step to making sure your images are search engine optimized is to include alt text into all images used on your site. Failing to have alt texts for images means that your website not only becomes difficult to understand by web browsers and search engines but also for the readers. When you write alt tags, make sure that you are not solely doing it for SEO purposes. Always keep in mind why alt texts are there. Your first priority should be to describe what is happening in the image and avoid the keyword ‘stuffing’. The alt tags should be short yet meaningful. Try to incorporate 1-2 keywords in alt texts if possible. 

Optimizing & resizing images

It is important to keep image size in mind when uploading images to your website. If your images are too large it may make your website open speed slow which ultimately affects the site’s overall performance. Readability and load time are some of the most important factors for a website’s SEO, and optimizing images will give a boost to your website. So, how can you easily optimize your images for SEO in WordPress? There are several free tools available online that you can use to resize and optimize images. One such tool is GTMetrix. It highlights images with issues and gives details about how to fix the issue.

Controlling Pixels

The more pixels an image has, the better the overall resolution of the image will be. What you need to keep in mind is that the accepted standard of an image is 72 DPI (Dots Per Inch). You can set images to a higher DPI for a better resolution but it will increase the file size which in turn might slow down your website. Here’s a list of ideal element sizes for different kinds of WordPress images:

Icons – 16 x16 px

Slider Images – 1800 x 400 px

Featured Images – 250 x 250 px

Blog Post Images – 680 width px

Lazy loading images

If there are a lot of images on your website, then it is a good idea to use the lazy loading feature. So, what is lazy loading? Lazy loading means that the images will only be visible to the user when they scroll up or down to the actual location of the image. Lazy loading has the potential to dramatically improve a website’s speed.

The latest versions of WordPress lazy load the images by default so you won’t need to manually install a plugin for it. This is unfortunately not the case with background images. Lazy load plugin/script converts the ‘img-src’ code to ‘data-src’. But, this is not the case with background images since background images don’t use ‘img-src’ code. To avoid this, you can install plugins like Lazyload to solve the issue. 

CSS Image Sprite

CSS Sprite basically means collecting a series of images and putting it into a single image. Suppose our webpage has 15 small icons and each icon is 10 KB in size. The total size of all these icons is 150 KB. Individually the image sizes are small but all added together it is a lot. The website will have to process 15 different requests. This is where CSS Image Sprite comes in. It combines these 15 icons into 1 image. As a result, they will be processed as a single image. CSS Image sprite is a must to perform image SEO in WordPress.

Disable Hot linking

Hotlinking happens when someone displays an image from your site by using its web link directly. Turning off hotlinking will not only avoid others from using your images but also from consuming your website’s bandwidth & putting an unnecessary load on your server. 

To turn off hotlinking, add the following code to your ‘.htaccess’ file:

Use Image CDN

CDN is considered one of the most popular methods to optimize site speed. These days you can even find CDNs that are specifically built for website images. CDN is mainly used to optimize images and speed up the overall delivery process. How does CDN work? It basically picks up a cached version of the image from the server. SEO for images in WordPress becomes easy with image CDN as it comes with a variety of options to fine-tune the optimization, transformation & delivery process. Some popular image CDNs are Cloudflare, Cloudinary, Amazon Cloudfront CDN, etc. 

Final Thoughts

There are a bunch of factors to keep in mind when developing an SEO strategy for your website. By following the above-mentioned image optimization tactics you will be well on your way. Staying up to date with the latest SEO best practices could feel like a daunting task when doing it on your own. NAV43 is a digital marketing agency with a focus on specifically SEO. Give us a call today to let us know how we can help your site rank.