Tips On How To Optimize Images For SEO

One of the biggest secrets on achieving high organic search traffic is to optimize images for SEO. If you’re someone who’s into blogging or has solid knowledge on content management systems (e.g. WordPress), it’s a given that you should put images whenever you’re writing a blog.

This article will work best for small business owners who want to maximize the use of blogging in order to push higher traffic to their website.

Here are our 15 tips on how you can best optimize images for SEO:

Find the most appropriate image for your content.


It’s always better to use original images – those you have taken yourself – than stock photos. Your article needs an image relevant to its subject. If you’re choosing a random photo just to get a green bullet in our SEO plugin’s content analysis, then you’re doing it wrong.

The image should reflect the topic of the post or have illustrative purposes within the article of course. Try to place the image near the relevant text. If you have the main image or an image that you’re trying to rank, try to keep that near the top of the page if it makes sense.

Prepare the images to be used in your article

Choose the right file name

Image SEO starts with the file name. You want Google to know what the image is about without even looking at it, so use your focus keyphrase in the image file name. It’s simple: if your image shows a sunrise in Paris over Notre Dame Cathedral, the file name shouldn’t be DSC4536.jpg, but notre-dame-paris-sunrise.jpg. The main keyphrase would be Notre Dame, as that is the main subject of the photo, which is why it’s at the beginning of the file name.

Choose the right format

For images, the right format doesn’t exist; it depends on the kind of image and how you want to use it. In short, we recommend to:

  • choose JPEG for larger photos or illustrations: it will give you good results in terms of colors and clarity with a relatively small file size;
  • use PNG if you want to preserve background transparency;
  • or, use WebP instead of JPEG and PNG. It will produce high quality results with smaller file sizes. You can use tools like Squoosh to convert your image into WebP.
  • use SVG for logos and icons. With help of CSS or JavaScript you can manage images in SVG format, for instance, resize them without loss of quality.

Scale for image SEO

Loading times are important for UX and SEO. The faster the site, the easier it is to visit and index a page. Images can have a big impact on loading times, especially when you upload a huge image then display it really small – for example a 2500×1500 pixels image displayed at 250×150 pixels size – as the entire image still has to be loaded.

Resize the image to how you want it displayed. WordPress helps by automatically providing the image in multiple sizes after upload. Unfortunately, that doesn’t mean the file size is optimized as well, that’s just the image display size.

Use responsive images

This one is essential for SEO as well, and if you’re using WordPress it’s done for you since it was added by default from version 4.4. Images should have the srcsetattribute, which makes it possible to serve a different image per screen width — especially useful for mobile devices.

Reduce file size

The next step in image SEO should be to make sure that scaled image is compressed so it is served in the smallest file size possible.

Of course, you could just export the image and experiment with quality percentages, but I prefer to use 100% quality images, especially given the popularity of retina and similar screens.

Placing the images in your article

Captions

The image caption is the text that accompanies the image on the page — if you look at the images in this article, it’s the text in the gray box below each one. Why are captions important for image SEO? Because people use them when scanning an article. 

Decide whether you want to use yours for SEO as well or not. Bearing in mind the need to avoid over-optimization, I’d say you should only add captions where it would make sense to the visitor for one to be there. Think about the visitor first, and don’t add a caption just for image SEO.

alt text and title text

The alt text (or alt tag) is added to an image so there will be descriptive text in place if the image can’t be displayed to the visitor for any reason.

Be sure to add alt text to every image you use, and make sure the alt text includes the SEO keyphrase for that page (if appropriate). Most importantly, describe what’s in the image so both search engines and people can make sense of it. The more relevant information surrounding an image has, the more search engines deem this image important.

When hovering over an image, some browsers show the title text as a ‘tooltip’. Chrome shows the title text as was intended.

Add image structured data

Adding structured data to your pages can help search engines display your images as rich results. While Google says structured data doesn’t help you rank better, it does help to achieve a more fleshed out listing in Image Search. There’s more, though.

For instance, if you have recipes on your site and you add structured data to your images Google can also add a badge to your images showing that this image belongs to a recipe. Google Images supports structured data for the following types:

  • Product
  • Video
  • Recipe

Google has a number of guidelines you need to follow if you want your images to appear rich in image search. The main takeaway is that the image attribute is mandatory and that your images should be crawlable and indexable. You can find them all Google’s Structured Data General Guidelines. Try out Structured data training if you want to learn how to add structured data to your pages!

Image SEO: summary

Image SEO is the sum of a number of elements. With Google getting better at recognizing elements in images every day, it makes sense to make sure the image and all its elements contribute to a good user experience as well as SEO. It would be foolish to try to kid Google.

Keep these things in mind when adding an image to an article:

  • Use a relevant image that matches your text
  • Pick a good file name for your image
  • Make sure image dimensions match the image size as displayed
  • Use srcset if possible
  • Reduce file size for faster loading
  • Add a caption, if appropriate, for easier scanning of the page
  • Use image alt text. No need for a title text
  • Add structured data to your images
  • Add OpenGraph and Twitter Card tags for the image
  • Don’t break the left reading line with an image – align images right or center
  • Use images in your XML sitemaps
  • Provide all the context you can!

This article was taken from Yoast.