How to Optimize Images for SEO

Taking the time to optimize your images for SEO is a simple but important step toward making your website more competitive in search engines. Images help bring your articles to life and contribute to your website SEO.

What Is the Importance of Images for SEO?

When used carefully, images help readers understand your articles better. They make articles easier to read, help highlight important points, and generally make written content more visually appealing. These factors also have a significant impact on user experience.

Considering that Google algorithms pay attention to behavioral metrics reflecting user experience, such as bounce rates and the amount of time visitors spend on a web page, we can understand the importance of images for SEO.

Furthermore, as image search continues to gain importance, it can provide a valuable source of traffic. Google Images was recently redesigned with an entirely new interface. The addition of new filters also shows that Google is becoming increasingly better at understanding what an image contains and how it relates to the surrounding content.

Use the Right Images

Using original images that you have taken yourself is better than using stock images. You should make sure that the images you use are relevant to the subject of your article. An image should reflect the overall topic of your article or serve an explanatory purpose within the content.

If you do not have an image related to your article, you can use alternative websites such as Flickr.com.

Other alternatives:

Freeimages.com

Unsplash.com

Preparing Images for Use in Your Article

After finding the right image, the next step is to optimize it for use on your website.

Choose the Right File Name

Image SEO starts with the file name. Although the latest advances in Google machine learning and its new capabilities for recognizing images are quite impressive, Google is not perfect yet. Therefore, we should choose the right file name so that Google can understand what an image is about without even seeing it.

Here is what Google says about image file names:

[...] The file name can also give Google clues about the subject of the image. For example, new-black-kitten.jpg is better than IMG00023.JPG.

Good: dog.jpg

Bad: dog-dogs-puppies-puppy.jpg

Bad: IMG_123134.jpg

Choose the Right File Format

Although the file format depends on the type of image and how you intend to use it, we generally recommend the following:

• JPEG is a good choice for large photographs or illustrations.

• You can use PNG for transparent backgrounds or images containing text.

• You can use WebP, a newer format, instead of JPEG or PNG. It produces high-resolution images with smaller file sizes. You can use the Squoosh tool to convert your images to WebP format. You can find more information about the WebP format here.

• Use SVG for your logos and icons. You can easily control SVG images with CSS and JavaScript without any loss of quality.

• GIF is a good choice for animated images.

Resize Your Images According to Your Website Dimensions

Images have a significant impact on loading times, especially when you upload a large image and display it at a smaller size. For example, if you upload an image that is 2500 x 1500 pixels and display it at 250 x 150 pixels, you still have to wait for the entire image to load. Therefore, you should resize images to the dimensions at which they will be displayed.

Narbilisim Blog – Image displayed on a 27-inch monitor with a resolution of 2560 x 1440

As you can see in the example above, there is a large amount of empty space on the left and right sides. This is because the maximum content width is 760px. In other words, regardless of your screen size, images will never be displayed wider than 760px.

The browser will resize images wider than 760px to fit the screen, at least on a well-designed website. However, the important point is that the browser still has to load the full-size image. If we insert an image that is 3000px wide, the browser will still have to load the 3000px image, even if it displays it at 760px.

The solution is to resize your images according to the maximum width they may need. You can use the Smart Resize tool for this purpose.

Optimize Your Images for the Web

Page loading speed is extremely important for user experience and SEO. Google announced that page loading speed is a ranking factor on both desktop and mobile devices. Therefore, we should compress images as much as possible without significantly reducing their quality.

There are many tools available that allow you to achieve substantial file size reductions without significantly affecting image quality. Google has also carried out extensive work on optimizing images for the web.

You can use the following tools to optimize your images:

• TinyPng.com

• CompressJpeg.com

• imageoptim.com

To learn more about the impact of page speed on SEO and how to improve it, we recommend reading our article titled "Ways to Improve Page Speed and Its Impact on SEO."

Adding the Image to Your Article

Your image is now ready to use. The remaining step is to provide context for search engines and your visitors.

Use Descriptive Alt Text

Alt text (or alt tag) is text that describes an image. If an image cannot be displayed to a visitor for any reason, the alt text added to the image is shown instead.

Add alt text to every image you use and, if possible, make sure it includes the SEO keyword of the page. Most importantly, describe the image so that both search engines and people can understand its purpose. Avoid keyword stuffing in alt text. This can make your website appear spammy.

You can see a well-written alt tag in the example. This example comes from the official Google guide.

Place images as close as possible to the relevant text. Consider placing the most important image near the top of the page.

Create an Image Sitemap

Google recommends using image sitemaps to provide search engines with more information about the images on your website and increase the chances of your images appearing in image search results. Here is what Google says about sitemaps:

You can also use Google image extensions for sitemaps to provide Google with more information about the images on your pages. Image sitemap information helps Google discover images that it might not otherwise find, such as images accessed through your website JavaScript code. It also allows you to specify which images on your website you want Google to crawl and index.

Adding your images to your XML sitemap helps Google index them. Therefore, make sure you include your images in your XML sitemap for better Image SEO.

You can find more information about sitemaps and image tag definitions here.

We recommend reading Google article on how to optimize images for search engines and visitors. You can access the article here.

As Google becomes better at recognizing images every day, ensuring that your images and all their elements contribute to user experience and SEO will benefit your website.