Academy

Image SEO in short

Image SEO can be a game-changer for your business.

In order to be successful at image SEO, pay attention to:

  • Your images’ discoverability, crawlability, and indexability
  • The authority of the pages your images are on
  • Those pages’ topical relevance
  • Image captions
  • Image attributes (file name, format, size, and alt and title attributes)
  • How fast your images load
  • Providing context about the images – stated using Schema markup

What is Image SEO?

Image SEO comprises the activities used for getting images ranked high in search engines’ organic listings.

Just like with pages, search engines try to make sense of images. To make your images rank high, you should do whatever you can to help them with the “making sense” part. In this article, we’ll explain how you do this.

Why should you care about Image SEO?

There are two reasons to care about Image SEO:

  1. Images can be a huge driver of quality organic traffic. Especially now that Google has removed the “View image” option, users are much more likely to go to your page.
  2. When you do Image SEO, you automatically optimize for screen readers, thereby helping visually impaired people use and understand your website better too.

We bet now you’re asking yourself: “Will image SEO be a huge traffic driver for me as well?”

Whether that’s the case depends on your business. For us, it actually only accounts for a fraction of our traffic. Usually, people looking to resolve their SEO questions aren’t looking for images. Search engines know this, so they mostly return regular pages in their results.

As a rule of thumb: if images frequently come up as results for queries you’re trying to rank for, Image SEO is important to you. So if you’re running an eCommerce site, a celebrity news site, or for instance a stock photo website, Image SEO is hugely important.

Kevin Indig
Kevin Indig

Images fulfill three purposes in my mind:

  1. Image search traffic
  2. Adding quality to a piece of content
  3. Improving conversion rate.

Image search traffic doesn't only come from images.google.com, but also from universal search - and this is important. For some user intents, Google will show videos and images prominently in the SERPs. That's a great workaround if you can't rank at the top organically.

In terms of content quality, well-done images provide a better user experience and make an article more likely to be shared and linked to. Try to add custom images and graphics and only revert to stock photos as a last resort.

The same applies to conversions: the better the image in terms of quality and context, the higher the impact on conversions.

On the flip-side, images pose a challenge in terms of page speed optimization. You need to make sure they're compressed, cached, and loaded optimally.

Cyrus Shepard
Cyrus Shepard

Google Images account for almost 22% of all search engine market share. That's a whopping number and is bigger than the search engine market share of YouTube, Facebook, Amazon, and Wikipedia combined.

Google representatives have been hinting for a while now that they expect both image and video search to be higher growth verticals. As Google continually erodes the percentage of search clicks it sends to publishers, images may be an investment worth considering.

Peter Mead
Peter Mead

I've seen good traffic coming from image SEO, particularly for any topics which include diagrams, or explanatory images. But also for images that are fun and entertaining.

As with any kind of optimization, the more effort you put in to it the better.

When it comes to image SEO, even just making sure you get all the basics right already helps. Make sure the image quality is good, the dimensions are appropriately sized, the image filename is human readable, and the alt attribute reads well with topical words included.

Develop a regular optimization practice around images and you will see the SEO benefits.

Sam McRoberts
Sam McRoberts

If your business is highly photo reliant (e.g. stock photography, art, unique visual products or adult entertainment), then focusing on image SEO makes sense. Otherwise, it’s safe to assign a lower priority to it.

What influences your images’ ranking?

There’s a whole list of factors that will influence your images’ rankings:

  • Discoverability, crawlability, and indexability
  • The authority of the page they’re on
  • That page’s topical relevance
  • Image captions
  • Image attributes (file name, format, size, and alt and title)
  • How fast your images load
  • The image context you’ve provided through Schema markup

We’ll explain all this in detail below.

Discoverability, crawlability, and indexability

You might think we don’t even have to mention this, but people get it wrong all the time. Make sure search engines can discover, crawl, and index your images easily.

Help search engines discover your images with image XML sitemaps

