SEO Optimized Images: Essential Guidelines You Need to Know

How to
7Like
Comments
Share
SEO Optimized Images: Essential Guidelines You Need to Know

Human beings have always been very visual, which is why you need to focus on using images in your content marketing, especially on your website. However, simply having images on your website isn’t enough to positively impact your SEO.

When you look at these e-commerce websites with great SEO, you will see that these sites are doing a lot of things right with their images.

Visuals have the ability to draw in visitors and keep them engaged long enough for them to complete your desired action, which is why optimizing them is considered an important aspect of SEO best practice.

With a few simple steps for optimizing images, you will see improvement in your Google rankings and in the number of visitors to your website. Here I will elucidate the essential SEO image guidelines you need to know.

Infographic: essential image SEO guidelines you need to know

1. Image File Optimization

Whether your website is created on one of the many free blogging sites available, or is being created from scratch by a web designer, you need to think carefully about the kind of images you upload. It is best to first examine the image file types you are planning to use because each type has its own pros and cons that will affect how your site works.

Images used on the web usually fall into one of three file types: JPG, GIF, and PNG. JPGs are the most popular of the three because of the amount of complex information they can contain including a large number of colors and patterns. The resolution of JPGs tends to remain preserved whether it’s high or low quality, which is part of the reason for its popularity. JPGs are a great option for anyone looking to use images with a lot of complexity, such as photographs.

GIFs tend to be a very small size no matter how much information they contain, which is why they are a good choice to use for your website. However, GIFs have a very limited color palette and low resolution. For small images, GIFs are a good resource, but not if you want to attract your visitors long enough to stay on your website.

Similar to GIFs, PNGs have a small color palette, but versions of PNGs can include far more complex information without losing resolution. On the flip side, the more complex a PNG is, the larger its file size becomes, which is not what your website needs. But the reason PNGs are a good choice of file type for your website is because they have transparency, so you don’t need to worry about an image background that clashes with the look of your site.

Choosing the right file type can strongly impact how your site looks and the impression it gives your visitors, so examine your image options before using them on your site.

Google recommends using the following formats for specific cases:

  • Use the JPG format for photos.
  • To create vector graphics, use SVG. If vector images are not available, try WebP or PNG.
  • To display more colors and achieve a better compression ratio, choose PNG instead of GIF.
  • Use the <video> tag for videos.

Use the most popular formats to avoid problems with browsers being unable to index your images and display them properly.

2. File Sizes

While deciding on file types, you also need to consider file sizes. The larger the size of your file, the slower your website will load. A slow-loading website will turn away potential visitors. When you have done the hard work of enticing visitors to your site, the last thing you want to do is lose them because of slow loading speed.

If visitors leave your site too early, your SEO ranking can be severely affected because Google tracks how quickly your site loads and ranks you accordingly.

Additionally, because of the increase in mobile internet use, websites need to load faster than ever since users are constantly on the go, using their data to browse the internet. They will not want to waste data on a site that takes too much time to load.

Test out a variety of file sizes to see which one loads fastest without losing any resolution before making your page or website live. This will ensure that your site has optimized images that will make the user experience worthwhile and improve your SEO.

2.1. Use Image Enhancement Tools

To ensure that your image is visually optimized for your website, you will likely need to use a few tools. While simple tasks such as cropping and color correction can be accomplished with a photo editor, for more quality edits, you will need to turn to other available tools.

You can use free tools like GIMP or TinyPNG to compress your images so that the file size remains small without your resolution being affected. If your website is designed on WordPress, the Yoast SEO plugin is a good tool for optimizing images, as is WP Smush.

With the help of these tools, you can enhance your images so that they look good without taking up too much space on your server and slowing down your website.

3. Image SEO: Actionable Tips

Here we are. The tips you have been waiting for :)

3.1. Optimizing Captions and Alt Text

Once your images are optimized for file type and size, you need to look at how you name and tag them. Optimizing your content for Google is extremely important for your SEO ranking, which is why you need to look at how you write your image captions and alt text.

For starters, you need to name your file correctly before uploading it to your website. Try to avoid using generic names and numbers, instead use something that is relevant to the page and the keywords you are using for that page. Remember to use hyphens and not underscores, as Google cannot read underscores, so will read all the words together.

When you upload images to your content management system, you will usually see a text box for alt tags or alt text. You should use your webpage keyword here, without overstuffing it with too many keywords. Using the right keywords in your alt tag will help your image and website rank on Google’s searches.

Alt attributes are also used to describe your image content to visually impaired users, which is another reason to ensure that your alt tags are well-written.

