Image SEO best practices in WordPress

You may not be aware, but image optimization is integral to your website’s traffic. It is often an overlooked aspect of Search Engine Optimization that can impact the success of your business.

Image SEO includes optimizing the images on your website for their relevance to specific keywords. That is, naming and setting alt text to match your content’s keyword.

Along with this, you also need to consider practices such as choosing the correct image format, resizing and compressing images. You can also add them to your sitemap.

Altogether, these steps ensure that search engines find these images and rank them higher on the Search Engine Results Page (SERP).

The Benefits of Image SEO

Image SEO can help you rank higher in Google Image searches if implemented well. Also, it will give you an advantage over competitors who don’t use image SEO practices.

Suppose you own an e-commerce website. Then, it becomes easy for potential customers looking for your products or services online to find your images. Optimizing images on your site and blog posts also improves the general SEO for your website. This contributes to your website’s rank in search engine results.

You cannot underestimate the power of images on your website. Adding pictures to your blog posts, for example, gives them a more dynamic feel. They also make the text more readable, encouraging website visitors. The more engaging your images are, the better the chances of turning a potential customer into a loyal follower.

More interactive content on your website also reduces the bounce rate. As we all know, bounce rate is another metric that Google uses to rank your site pages higher. This article will guide you in implementing Image SEO best practices.

1. Use the right format and sizing

Suppose we have an image that we want to add to our content. First of all, we need to consider many things before uploading this image to our site.

These include choosing the correct image format and resizing images to the required dimensions. And finally, ensure that you compress the images.

Image format

Using the correct format is essential when it comes to image SEO. The most common formats are JPEG, PNG, and GIF, although others may be SVG or TIFF. All these depend on what you aim to optimize for. Most sites will want to use one of the first three types.

JPEG: JPEG is preferable for web images, especially photos, as it can maintain small file sizes. Hence, you can be sure of a fast web page load speed. You can use it for large images like banner ads and illustrations. 

PNG: This format is suitable for saving images that need a transparent background. It is also ideal for loading images with text, such as screenshots. You can also consider the PNG file format if a picture contains intricate details, such as web graphics, and if the image file size is not an issue.

GIF: This is a good choice for animations and low-resolution video clips.

SVG: SVG is more powerful than other formats. This is because you can scale images to any size without losing any quality. Besides, it is compatible with CSS styling and is suitable for displaying logos and icons. The downside is that WordPress does not support this format.

WebP: This is an image format developed by Google that uses lossy and lossless compression formats. These compression formats make it ideal for creating high-quality photos in small file sizes.

TIFF: This format is best when you need to save images in high quality. It is perfect for print images. But, because the files are often big, they are not suitable as web images. This format is also not listed among those supported by Google.

Google Images supports images in the following formats: BMP, GIF, JPEG, PNG, WebP, and SVG.

Image dimensions

Now that we have the correct file type/format, we need to resize our images to the correct dimensions for our site. Image sizes are significant because they impact page load time. Slow page load time can lead to higher bounce rates, lower conversion rates, and a poor user experience.

Image SEO best practices suggest using the correct format. You should also ensure that your images are the right size before uploading them to your website. Images taken with digital cameras and phones come in dimensions beyond what the browser can load.

For instance, a blog’s featured image in WordPress takes on the dimensions of 1200 x 628 pixels. Thus, uploading an image with dimensions of 2240 x 1260 pixels results in adding a large picture. This also means that we have uploaded an image with a larger size, which affects our page speed.

Resizing images ensures that we use images with the correct dimensions. Hence, we should avoid uploading larger images that will take longer to load in the browser.

WordPress image types and their dimensions

An aspect ratio describes the width of an image compared with its height. It appears in the form of W:H. Ensure that an image fits the recommended aspect ratio as you upload it to your site. Images tend to fall under these common categories of aspect ratios:

Landscape images (2:1): Landscape images have a width that is bigger than the height. For instance, a landscape image will have an aspect ratio of 2:1, which means that the width is twice as big as the height. These images are best for WordPress headers, blog post images, and background images.

Portrait images (1:2): Portrait images have a height that is bigger than the width. These images can have an aspect ratio such as 1:2, which means the height is two times the size of the width. This aspect ratio is the ideal size for a featured image.

Square images (1:1): Square images can have an aspect ratio of 1:1, which means the width and height are equal. Thumbnails are examples of square images used in WordPress.