Including images in your XML sitemaps makes it easy for search engines to discover them, and to prioritize the crawling and indexing of your images.

You can either create dedicated image XML sitemaps or include your images in your existing XML sitemaps. Both methods are fine, although we recommend creating dedicated image XML sitemaps if your site has thousands of images, as having separate XML sitemaps gives you a better overview when you’re analyzing which images are indexed.

Some guidelines around image XML sitemaps:

  • Each <url> tag can contain up to 1,000 image:image tags. In other words, you can define 1,000 images per page.
  • To define an image caption, use image:caption
  • To define an image’s geographic location, use image:geo_location
  • To define an image title, use image:title
  • To define an image license, use image:license

More information:

Make sure your images are crawlable and indexable

What can’t be crawled, can’t be indexed. So make sure an incorrectly set up robots.txt file isn’t blocking search engines’ access to your images. Don’t prevent Googlebot-Image and Googlebot from accessing your images in your robots.txt!

If you want your images to be indexed by search engines, make sure they don’t have a X-Robots-Tag HTTP Header noindex directive and are not canonicalized using the HTTP header.

If you’re using the robots noindex directive on a page which contains the images, the images won’t be indexed either (unless they’re also on other pages that are indexable).

Also make sure your pages don’t contain the noimageindex robots directive, which specifically communicates to search engines that you don’t want them to index the images on your page.

John Mueller has been kind enough to confirm our thoughts about robots noindex and its impact on images:

John Mueller answers question from Steven van Vessum about the effect of the robots noindex directive on image indexability

More information:

The authority of the page they’re on

In the previous section, we mentioned that search engines will be ranking the pages the images are on. Let’s take an example to illustrate this. If you search for Denzel Washington in Google images search, this is what you’ll see:

Google Images search result page for Denzel Washington

The top three results are:

  1. imdb.com
  2. wikipedia.org
  3. variety.com

What do they all have in common? They have a lot of authority. An image benefits greatly here from the authority of the page it’s on. Keep this in mind when optimizing your images and when choosing what pages to place your images on.

Pro-tip: Ask people who have used your images to properly credit you with a link to the page each image is on. Especially in “boring” niches, where it’s hard to build links, this is a great tactic. Read more about this link building method here.

Just in case people won’t give you proper credit, at the very least make sure you watermark your images, so you’re still getting brand exposure.

Martin Missfeldt
Martin Missfeldt

Many SEOs know the usual image ranking factors: alt-text, captions, text around the image, heading in front of the image and so on. But what many don't consider is that this only takes into account which queries (!) the image can rank for. It doesn't say anything about the popularity of the image, which is important too. So, how does Google measure the popularity of images? It's quite simple: how often the image is used.

It doesn't matter if you use the same image physically (by hot linking) or if it is a copy of an image. A copy can even have a different compression, different image dimensions or a different image file size. Google's image algorithm recognizes copies, and related them accordingly. In principle, Google says: "these popular images are used often - so we'll give them priority in the results".

My tip for you: for a lot of queries, the top ranked images have no copies on the web. They are "single used images". It is usually enough to just upload a second or third version by yourself - if possible, on a different domain with similar content. Or you can get competitors to use the image as well.

But be careful: if Google has several sources for the same image, then the page that ranks highest will also rank highest in images search.

Think about this - and you will find a lot of golden nuggets in Googles Image search 🙂 Good luck!

The page’s topical relevance

The topic of the page your images are on hugely influences their rankings. In the case of Wikipedia (the second result) for our “Denzel Washington” query, it really helps that they have a 4,000 word page about him, as it adds a lot of relevance to the images on that page for that query.

Topical relevance of text influences relevance of images on a page

Note that WordPress creates a dedicated “image attachment” page for each image you upload. This adds no value from an SEO point of view, so we recommend disabling it. It eats up crawl budget and makes for near-duplicate content.

Jennifer Wright
Jennifer Wright