Example of an optimized image with alt attribute
Example of an optimized image with alt attribute

The same is true for captions, another area where you should try to use your keywords judiciously. Though captions do not impact SEO directly, they help with readability and the user experience, which drives SEO.

It may seem like an insignificant thing, but optimizing the words associated with your images is vital in the long-run. Using keywords in your image file name, captions and alt tags correctly will positively boost your SEO and engage your audience.

How to Check Alt Attribute Using Netpeak Spider

Using the Netpeak Spider, you can find all images without an alt attribute on your site. To do this, follow these steps:
  • Open Netpeak Spider. Go to a sidebar → in the ‘Parameters’ tab of the ‘Content’ section check the ‘Images’ option.
    Netpeak Spider: parameters in a sidebar
  • Wait for the tool to complete the crawling. In case the issue ‘Images without the alt attribute’ is detected, click on its name in the sidebar to see the list of URLs where it is spotted.

3.2. sitemap-image.xml

You can provide Google with additional information about the images on your site’s pages. To do this, create an image sitemap file. This will make it easier for the Google search robot to find images that otherwise could not be detected (for example, if the site is loaded using JavaScript).

For pictures, you can create a new sitemap or update an existing one on your site. Using the built-in sitemap generator tool in Netpeak Spider, you can generate sitemap files with a few clicks based on the latest Google recommendations.

Learn more about the correct settings for the sitemap-image.xml file in Google Help Center.

3.3. Schema Markup

Sometimes marked images can get into the SERP.

An example of how marked up recipes appear in search results

In addition, images from online stores and video splash images can also get into in the search results.

Learn more about Google’s recommendations for image markup.

3.4. Lazy Loading

Lazy loading is a method that delays the loading of content elements while an entire page is loading. This method ensures that only the files that are visible on the page’s screen are downloaded, with all other files remaining ‘behind the scenes’ until the user scrolls down to them.

The lazy loading method allows you to speed up page loading. In addition, it is useful for pages where many images are loaded outside the first screen (such as blog posts, and portfolios).

Images used in <img> elements more often than not need lazy loading. When you use this method for such images, JavaScript is used to check whether or not they are seen. Which is why you need to make sure that search robots will see these images.

Learn more about lazy loading on the Google Help Center.

3.4. Images on Responsive Websites

Adaptive sites make it possible for website owners to avoid having to recreate designs for each image resolution. Adaptive sites resize and position the individual elements according to the size of viewing area.

Responsive pages are usually more convenient to use, as they can be viewed on various devices. For more detailed recommendations on working with images on a responsive website, read this ‘Web Design Basics’ course.

Images are placed on the responsive page using the <img srcset> or <picture> tags. Keep in mind that not all browsers and search robots recognize these tags, so I advise you to specify the backup URL with the <img src> attribute value.

4. Avoid Stock Images

Images are important not only for making your site attractive but also for giving your visitors context about your product or service. As convenient as it would be to invest in stock images, which have become fairly easy to access over the last few years, stock photos can’t convey your brand identity as well as original images can.

Branding continues to be an important factor in marketing, whether on your website or on social media, and stock images simply aren’t equipped to tell your brand story.

What marketers are now finding, according to these latest branding statistics, is that consumers far prefer custom content than generic content or stock imagery. Creating in-house content that makes your brand instantly identifiable is the direction you need to go with for your images.

Creating content is not an easy task, which is why marketers and small businesses are now turning to online services that provide infographic templates, alongside a number of other visual templates.

These services allow you to adapt your brand identity across different visuals, as well as give you several options to customize the graphics you use.

This makes the process for creating more graphics easier to execute over a short period of time, thus saving you a great deal of effort. And with the use of these custom graphics, you will be able to entice your audience to remain on your site longer, which will increase your SEO.

For example, using Venngage’s infographic templates we’ve created a custom infographic you’ve seen in the beginning of this post.

In a Nutshell

Creating a website and filling it with text isn’t the best way to engage your audience. Using a host of relevant images is what will make a difference to the user experience of your site and decrease your bounce rates. Do you want to know how Google Images can help e-commerce websites? Read the research on why e-commerce businesses should pay attention to images.

  • You need to ensure that you use the correct file types that convey your message, while keeping your file sizes small.
  • Creating custom images will draw in your audience more effectively than using stock images, and you can use a number of tools to enhance the images you already have.
  • Lastly, you must be cognizant of your file names, and about writing good captions and alt tags.

Following these guidelines will benefit your image SEO immensely and positively impact your website’s rankings in the long run.