Responsive images

Responsive images are images in WordPress that adjust to fit the size of the screen. Thus, the browser does not need to stretch the image to fit the page layout.

Images need to be displayed depending on the device’s screen size. So, big screens (monitors) need photos with larger dimensions than mobile devices. This implies that we need to have copies of each image, but in various dimensions based on the screen size.

The good news is that WordPress handles this for us. Also, it has a background functionality that will create copies of these images. When you upload a photo, WordPress generates three copies of that image. Below are the dimensions for these copies:

• Thumbnail size (150×150 pixels)
• Medium size (300×300 pixels)
• Large size (1024×1024 pixels)

Images on your website will appear in the dimensions above, depending on the screen sizes of different devices.

You can also customize WordPress default image dimensions for responsiveness by adding your preferred dimensions. This can be through modifying the functions.php file.

Image compression

After setting the correct image dimensions, you should compress the images. Compressed images lead to fast webpage load speed. This is important because Google considers page speed as it ranks websites.

Image compression WordPress plugins

The good news is that there are some tools to do image compression for you. These include: 

2. Name images correctly

Naming your images for SEO is very crucial. A filename gives Google clues about the image’s subject matter. A poorly named picture will not provide enough context for what the image is about. Hence, low traffic to your site.

But with a proper file name, it is easier for search engines to find your images and display them as relevant results. This can help with image SEO, drive more traffic and provide a better user experience. 

Whenever you export an image from a device or download it from stock photos, it has a generic file name like dsc00001.jpg. This filename is usually set by the device or camera used. Unfortunately, this isn’t a proper file name as it provides no hint about the contents of the image.

A name like “red-winter-boots.jpg” is better than “dsc00001.jpg.” This is because the filename immediately tells you about the image’s subject matter.

Guidelines on naming images

• Separate the words in the filename with a hyphen (-) or dash and not underscores (_).
• Keep all the letters in the file name in lowercase format.
• Include relevant keywords. If someone searches for a smartphone on a search engine, they are likely to type in the term “phone.” This will be in addition to the brand name of the phone model. A good image name example for this case could be “samsung-s21-phone.jpg“.

Pro Tip: Focus on your most important keywords when renaming your images

Having descriptive image file names will help Google learn about the contents of your image. This will allow you to rank higher in relevant image search results.

Implementing the practice of using proper file names also makes it easy for you to find an image within the WordPress media directory. Suppose you type a word like “sunrise” in the WordPress media directory. In that case, all images with a file name that relates to the word “sunrise” will appear. It makes it easy for you to locate your pictures in the future.

3. Image Alt Text

One common mistake people make with image SEO is not adding alt text to images. However, adding alt text is an essential part of search engine optimization.

Alt-text is also known as alternative text. It is a brief description of an image that tells search engines and visitors what it is about. Its primary purpose is to help blind or visually impaired people who use screen readers understand what an image is about.

Alt text also appears in the place of an image on a webpage in case the image fails to load.

Hence, defining this attribute for each image you post is quite important. In addition, your photos’ alt text and title tags should always include relevant keywords.

Why Alt Text is important for image SEO

First of all, alt text helps Google and other search engines determine the content of your image. SEO best practices dictate that you must include alternative text for every image on your website. It helps communicate the message you want to convey about a specific image.

Here is an example of an image’s HTML line of code with an Alt Text:

Alt text also improves image SEO for two other reasons. First, it helps you maximize your use of keywords. This lets internet users find your website when searching for image-specific terms or phrases.

For example, someone is searching for an image of a smartphone on Google. You will rank higher in image search if you include alt text on your smartphone images.

Additionally, suppose someone pinned one of your images to a social media platform, like Pinterest. In that case, the alt text will appear as the description. Make sure your alt text is engaging and descriptive, but also concise.

You don’t want to overwhelm users with too much information, nor do you want to sacrifice keyword optimization. Aim for around 125 characters or less. Including keywords in your alt text is one part of optimizing your images for SEO.

Note: Avoid keyword stuffing when setting the alt text, as search engines can flag this as spam.

You can also use captions to provide a more detailed explanation of what’s going on in the image.

How to set Alt text in WordPress

There are various ways of adding alt text in WordPress to boost image SEO. This depends on the page builders you use on your site or the purpose of the images you are uploading. Let us look at how you can add alt text to your images.