Strategically use images to enhance the written content of a page, send stronger keyword signals to search engines, and to improve the experience of your audience. Images help users better understand the information you are trying to convey, and they strengthen the signals to search engines about the quality and relevance of your content. Google suggests using images that are relevant to the text surrounding them, which is similar to the concept of relevant pre and post text surrounding link anchors.

Image captions

Text that’s in close proximity to images adds to their relevance from a search engine’s point of view, and it helps users better understand the images.

Here’s an example of an image caption from our redirects article:

Example of a caption under an image

Optimizing image attributes for SEO

Here’s an example HTML snippet for an image:

<img src="https://example.com/images/denzel-washington-graduating-high-school.jpeg" alt="Denzel Washington graduating high school" title="Denzel Washington graduating high school" />

An image tag has a file name, a format, a location where the image can be found, and attributes that provide context. This is another place where search engines will pick up clues on the queries for which your images are relevant. But note that you can overdo this. Don’t stuff image file names and alt and title attributes full of keywords.

Here’s a breakdown of an image’s properties:

  • Image file name
  • Image format
  • Image URL path
  • Image srcset attribute for serving responsive images
  • Image alt attribute
  • Image title attribute

Image file name: how to name images for SEO

Make sure the file name is descriptive and fits relevant queries.

  • Good: denzel-washington-graduating-high-school
  • Bad: photo

Image formats

Choosing the right format for the image helps keep image load times down and image quality good.

  • Good: .jpeg for a photo
  • Bad: .gif for your screenshot that’s supposed to show details

Here are the most popular image formats, and what they’re best used for.

Image format Best used for
JPEG (JPG) Photos
PNG Logos (as it supports a transparent background) and images that you want to remain sharp, such as screenshots.
GIF Animations
SVG To create images that can scale without ever losing quality (vector images). Maps, icons, and logos are common examples.
WebP Developed by Google, WebP is an alternative to JPG and PNG that can be compressed better. As of yet, it’s not supported in Safari (and it is not supported in Internet Explorer at all). We believe WebP has a lot of potential, and we see it as the future of image formats. Use Webpurr or Squoosh to convert images to the WebP format.

More information:

  • Check out the Can I Use website to see what browsers support what image formats (and much more).
Alex Florescu
Alex Florescu

We often see that PNG images are incorrectly used. While having logos or small drawings as PNGs is generally fine, we often see large pictures using this format as well instead of having the JPEG or WebP format. This leads to PNG images that are up to 10 times larger than the JPEG version would have been, significantly slowing down websites. ShortPixel Image Optimizer plugin has an option to automatically convert PNGs to JPEGs and will only do this if the resulting image is smaller than the original. This allows our users to just set up the plugin and then forget about it because the best image format will automatically be used.

Image URL path

You want your images to have a short and logical URL path. Avoid using a chronological folder structure such as for instance the one used by WordPress. Your images are probably timeless, so don’t make people think they’re outdated.

  • Good: /images/denzel-washington-graduating-high-school.jpeg
  • Bad: /wp-content/uploads/2016/09/images/denzel-washington-graduating-high-school.jpeg

Image srcset attribute for serving responsive images

Considering Google’s mobile-first focus, the role of page speed as a ranking factor, and the fact that Google primarily crawls with a mobile user-agent, carefully serving the right image sizes to the right users is essential.

Thankfully, you can define what versions of an image will be used for different devices and viewports. For instance, if you’re browsing a website on your phone, you don’t need an image with a width of 1024 px. You can make do with a version that’s only 400 px wide, saving you a lot of bandwidth.

You can define what image to use for what viewport width using the srcset attribute. Here’s an example:

<img src="/images/denzel-washington-graduating-high-school.jpeg" srcset="/images/denzel-washington-graduating-high-school-400.jpg 375w, /images/denzel-washington-graduating-high-school-800.jpg 768w” alt="Denzel Washington graduating high school" title="Denzel Washington graduating high school" />

