Are you doing image SEO? If not, you’re missing out on a big opportunity to bring more traffic to your website.
This guide will talk about how to optimize your images for maximum search engine visibility.
It will cover everything from the file name and alt text to image size and compression, including the tools suggested.
By following these tips, you can improve your ranking in search engines and bring more visitors to your website.
- What is Image SEO?
- Why Is Images SEO Important?
- Image SEO Pillars
- How to Optimize Images For Your Website
- Advanced Image SEO Practices
- Image SEO Online Tools
What is Image SEO?
It can be done by tweaking the file name, alt text, title tag, and other elements.
With this strategy, you’re making it easier for search engines to find and index your images, which can help lead to more traffic to your website.
It also helps increase user experience by providing relevant media within your content.
But wait – there’s more.
Image SEO helps improve accessibility for those who are visually impaired and are using screen readers. By offering alternative text for your images, you can tell these users what your website is about.
Why Is Images SEO Important?
Take a look at the following statistics.
Mobile searches for “image search” have grown by over 60% in the past two years.
In 2018, Google Images was responsible for 22.6% of all web searches.
In 2019, one billion people used Google Lens for visual searches.
Considering these statistics, numbers are only going to increase.
If your images are not optimized for search engines, you’re missing out on a lot of opportunities to bring traffic to your website and increase your rankings.
Not only that, but image SEO can also help improve the user experience on your pages.
By providing relevant and engaging images, you can keep visitors engaged with your content.
Image SEO Pillars
Now, let’s take a look at the pillars of image SEO.
These factors are impacting your site rankings:
- Quality and resolution
- Loading time
Quality and Resolution
The first thing you need to consider is the quality and resolution.
This will help ensure that your images are clear and easy to see.
It’s also important to make sure that they are the right size. If they are too large, they will take longer to load, which can impact your website’s ranking.
On the other hand, if they are too small, they may not be clear or visible on all devices.
To find the perfect balance, you need to consider the file size, dimensions, and format.
Another important factor to consider is accessibility.
Your images need to be accessible to everyone, including those who are visually impaired or using screen readers.
To do this, you need to provide alternative text, which should describe the image and its contents.
By writing it, you’re making it possible for everyone to understand what is on your website.
The next thing you need to consider is context.
Your images need to be relevant to the topic of your content. They should also be placed in the right location.
For example, if you’re writing a blog post about dogs, you wouldn’t want to place a picture of a koala in the middle of your content.
Not only would this be irrelevant, but it would also be confusing for your readers.
So, when choosing the right media for your content, make sure they are relevant and placed in the right location.
Another important factor to consider is uniqueness.
Your images need to be original. They should not be duplicates of other pictures that already exist on the internet.
To ensure that your photos are unique, you can use Google’s reverse image search tool. This tool will help you find instances of your image on the internet.
If you find that your media is being used by someone else, you can reach out to them and ask them to remove it (or give proper credit).
The final thing you need to consider is loading time.
Your images need to load quickly. If they take too long to display, it will impact your website’s ranking.
To ensure loading speed, you need to make sure they are in the right size and format.
Also, you should choose a fast and reliable hosting service.
How to Optimize Images For Your Website
Now that you know the importance of image SEO, let’s take a look at the practical advice to optimize any media on your website.
These are a few simple steps you can follow to ensure that your images are optimized for search engines.
By following these points, you can help improve your content ranking and visibility in search results:
Let’s start with the file name.
It should be descriptive and reflect the contents of your image.
For example, if you have a photo of a dog, you should pick something like “dog.jpg” or “dog-1.jpg.”
By using a descriptive file name, you’re making it easier for search engines to understand what your image is about.
Avoid using generic file names like “IMG0001.jpg” or “image1.jpg”. They provide no information about the contents of your picture.
Not only that, but they also make it more difficult for search engines to index your photos.
Remember, context is key. You want to make sure that your media are placed in the right location.
For example, if you’re writing a blog post about canonical tags, you wouldn’t want to place a picture of a cat in the middle of your content (unless it is just for laughing).
Not only would this be irrelevant, but it would also be confusing for your readers.
So, when choosing pictures for your content, make sure they are relevant and placed in the right location.
Also, whenever it’s possible, include your keyword in the file name.
For example, if you’re writing a blog post about “Google Search Essentials,” you could use a file name like “SEO-guidelines-from-Google.jpg.”
By including your keyword in it, you’re giving your image an extra boost in the search engine rankings.
The next thing you need to do is add the alt text (alternative text).
It’s a short description of your image. It is used by search engines to understand its contents.
It is also beneficial for people who are visually impaired, as they use screen readers to read the alt text of your picture.
Optimizing the alt text is part of a good on-page SEO strategy. If a photo on your site fails to load for any reason, the user will be able to understand it anyway, thanks to it.
When writing your alt text, make sure it is descriptive and includes your target keyword.
For example, if you’re writing a blog post about “HTTP status codes“, you could use an image with an alt text like “Example of HTTP status codes”.
Be sure to avoid filling it with keywords (keyword stuffing). This will not only hurt your rankings but also annoy your visitors.
However, not all images need alt text. Make reference to this W3 article, for guiding you to the right decision.
If, for example, a photo is used for decorative purposes only, then you don’t need to include an alt text.
Captions under images are read on average 300% more than the body copy itself, so not using them, or not using them correctly, means missing out on an opportunity to engage a huge number of potential readers.
Image captions are the text that appears below your media.
Although they may not directly influence SEO, they provide additional information about the contents of your picture.
Captions are especially important if you’re using images in your blog posts or articles.
Your readers will appreciate the extra information, and it can also help improve the readability of your content.
When writing a caption for your media, make sure it is relevant and includes your keyword.
As a general rule, put yourself in the shoes of your readers.
Often, people scan the content page, checking just headings, images, and captions.
So, anything that could enhance the user experience should be taken into consideration and applied in your content marketing strategy.
The format of your image is also important for SEO.
The most common formats are JPG, PNG, and GIF.
JPEG (Joint Photographic Experts Group) is the best format for pictures that will be displayed on the web. JPEGs have a smaller file size than other types of images, which means they will load faster on your website.
PNG (Portable Network Graphics) is best for transparent backgrounds, such as logos.
GIF (Graphics Interchange Format) is great for images that are simple, such as line drawings with fewer colors.
When choosing the right format, make sure to consider file size and quality.
You want your media to be high-quality, but you also don’t want them to take too long to load.
The last thing you want is for your website visitors to get impatient and leave before they even see your content.
If you have different picture formats, be sure to check if Google can read them.
HTTP Archive states that
images, on average, influence more than 20% of the webpage’s total weight.
What does it mean for you?
It means that you should compress your pictures, before uploading them to your website.
Compression is the process of reducing the file size of your images without sacrificing quality. Compressing them will help improve your website’s speed and performance.
However, it’s important to note that not all image compression is created equal.
Lossy compression, for example, reduces the file size of your picture by discarding some of the data. This can result in a lower-quality image.
Lossless compression, on the other hand, compresses your photo without losing any data. This means that the quality will not be affected.
In case you might be asking yourself, there are many different ways to compress your media. You can use an online tool like TinyPNG or Kraken.io.
Or, if you’re using WordPress, you can install a plugin like WP Smush or ShortPixel.
Remember. Everything should be focused to improve user experience, so make sure to test different options and see what works best for you and your website.
Once you have a live page, be sure to check its loading time with PageSpeed Insights by Google. This will help you identify any areas where you can improve your page’s score.
As more and more people use mobile devices to access the internet, it’s essential to make sure your website is optimized for these users.
Google’s Mobile-Friendly Test is a quick and easy way to check if your web pages are properly configured for mobile devices.
Simply enter the URL and Google will analyze your page and tell you if there are any problems.
If your website is not mobile-friendly, it will give you a list of things you need to fix. Once you’ve made the necessary changes, run the test again to see if your website passes.
Keep in mind that mobile-friendliness is not just about how your pages look on a tablet. It’s also about how easy they are to use on a mobile device.
For example, if your website has a lot of small text that is hard to read on a smartphone, or if users have to zoom in to click on links, then it’s not mobile-friendly.
As well as text, also your media need to be responsive.
So, how can you optimize your images for mobile devices?
Google provides guidance on best practices, so you can create responsive media that look great on all devices.
Some key tips include:
- Use the srcset attribute to specify different sizes for different devices.
- Use the sizes attribute to control how your photos are displayed on different screen sizes.
- Use the <picture> element to control which image is displayed on different devices.
Luckily, if you are using WordPress, there is a plugin that can help you with this called WP Smush.
It automatically detects when an image is being viewed on a mobile device and serves the appropriate size.
Not only does this improve the user experience on your website, but it also helps to reduce your page loading time, which is important for both SEO and usability.
Also, specific responsive WordPress themes can be used to automatically adjust your site’s layout for different devices.
Finally, if you want to go one step further, you can create a dedicated mobile version of your site.
However, this is not always necessary, and a responsive design should be enough for most cases.
A sitemap is a file that contains a list of the pages on your website, including all the images.
It is used by search engines to crawl your site more effectively and discover new pages.
A sitemap can also be used to provide additional information about each page on your site, such as when it was last updated and how often it is changed.
You can create it manually or you can use a sitemap generator tool. Once you have created it, you need to submit it to Google Search Console.
If you’re using WordPress, there is a plugin called Yoast SEO that can help you with this. It automatically generates a sitemap for your website and submits it to GSC for you.
However, if you’re not using WordPress, you can find a list of sitemap generators here.
When it comes to SEO, content is still king.
Your media need to be unique and of high quality, if you want them to rank well in search engines and increase your site authority.
To make sure your images are unique, avoid using stock photos whenever possible.
Instead, take your own photos or use online tools like Canva or PicMonkey.
Remember, when it comes to image quality, you need to make sure they are clear and sharp.
Avoid using blurry or low-resolution pictures, as these will not only look bad on your website, but they will also be less likely to rank well in search engines.
Advanced Image SEO Practices
In the previous section, we covered all the tactics and strategies to optimize images for SEO.
Now, let’s dig a little deeper.
Here are some advanced practices that you can use to take your image optimization to the next level:
- Structured Data
- Lazy Loading
- Browser Caching
- Content Delivery Network
- Social Sharing Buttons
- Open Graph and Twitter Cards
Structured data is a code that you can add to your website to help search engines understand your content. It’s sometimes also referred to as schema markup.
Adding structured data can help improve your SEO by providing additional information about your images to search engines. This, in turn, can help increase your chances of appearing in image search results.
There are many different types of structured data that you can use.
Google Images supports the following types of content:
To add structured data to a product image, you need to add the following code:
<img itemprop=”image” src=”sample.jpg” alt=””>
This tells search engines that the photo is of a product.
You can also add additional information about the product, such as the price, name, and description.
To add structured data to a video, you need to add the following code:
<video itemprop=”video” controls>
<source src=”sample.mp4″ type=”video/mp4″>
<source src=”sample.ogg” type=”video/ogg”>
It tells search engines this is a video.
You can also include more information about the video, such as the name, description, and thumbnail image.
To add structured data to a recipe image, you need to add the following code:
<img itemprop=”image” src=”sample.jpg” alt=””>
This informs search engines that the picture is of a recipe.
You can also add additional information about the recipe, such as the name, description, and author.
In essence, if you use structured data, Google Images can showcase your photos as rich results.
These include badges that tell users key information about your page, which could lead to more people going to your site who are interested in what you have to offer. Like the below example:
Now, if you’re looking to see what sorts of rich results could be generated for your page, the Google Rich Results Test is where you should begin.
Then, for validation, use the Schema Markup Validator.
Lazy loading is a technique that delays the loading of images until they’re needed.
This means that any media below the fold (the part of the page that’s not visible without scrolling) are not loaded until the user scrolls down to them.
Here’s what Google stated about lazy loading:
Basically, lazy loading can help improve your website’s performance, as it reduces the amount of data that needs to be loaded when a page first loads.
It can also help improve your SEO, as site speed is a ranking factor.
Luckily, if you’re using WordPress, there are many lazy-loading plugins that you can use. One example is the a3 Lazy Load.
But there are others, such as Smush, Image optimization and Lazy Load by Optimole, or Lazy Load by WP Rocket.
This is another advanced strategy to optimize your images (and other content) for SEO.
With browser caching, the content is stored in the user’s browser, so the site loads faster when they visit the page in the future.
For example, when you visit a website for the first time, the browser needs to load all the files (including the pictures) from the server.
But if you visit the same website again, the browser can load some of the files (including images) from its cache. This means that the site will load faster, as the browser doesn’t need to fetch all the files from the server.
Here’s Google’s point of view on browser caching:
So, how do you set up browser caching?
To do it manually, you need to add code to your .htaccess file.
Here’s an example of the code you would need:
If you are not comfortable editing the .htaccess file, you can use a plugin, such as W3 Total Cache or WP Rocket.
You can also use a dedicated hosting provider, which will provide caching as an included feature (for example, WPEngine).
Content Delivery Network
A CDN is a network of servers that delivers content to users based on their geographic location.
For example, if someone in the UK visits a website, they will be served content from a server in the UK.
But if someone in Australia visits the same site, they will be served content from a server in Australia.
This is important for SEO, as it can help improve your page’s speed (as the content is delivered from a server that’s close to the user).
Here’s what John Mueller has to say about CDNs:
CDN URLs is fine, but I'd try to avoid moving image URLs too much, so I'd tend towards using your own domain/subdomain (via CDN).
— John Mueller is mostly not here 🐀 (@JohnMu) October 17, 2017
If you want to use a CDN, there are many options available.
Some of the most popular ones are Cloudflare, StackPath, and Amazon CloudFront.
Social Sharing Buttons
Social media is a great way to promote your content and get more traffic to your website.
When you add social sharing buttons to your images, it makes it easy for people to share them on social media.
And the more people that share your images, the more traffic you’re likely to get.
There are many social sharing plugins that you can use. One example is Social Warfare.
Also, if you’re worried about people stealing your images, you can watermark them.
A watermark is a text or logo that’s added to an image. It’s usually transparent, so it doesn’t interfere with the image itself.
Watermarks can help deter people from stealing your media, as it’s easy to see who the owner is.
And if someone does share your images without giving you credit, you can easily contact them and ask them to add the proper link source.
There are many plugins that you can use to watermark your pictures. One example is WP Image Watermark.
Open Graph and Twitter Cards
Open Graph and Twitter Cards are snippets of code that you can add to your website.
They help social media platforms (such as Facebook and Twitter) understand your content, so they can display it properly when it’s shared on social media.
For example, if you share a link to your website on Facebook, Open Graph will tell Facebook what image to display.
Without Open Graph, Facebook would just display a random image from your website.
Here’s what Twitter Cards look like on HTML:
You can add Open Graph and Twitter Cards to your website using a plugin, such as Yoast SEO.
Once you have installed the plugin, you can check with each of these validator tools to make sure that your code is correct:
- Twitter Card validator
- Facebook Sharing Debugger
- LinkedIn Post Inspector
- Pinterest Rich Pins Validator
Image SEO Online Tools
Using the right tools can also help you with image SEO.
Here are some of the best ones.
TinyPNG is a free online tool that helps you compress your media.
As already mentioned in this guide, it’s important to compress your pictures, as large images can slow down your website.
Slow websites are penalized by Google, so it’s important to make sure that your photos are as small as possible.
TinyPNG is one of the best compression tools, as it doesn’t reduce the quality of your images.
To use TinyPNG, simply upload your files and then download the compressed versions.
ImageOptim is a free app for Mac, but it can also be used online, by anyone upon registration.
It offers lossless compression.
This means that it doesn’t reduce the quality of your pictures, but it can is a tool that helps you optimize your JPEG images.
It’s available as both a paid app and a free online tool.
JPEGmini is a paid service that helps you with compression.
It’s similar to TinyPNG, in that it reduces the file size of your images without reducing the quality.
To use JPEGmini, simply upload your media files and then download the compressed versions.
Images are an important part of SEO.
By optimizing them, you can make sure that they’re helping your site rank better in search engines.
There are many ways to optimize them, such as using the right file format, leveraging compression, and adding alt text.
There are also many tools that can help you, such as TinyPNG, ImageOptim, and JPEGmini.
By using these strategies and tools, you can make sure that your images are helping you to achieve the best possible visibility and rankings.