Image SEO involves enhancing the images on your website to improve their visibility in unpaid search engine results, which helps drive more organic traffic to your site.
Some key image SEO tactics include:
The reason SEO image optimization is effective is that it makes it easier for search engines like Google to locate and comprehend your images. This increases the chances of your images and the pages they are on appearing in relevant search results.
Furthermore, optimized images load more quickly, enhancing user experience and allowing visitors to access the information they need without delay. These improvements align with Google’s ranking criteria, making optimized images a win for both search engine performance and user satisfaction.
Pro tip: Use Semrush’s Site Audit tool to receive tailored image SEO recommendations for your website.
Image SEO offers a significant advantage by improving the visibility of your images on search engine results pages (SERPs), which in turn can lead to valuable clicks from users. With billions of searches conducted through Google Lens every month, this app allows users to perform visual searches using their camera or an image.
Google also frequently incorporates images into its standard search results. For instance, on April 29, 2024, Semrush Sensor revealed that 55.62% of standard SERPs in the U.S. included an image pack.
These image results are essential for capturing attention and driving user engagement. Moreover, optimizing your images can boost your overall rankings, enhancing your site’s visibility across search platforms.
Implement these image SEO best practices to improve your website’s search engine performance and elevate the user experience.
The first step in optimizing your images for SEO is selecting or creating visuals that align with your goals and enhance your content.
Here are some ideas:
Whenever possible, try creating your own images instead of relying on stock photos. This gives your site unique value and increases your chances of ranking higher on Google.
If you do use others’ images, ensure you have proper permission to avoid copyright issues.
Pro Tip: Check out our list of the best content creation tools for a range of useful image creation and sourcing options.
Choosing the right image format is essential for optimizing your website’s performance and user experience. Image files can be saved or converted into multiple formats, but some options are better suited for specific uses.
SVG is ideal for logos and icons because it’s scalable without any loss of quality. Additionally, SVG images can be easily manipulated using JavaScript or CSS, which are key coding languages for web development.
For other types of images, WebP stands out as one of the best options due to its multiple benefits:
Despite these advantages, both SVG and WebP can be more challenging to create and manage.
As alternatives, consider using:
When it comes to SEO, Google relies on image file names to understand what the image represents. To improve your SEO and help Google recognize your images more effectively, it’s important to use descriptive and concise file names.
For example:
✅ apple-iphone-15-pink-side-view.jpg
❌ apple-iphone-15-latest-model-vibrant-pink-color-side-angle-view-showcasing-camera-lens-and-buttons-2024-release.jpg
❌ IMG00353.jpg
Important Note: Avoid using spaces in file names. Instead, Google recommends using hyphens to separate words.
Additionally, if the same image appears in different languages or regions, remember to update the file name to reflect the translation. For instance, on your Spanish domain, you might use iphone-apple-15-rosa-vista-lateral.jpg.
Alt text is a concise written description of an image stored within a webpage’s code. This description is placed in the alt attribute of the image tag, as shown here:
<img src=”image-file-example.jpg” alt=”Alt text goes here”>
Primarily, alt text is used to improve accessibility by allowing text-to-speech tools to read the description aloud, enabling visually impaired users to understand the content of the image. Alt text also boosts SEO by providing search engines with context about the image.
Alt text is crucial for image search engine optimization. Search engines rely on alt text to accurately understand the content of an image, which helps improve your website’s visibility.
Here are some essential alt text best practices:
Resizing your images to smaller dimensions is an effective way to boost your website’s loading speed, and it won’t necessarily impact the image quality. Typically, website images don’t need to exceed 2,500 pixels in width.
The optimal size for any given image is determined by factors such as:
Image editing tools like Photoshop make resizing straightforward, but you can also rely on website plugins (e.g., Resize Image After Upload for WordPress) to automatically adjust image sizes for faster load times.
When it comes to website optimization, compressing images is a must. Using tools and plugins to reduce image file sizes ensures faster load times without sacrificing image quality. Popular tools like TinyPNG, Squoosh, and GIMP make it easy to achieve this balance. By compressing your images, you improve site speed, which can enhance user experience and boost SEO rankings.
No matter which tool you select, you’ll need to adjust different settings to achieve the desired outcome.
Setting | Description | Guideline setting |
Lossy vs. Lossless | Lossy compression reduces file size by removing “non-essential” image data, while lossless compression maintains quality but typically results in less space savings. | Lossy |
Quality factor | For lossy compression, you can select a quality factor ranging from 0 to 100. The higher the number, the better the quality but also the larger the file size. | 75-85 |
Resolution | Resolution is typically measured in pixels per inch (PPI) or dots per inch (DPI). The higher the number, the better the quality and the larger the file size. | 72dpi |
Responsive image scaling allows website images to automatically adjust to the size of the user’s screen, ensuring they display correctly across all devices.
This technique improves user experience by preventing images from being too large on mobile devices or too small on desktops, making them easier to view. Additionally, responsive image scaling reduces load times by ensuring images are no larger than necessary. This is essential for image SEO, as faster-loading pages tend to rank better.
By implementing this practice, your website will run smoothly on any device, providing a seamless browsing experience for visitors.
To make images responsive, you can use CSS.
Some website builders, such as Wix, automatically apply responsive image scaling. If your platform doesn’t include this feature, you can either install a relevant plugin or seek assistance from a web developer.
Lazy loading is a technique that delays the loading of content until it’s visible within the user’s viewport, speeding up the page’s initial load time.
This method improves page speed by loading only the elements that appear above the fold—the visible portion of the page before scrolling. The rest of the content, typically below the fold, is loaded as the user scrolls down.
To easily implement lazy loading, simply add the loading=”lazy” attribute to your image tags:
html
CopyEdit
<img src=”image-file-example.jpg” loading=”lazy” alt=”Alt text goes here”>
Be sure to apply lazy loading only to images that appear below the fold on all devices. Applying it incorrectly to images that appear in the visible area could slow down your page instead of speeding it up.
An image sitemap is a specific type of XML sitemap designed to help search engines locate and index the images on your site. Essentially, it’s a file formatted to list all the images you want to be discovered and included in search engine results.
By creating an image sitemap, you ensure that search engine bots don’t overlook any essential images when scanning your website.
To create a properly structured image sitemap, follow Google’s recommended format:
xml
CopyEdit
<?xml version=”1.0″ encoding=”UTF-8″?>
<urlset xmlns=”http://www.sitemaps.org/schemas/sitemap/0.9″
xmlns:image=”http://www.google.com/schemas/sitemap-image/1.1″>
<url>
<loc>[URL for a webpage on your website]</loc>
<image:image>
<image:loc>[URL for an image on this webpage]</image:loc>
</image:image>
<image:image>
<image:loc>[URL for another image on this webpage]</image:loc>
</image:image>
</url>
<url>
<loc>[URL for another webpage on your website]</loc>
<image:image>
<image:loc>[URL for an image on this webpage]</image:loc>
</image:image>
</url>
</urlset>
Numerous sitemap generator tools are available to assist in creating your image sitemap. Once it’s created, use tools like Semrush’s Site Audit tool to check for potential issues. Go to the “Issues” section and search for “sitemap” to quickly identify errors, warnings, or notices that need attention.
A Content Delivery Network (CDN) enables you to store your images on multiple servers located around the globe. This boosts load speeds as data is delivered from the server closest to the user, rather than always relying on your origin server. The “closeness” is not determined solely by physical distance, but by which the server can transfer data most quickly and reliably.
This method ensures faster loading times, improving user experience and SEO performance.
Steps to Implement a CDN for Your Images
To set up a CDN for your images, follow these steps:
You may require assistance from a web developer to complete this process.
Browser caching allows a visitor’s browser to store files (like images) for a specified duration, which helps those files load faster when needed again.
For example, imagine a new user visiting your homepage. If your site logo is cached for a full year, it will load more quickly when the user navigates to other pages or revisits your site later. Without caching, the browser will have to re-download the logo every time, using more bandwidth and increasing the server load. Since images typically don’t change often, they can usually be cached for extended periods.
To ensure your site images are cached properly, you can use Google Lighthouse. After installing the Chrome extension, select the Lighthouse Viewer option to analyze the caching duration for images on your webpage. This will help improve overall site performance and user experience.
On-page SEO involves optimizing individual pages on your website to improve their ranking in search results and boost image performance.
Start by crafting a compelling title tag.
Google uses the title tag to gain insights into the content of your page, and it plays a key role in how your page appears in search results.
For example, David Austin Roses effectively uses “Apricot & Orange Roses” as the title tag for one of their pages, making it clear and relevant to users and search engines alike.
To avoid your text being truncated, aim for 50-60 characters for title tags and approximately 105 characters for meta descriptions.
For additional optimization insights, try Semrush’s On-Page SEO Checker.
This tool offers personalized recommendations based on industry best practices and an analysis of your competitors’ content.
Optimizing Open Graph meta tags is essential to ensure that your pages display correctly when shared across social media platforms. These tags allow you to control how your content appears, ensuring a professional and engaging preview.
There are four key properties that must be included on every page:
You can enhance your pages further by adding additional tags. For example, Semrush’s homepage uses a combination of Open Graph tags like:
html
CopyEdit
<meta property=”og:url” content=”https://semrush.com/”>
<meta property=”og:type” content=”website”>
<meta property=”og:title” content=”Semrush – Online Marketing Can Be Easy”>
<meta property=”og:description” content=”Turn the algorithm into a friend. Make your business visible online with 55+ tools for SEO, PPC, content, social media, competitive research, and more.”>
<meta property=”og:image” content=”https://static.semrush.com/wt-static/semrush-com.png”>
<meta property=”og:image:width” content=”1366″>
<meta property=”og:image:height” content=”768″>
These Open Graph tags ensure that Semrush’s page is displayed in an engaging, formatted way when shared.
If your website builder doesn’t support custom Open Graph meta tags, consider using a plugin like Yoast SEO for easy integration.
If you need assistance, reach out to a developer for support.
You can easily identify image-related SEO issues on your site using Semrush’s Site Audit tool.
First, set up your project, then navigate to the “Issues” tab and search for “image.” You’ll be presented with the results of seven checks:
If any “Errors” are listed, click the blue link for more details. For example, if there are broken internal images, the tool will provide a detailed report.
You can use the eye icon to hide issues that don’t require attention. Next, create tasks for any image-related problems by selecting the checkboxes and using the “Send to…” button to link to Semrush CRM, Trello, or Zapier.
Once you’ve resolved any “Errors,” move on to “Warnings” and “Notices.” Don’t forget to review other flagged issues that may affect your SEO performance.
Optimizing your images for SEO is a crucial step in enhancing your website’s performance, both for search engines and user experience. By implementing image SEO best practices—like resizing and compressing images, using descriptive file names, adding alt text, and selecting the right image formats—you ensure that your images load faster, appear in search results, and contribute to better overall rankings. Tools like Semrush’s Site Audit can help identify potential issues, guiding you in fixing broken links, missing alt text, and slow load times. Consistent image optimization will help drive more organic traffic to your site and improve user satisfaction, ultimately boosting your SEO efforts.
Answer: Image optimization improves your website’s loading speed, helps search engines understand your images, and enhances user experience. This can lead to higher rankings in search results and more organic traffic.
Answer: WebP is generally the best format for SEO due to its smaller file size and high quality. SVG is ideal for logos and icons, while JPEG and PNG are commonly used for standard images.
Answer: Alt text should be descriptive, concise, and relevant to the image. It helps search engines understand the content of the image and improves accessibility for visually impaired users.
Answer: Use image compression tools like TinyPNG, Squoosh, or GIMP to reduce file sizes while maintaining image quality. Resizing images to fit the container size can also help lower file sizes.
Answer: Use tools like Semrush’s Site Audit to identify image-related issues such as broken images, missing alt text, or slow load speeds. The tool provides recommendations for optimizing your images.
Make sure every image on your website includes alt text, except for purely decorative images. In the case of decorative images, use an empty alt tag.
Set appropriate image sizes according to their container. Avoid content shifting caused by image loads (CLS – Core Web Vital), as this can negatively impact the user experience.
For images that are the largest contentful element (LCP – Core Web Vital), consider implementing lazy loading for images below the fold and prefetching for those above the fold. This can enhance page load speed and user experience.
To enhance your images for Google Image Search, follow these strategies:
It’s important to keep in mind that image search typically doesn’t drive significant traffic to a website. When people search for an image, they usually find what they need in the search results and often don’t visit the website unless they’re quickly grabbing the image.
Consider this: how often do you perform an image search, click on the image, visit the website, read the content, and then make a purchase? Most likely, it doesn’t happen.
While it’s worth optimizing images moving forward because it’s quick and easy, revisiting already posted images for optimization may not provide a substantial return.