In this example, we’ll serve the image with a 400 px width to screens with a 375 px width viewport and below, the image with a 800 px width to screens with a viewport width above 375 px and up to 768 px, and the default picture to every device with a viewport width higher than 768 px.

If you want your images to look extra sharp on retina screens, you can serve images with double the pixel density of a normal image. If your normal image has dimensions of 600 x 300 and is called denzel-washington-graduating-high-school.jpeg, then your retina image should have dimensions of 1200 x 600 and be called [email protected].

Jeff Chang
Jeff Chang

It’s important to understand that the same looking image with different image sizes are essentially different images, so if you are currently getting a lot of image search traffic and change your images sizes, expect traffic to drop due to recrawl time. Hopefully it recovers over time, but any image size changes should be monitored by SEO experiment to track traffic changes.

Stephen Kenwright
Stephen Kenwright

Image SEO is about how image files impact performance overall - not just in google.com/images - and they're some of the biggest contributors to slow load times. Serve images through a CDN and make use of adaptive sizes to prevent users loading bigger images than they need to. There are plenty of tools available to help you make the job easier, even if you're not the most technical. For example, https://responsivebreakpoints.com/ can create the srcset code for adaptive images without you needing to code your own.

Image alt attribute

The alt attribute, also – incorrectly – called the alt tag or alternative tag, gives search engines context. It’s an important attribute to fill in from an SEO point of view, but also from a user point of view. When an image can’t be loaded, it shows the alt attribute text as a fall-back so users can get an idea of the image’s content. This is also used by screen readers to describe what’s in the image.

Check if your image alt attributes are setup

Do a quick check to make sure your image alt attributes are filled in, and descriptive.

Please enter a valid domain name (www.example.com).

Image title attribute

The title attribute gives search engines some context about the image, plus when a user hovers over an image with the mouse, that image’s title attribute is displayed. Including a call to action here can help increase your conversion rate. Google’s John Mueller has mentioned that, from an SEO standpoint, the image title attribute is less important than the alt attribute, but that it may still be used if it contains relevant content. His exact words:

John Mueller says image title attribute still carries SEO value

Fast loading images

Page speed is one of the ranking factors for search engines. That makes it important for images to load fast too. Not just because page speed is a ranking factor, but also because images are using the same crawl budget your pages and other assets are.

To make sure your images load fast, make sure to:

Compressing images

Compress your images to decrease their file sizes. There are several overall options for compressing images:

  • Lossy: file size is decreased significantly, but the images lose quality. This option makes for the fastest loading images.
  • Lossless: file size is decreased moderately, and the images don’t lose quality. This option doesn’t help you that much to make images load fast.
  • Glossy: this is the golden mean between “lossy” and “lossless”, balancing decreased file size and loss of quality.

Tools to help you compress images
Here are examples of tools you can use to compress your images:

Online apps:

Tools that integrate with WordPress:

Tool that integrates with Magento: TinyPNG

Desktop app: ImageOptim

More information:

Jess Joyce
Jess Joyce

Lately, the largest thing I've been focusing on for image SEO is large images and proper image types. Crunching, squishing, optimizing, smooshing, and using my favourite tool/Google Chrome Labs project - Squoosh.

It's been a large part of the sites I've been working on lately and before we can talk about image naming, alt text, captions, and the all-important text that surrounds the image for context - it has to load fast. Whether that be optimizing the image(s) before and directly uploading to their own site, using plugins to optimize image sizing/types, applied programmatically before the images hit the server, through a CDN or the many other ways, there’s a conversation to be had in every case.

I'm very excited for Chrome adding native lazy loading, and can't wait to try that out!

Bouke van Veen
Bouke van Veen

TinyPNG is not your typical compression engine. Each image is analyzed when you upload it. Textures, patterns and colours are automatically identified. The encoder decides based on these characteristics which quality to use. The final result is compared with the orginal and fine-tuned. There are no knobs to turn, you no longer have to adjust the encoding quality yourself.

Page speed best practices that also apply for images

