Image SEO: 7 Actionable Tips to Supercharge Your Organic Traffic

Images play an important role in making webpages more appealing to visitors.

Chances are you spend a lot of time selecting the right images to enhance your blog posts, product pages, and so forth.

But do you spend an equal amount of time optimizing your images for search engines?

When it comes to image SEO, the most common tip you can find on the web is to fill in your alt text. That’s it. There seems to be nothing more to it.

I wish it was as simple as that!

If your website relies on visual content, then you need to spend some time optimizing the images on your site. Not only will it help you get more organic traffic, but it will also provide a better experience to your users.

Improving the overall SEO of your images can result in a faster website, a richer user-experience, and even transform your articles from “good” to “great”.

In this article, we’ll reveal 7 image SEO tips that will help you get more organic traffic.

Select a few random images from the web, remove the descriptive text in the filenames, and then upload these images to see the accuracy with which Google predicts most images. But that’s the key here. Most images — not all images.

For instance, the Cloud Vision API can tell that the photo below is that of a tiger with a 99% accuracy:

But when I uploaded a stock image that showcased teamwork at a startup, the results were mixed:

Don’t get me wrong. Google’s Cloud Vision API is an incredibly efficient tool and it just shows how much progress Google has made in the last decade on this front. But it’s not perfect.

So it’s up to us to do everything we can to make sure search engines understand the images we are uploading. And one way to do that is to use descriptive filenames for your images.

2. Choose the Best File Format

Page load time is a critical SEO factor both on desktop and mobile. And images often contribute the most to page load time.

Images are often the largest contributor to overall page size, which can make pages slow and expensive to load.

When you’re optimizing images for speed, you need to choose a format that offers the best compression and the least reduction in quality.

Most images on the web fall under two file types: JPEG and PNG. There are also other file formats like GIF and more recently, WebP, but these are not as widely used as the former two formats.

Both JPEG and PNG image format use different compression techniques and as such, file sizes between these two formats can be dramatically different.

As you can see above, the JPEG image is the clear winner. Both these images have been compressed, yet the JPEG has a much smaller file size. Furthermore, there’s very little difference between the quality of these images. Does that mean JPEG should be our preferred file format for all images? Not quite.

JPEGs are great for photographs, but whenever the images contain text, line drawings, etc. you should opt for PNGs. This illustration by Digital Inspiration provides the most compelling evidence of this:

If you use an online design tool like Canva, you can download your graphics in PNG or JPEG formats.

Just remember:

For photographs, go with JPEG

For images with text, go with PNG

If you’d like to convert an image from one format to the other, use these free tools:

Images often account for most of the downloaded bytes on a web page and also often occupy a significant amount of visual space. As a result, optimizing images can often yield some of the largest byte savings and performance improvements for your website.

To that end, here’s the advice Google gives on image compression:

For best results, experiment with various quality settings for your images, and don’t be afraid to dial down the quality – the visual results are often very good and the filesize savings can be quite large.

Now that you know the importance of image compressions, let’s take a look at some of the best image compression tools that can help you achieve this task with ease.

TinyPNG: This is the tool I’d highly recommend for compressing images in PNG format. TinyPNG uses smart lossy compression techniques to reduce the file size of your PNG files. But how about JPEG files? TinyPNG is not the most efficient in that regard. For compressing JPEG files, I’d recommend the next tool.

ImageOptim: If you’re a Mac user, then this is a must-have tool for image compression. This is the tool recommended by Google as well. ImageOptim is by far the best tool for compressing JPEGs, but not for PNGs. For compressing PNGs, you’re better off using TinyPNG.

Despite advances in Google’s abilities to understand images, adding alt text to images is still an important on-page SEO factor.

Here’s Google’s advice on how to effectively write an alt text:

When choosing alt text, focus on creating useful, information-rich content that uses keywords appropriately and is in context of the content of the page. Avoid filling alt attributes with keywords (keyword stuffing) as it results in a negative user experience and may cause your site to be seen as spam.

Always aim at describing the images as best as you can. Be concise and avoid keyword stuffing.

5. Lazy-Load Your Images

Lazy loading is a technique that defers the loading of non-critical resources (images, videos, etc.) at page load time. Instead, these non-critical resources are loaded only when your visitors need them.

When we lazy load images and video, we reduce initial page load time, initial page weight, and system resource usage, all of which have positive impacts on performance.

An example of lazy loading can be found on Google’s Web Fundamentals which uses the publishing platform Medium to show image lazy loading in action.

As you can see above, a placeholder image is shown at page load (left), and when scrolled into the viewport, the full image loads when it’s needed.

If you’re a WordPress user, you can lazy load your images by using the free a3 Lazy Load plugin. This is the plugin I’m currently using on my blog to lazy load the images.