1. Adding Alt text via Media Library

• In the WordPress Admin Dashboard, go to “Media”.
• Click on the “Add New” button.

• Upload the image to WordPress.
• When the upload is complete, click on the uploaded image. This will then open a form that one can use to fill in image-related information. This includes the Alternative Text, Image Title, and Caption, among others.
• Add alt text in the “Alternative Text” text area shown below.

Note: This form is always displayed whenever you upload an image to the site, no matter what page builder you are using. So, you can always set the alt text at that stage.

2. Via Gutenberg editor

At times, we add images to our websites when writing blog posts. The WordPress Gutenberg editor allows us to set the alt text of an illustration when it is in our article. To add the alt text, follow these steps:

• Add an image to your content.
• Select the image block and go to “Show more settings.”

• Under the block settings, look out for the Alt text section to add the text.

3. How to set Alt text in Elementor

As we saw in the first scenario, the process is quite simple in Elementor. When dealing with any widget of the page builder that interacts with an image, you have to set its Alt text. You do this when uploading the image to the site or replacing the existing image for the first time. To do this, follow these simple steps.

• Click on the “Choose Image” button.

• Upload or add an existing image to the media library.
• Select the image and add the alt text in the Alternate text field.

4. How to set Alt text in Divi

• In Divi, add the image module to the page.
• Then, click “Add image” to upload an image.
• Next, select whether to upload or access the pictures in the media library.
• Add the alt text in the image form that we saw in the first process.

5. How to set Alt text in WooCommerce

Adding alt text to product images on your WooCommerce site is crucial. As we discussed in the sections above, this enables the search engines to know what your image is about. Besides that, images with good SEO will lead to faster web page load times on your site.

When it comes to WooCommerce sites, products should have this attribute to improve rankings in Google searches.

To set the alt text on featured images in WordPress, follow these quick steps.

• Go to products.
• Click on the product whose image alt text you would like to add. 
• Look for the set featured image section via the editor on the product form.

• Click on “Set product featured image.”
• Add the alt text in the input field in the image dialogue box that is displayed after the upload.

4. Have an Image Sitemap to boost SEO

An XML sitemap is a file that provides information about the relevant pages, posts, videos, and other files on your site. An image sitemap includes information exclusive to image files on your website.

An image sitemap is a great way to ensure that Google can find all of the images on your website. This includes images that your site reaches by using Javascript.

It also enables you to inform search engines about which images you wish to be indexed and those to be left out.

Suppose you are using an SEO plugin such as Yoast. In that case, they create XML site maps for your posts and pages, which include your images in the sitemap.

It is also encouraged to create a dedicated sitemap for your images. This caters to cases where you need to have images hosted on CDN indexed by search engines. This is a feature that SEO plugin-generated sitemaps do not cater to.

In this section, we will take you through the process of generating a sitemap with the Yoast SEO plugin we use here at MRK WP.

Yoast Image Sitemaps

Yoast’s SEO WordPress plugin makes it easy to create and submit an image sitemap to Google. As mentioned earlier, this plugin adds all the images in your posts and pages sitemap. So you don’t have to worry about adding them yourself.

Setting up image sitemaps with Yoast SEO is a breeze. Here are simple steps you can follow to set up image sitemaps.

• Go to your dashboard. 
• Click on the “SEO” tab. 
• Then, select the “XML Sitemaps” sub-tab. From there, you can activate XML sitemaps for images by checking the corresponding box.

The Yoast plugin provides more options to extend the functionality of the XML site map feature. Visit the help page on XML Sitemaps to find out more.

Apart from Yoast’s SEO plugin, you can use several other plugins to create image sitemaps. These are:

• Simple Image XML Sitemap
• Image Sitemap
• Image XML-sitemap generator
• Advanced Image Sitemap
• Sitemap Generator

Final Thoughts

To recap, image search optimization ensures that web users find your images online. It is a great way to make sure your website gets found by Google Image Search and other image-crawling bots.

In conclusion, always make use of all these WordPress best practices for your images. Ensure to use high-quality and useful images that complement your content. This helps readers better understand the subject and will lead to better engagement and conversions.

Implementing these tips will boost ranking on Google Image Search results pages and drive even more traffic back to your site. Use these best practices today to increase image SEO for better results and stand out from the competition.

Get access to the infographic on the four image SEO practices in WordPress here.

Frequently Asked Questions