In this section we’ll cover page speed optimization best practices that go beyond images, and yet are worth noting considering their impact from an SEO and user standpoint.

Serve images through a CDN

Using a CDN such as Cloudflare to serve your content, including images, has many advantages. Since a CDN enables users to request your content from the server that’s closest to them, it greatly decreases load times.

Use browser caching

Use browser caching to ensure that images that are used on multiple pages are cached. Examples are images that are used site-wide, such as for example logos in the header, sidebar, and footer.

Use lazy loading for images

While using lazy loading for images doesn’t speed up their loading, it is important from a page speed optimization point of view, and since we’re talking about images, it makes sense to mention it here too.

Defer loading your images until they’re needed, and also until after all the elements that are critical to rendering the page are loaded. It’s more important for users that pages are quickly usable, than that they look perfect. Why would you immediately load images that are all the way down on a page, when users start reading at the top?

Use Schema to help search engines understand image context

Mark up any image that is representative for your content using Schema.org markup. This helps search engines understand its context, plus it also makes it more likely that you’ll win featured snippets with that image. Having the image there makes the featured snippet stand out more, and so you’ll also get more clicks.

Here’s an example code snippet referencing an image:

<script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Article", "mainEntityOfPage": { "@type": "WebPage", "@id": "https://www.contentkingapp.com/academy/image-seo/" }, "headline": "Image SEO: the Ultimate Guide", "image":{"@type":"ImageObject", "@id": "https://www.contentkingapp.com/academy/image-seo/#primaryimage", "url":"https://www.contentkingapp.com/wp-content/uploads/2019/05/[email protected]", "width":1200, "height":600, "caption":"Image SEO guide"}, "datePublished": "2019-05-17T08:00:00+08:00", "dateModified": "2019-05-17T09:20:00+08:00", "author": { "@type": "Person", "name": "Steven van Vessum" }, "publisher": { "@type": "Organization", "name": "ContentKing", "logo": { "@type": "ImageObject", "url": "https://www.contentkingapp.com/wp-content/uploads/2019/05/[email protected]" } }, "description": "A useful guide on increasing your images' rankings" } </script>

A few pointers:

  • Make sure the images referenced in your Schema.org markup can be crawled and indexed, as described in the “Discoverability, crawlability, and indexability” section.
  • The images must be relevant to the page.
  • The images must be in .jpg, .png, or. gif format.
  • Provide the images at high resolution, with the following aspect ratios: 16x9, 4x3, and 1x1.

More information:

Dan Taylor
Dan Taylor

When it comes to images it’s important to remember the basics, and that whilst Google is making great strides and improvements in recognizing the content of images, it’s still not a flawless system.

For example, I uploaded the below photo with the filename orange-ice-cream.jpg and Google's Cloud Vision is 70% sure it’s a baked good – and only 62% sure it’s dessert.

Google's Cloud Vision tool analyzing a bole of ice cream

You need to make sure you’re making life as easy as possible for Google and giving it as many signals as possible to identify images correctly. Many of Google’s recommendations haven’t changed since 2012, and although basic, they can make your images work a lot harder for your website.

BONUS: define Open Graph and Twitter Cards images

Defining your Open Graph and Twitter Card images is a no-brainer if you care about traffic from social media. That alone is a great reason to always define them.

While it won’t affect your rankings directly, we believe that defining your Open Graph and Twitter Card images adds context to your pages and images for search engines.

More information:

Tools to help you analyze image optimization potential

There are several tools out there to help you analyze your potential when it comes to image optimization. They’ll analyze the images you’re currently using and gauge the optimization potential. In most cases, you can significantly decrease load time – by several seconds.

List of tools:

Please note that these are automated tools, and that you should take the outcome with a grain of salt. Don't take the outcome as the most important points of action. As with everything in SEO, always remain critical and place things in perspective.

Start your free 14-day trial

Get up and running in 20 seconds

Please enter a valid domain name (www.example.com).
  • No credit card required
  • No installation needed
  • No strings attached