6. Enable Browser Caching

Browser caching can help speed up your site by storing some of the larger files on your site (including images) locally in the user’s web browser.

Every time a browser loads a webpage, it has to download all the web files to properly display the webpage, including all the HTML, JavaScript, CSS, and images.

Some pages might contain a few files and be small in size, while others may consist of many files and be large in size. These larger files can take a long time to load and each file makes a separate request to the server, further reducing the page speed.

This is where browser caching can help as some of these larger files are stored in your visitors’ browsers. Ideally, you’d want to keep them there as this ensures your site loads much faster. But you wouldn’t want to keep them there forever as you’ll be updating your website on a frequent basis. Google recommends a minimum cache time of one week and preferably up to one year for static assets, or assets that change infrequently.

Fetching something over the network is both slow and expensive. Large responses require many roundtrips between the client and server, which delays when they are available and when the browser can process them, and also incurs data costs for the visitor. As a result, the ability to cache and reuse previously fetched resources is a critical aspect of optimizing for performance.

Here’s a helpful decision tree from Google which will help you determine the optimal caching policy for a particular resource, or a set of resources, that your site uses.

If you’re a WordPress user, the solution is quite simple. Download any of these free caching plugins below and enable browser caching in the settings:

I’m currently using WP Fastest Cache for all my sites and I’m really happy with the results.

7. Resize Your Images

Page load time is an important SEO component. Images can have a significant impact on how fast or slow a web page loads.

Here’s how resizing images to your site dimensions can help improve site performance:

Let’s say the maximum width of your content area is 600px and you’re uploading an image that is 5000px wide. The browser will resize the image to make it fit on the screen. However, the browser still has to load the entire image size. This can really affect your site speed.

Therefore, when adding images, it’s best they are never displayed wider than your site dimensions.

The solution is to resize your images in line with your site dimensions. Here’s how you can go about this process:

Find the width of the content area on your site using the Chrome browser. Right click anywhere inside your content area and select ‘Inspect’.

In the new window that appears on the side of your browser, move your cursor within the code until you see the content area highlighted.

Check the tooltip at the top of the content area that’s highlighted. The first number is the width.

Use the free SmartResize tool to resize your images. This tool also allows you to upload your images in bulk while keeping your file names intact.

Final Thoughts

Google’s machine learning capabilities are evolving day by day. A day may come when you no longer need to consider image SEO. But until that day arrives, we need to optimize the images as best as we can to help them stand out in search engine results.

Keep these 7 optimization tips in mind next time you’re uploading images to your site. At the same time, remember that the images you use should enhance the user experience of visitors on your site and complement the text to make it more visually appealing. To that end, choose only high-quality stock photos and improve your design skills to create aesthetically pleasing graphics.

If you liked this article, please share it on Twitter using the link below:

Sandeep Mallya is the Founder/CEO of Startup Cafe, a Bangalore-based digital marketing agency. He is an active member of the startup community, having worked with several early-stage startups and accelerators. 99signals is Sandeep's inbound marketing blog. Here you can find tips and insights to grow your site's traffic.

3 COMMENTS

One small detail: PNG images, unless they are small logos, are very big compared to their JPEG version.
What I usually do is to convert PNG images, pictures to JPEG and have the JPEGs optimized.
I usually let ShortPixel do this automatically.

Save my name, email, and website in this browser for the next time I comment.

About Me

Hi there, I’m Sandeep Mallya!

I’m an entrepreneur and digital marketing consultant from Bangalore, India. I founded my own digital agency, Startup Cafe Digital, in 2015 where I help SMBs leverage social media, SEO, and content marketing to grow their traffic and generate qualified leads for their business.

I started 99signals in 2016 as a side project to document all the strategies, tools, and tactics that I was using to grow my small agency. The goal was simple: to arm other solopreneurs with all the right information they needed to launch a successful business.

ABOUT ME

Hi there, I’m Sandeep Mallya!

I’m an entrepreneur and digital marketing consultant from Bangalore, India. I founded my own digital agency, Startup Cafe Digital, in 2015 where I help SMBs leverage social media, SEO, and content marketing to grow their traffic and generate qualified leads for their business.

I started 99signals in 2016 as a side project to document all the strategies, tools, and tactics that I was using to grow my small agency. The goal was simple: to arm other solopreneurs with all the right information they needed to launch a successful business.

RECOMMENDED TOOLS

DISCLOSURE

Some of the links on this website are “affiliate links.” This means if you click on the link and purchase the product/service, we will receive an affiliate commission. No article published on this site should be republished anywhere (the web or otherwise) without written permission from the owner.

Featured on

ABOUT US

99signals is a marketing blog run by me, Sandeep Mallya, to help bloggers and entrepreneurs run a successful side business and earn extra income through blogging and affiliate marketing.