Advanced Image Optimization Tips You Need to Know

Written By

Rashida

Optimizing your website for search engines involves optimizing your images. To truly put your business in the best position for climbing the search rankings, you must incorporate key image optimization techniques.

Most people already know that you should add alt tags to your images and that using images, in general, is helpful for the website experience.

But, true image optimization goes a step further. 

Let’s dive past the basics and take a closer look at some image optimization tips you need to know.

Image Optimization

Even if you already know the basics about image optimization, it helps to review. The entire process is based on two primary objectives: speeding up page load times and improving your SEO.

Optimized images look excellent on desktop and mobile. They do not interrupt website performance, and they help your site rank higher.

The key is to strike the right balance between file size, compression level, height and width, and SEO image factors.

Benefits of Optimizing Images

Why is it so important to optimize your website’s images? Even though we may know the answer, it’s easy to lose sight of just how important this step is. Some of the key benefits of image optimization are:

Website Speed Improvement

One of the primary benefits of optimizing your images is to improve your website speed. Having even a two-second page speed delay can skyrocket your bounce rate up by 103%! Google has specifically stated that your page load time is one of the ranking factors

Improve the Visitor Experience

Take a guess whether or not your website visitors will enjoy slow page loading…

As you may figure, delays are inconvenient, frustrating, and annoying for browsers. People can feel a delay when it’s anything above 1/10th a second. Even a one-second delay is enough to disrupt the experience.

This is a major reason why pages with longer load times have higher bounce rates. One of the simplest ways to improve your user experience is to improve your load times. In the end, this will also help improve overall engagement and even conversion.

SEO Performance

Images are crucial for search engines and visitors to understand your website content. 32% of all search queries on Google include images. Optimizing them will help you rank higher on search engines, ultimately bringing in more website traffic.

Images are a core component of visual search. This is especially important for younger consumers who are geared toward visual search.

Choose the Right Image

First of all, you need to choose the right images. Not all of us can afford a dedicated photographer, and getting the right images can seem like a huge challenge.

The good news is that most smartphones can take high-quality images that will look great on your website. Even so, you do not need to actually take the photos for every image on your website.

There are many free stock photo websites with a wide array of photos. Two common favorites are Unsplash and Pexels, but there are many more. Beyond that, there are also many paid options for finding high-quality images. Just make sure you choose images that you are free to use or share commercially. We have an entire list of free royalty-free image sites you can check out here!

A key tip here is to mix up the type of images. You may not want to use only photographs. Consider illustrations, charts, infographics, animations, screenshots, and other images, especially for decorative images. Using a variety of image styles and types helps to make your website more visually interesting and appealing.

Image Optimization Techniques to Implement

Now that we’ve refreshed on the basics and importance of image optimization, let’s dive into some of the best strategies!

Lazy Loading

One helpful way to address the slow load time of large images is to use lazy loading. This defers the browser from loading the image until necessary. This provides a much better user experience for the visitor since the page loads up faster.

When the visitor scrolls down, then the images load as needed. If they never scroll down, the site does not load those images. This helps improve performance and create a better visitor experience.

Browser Caching

Browser caching means that files are stored on the visitor’s browser. The next time they come to that page, it will be able to load faster.

If you do not use browser caching, then the assets must all be reloaded again each time the visitor comes to the site. When you allow caching, then the browser already stores the images, allowing the page to load faster.

Relevant Image Names

When you download an image, it is often named something irrelevant to your website. It may include the site you got the image from, the image #, etc.

One of the simplest ways to optimize your images is to change the file names. Instead of leaving the generic name assigned by the camera or stock photo site, change the name to describe the image.

Let’s say you have a photo of a bag of natural dog food. Maybe you could name the image natural-dog-food-chicken-flavored.jpg.

In general, when naming the images, pay attention to customer search patterns. Dig deeper into the common keyword patterns and leverage them to name your image files.

Alt Tag Tips

You’ve likely heard that you need to add alt tags to images before. Alt tags are “alternative text” that the browser uses when it can’t render the images. It is also helpful for web accessibility. Adding them at all is a great step! However, there are some specific details to keep in mind:

  • Use simple language to describe what’s happening in the image
  • Include product numbers in the images when relevant
  • Do not stuff with keywords that don’t apply to the image
  • Avoid using for “decorative images” as Google can penalize you

Image Resizing

Resize your images to increase your website load time. People won’t wait for a slow-loading site. In fact, nearly half of consumers say they won’t wait even three seconds. Remember, page load time is a Google ranking factor.

Larger files take longer to load. Certain sites may automatically compress the images, but others will not. There are several helpful online tools for editing and resizing images including Canva and PicMonkey to name a couple.

How small should the images be? Well, you still want to maintain quality. eCommerce images should be roughly under 70 kb.

Choosing an Image Format

GIF, PNG, and JPEG are three common image formats. So which should you choose for your site?

  • JPEG (.jpg) is the standard web image format. It’s easy to compress JPEG images, helping you achieve the balance of quality and size. 
  • GIF (.gif) images are ideal for decorative images, simple images, or animation. They are of lower quality, so that is why they do not work as well as JPEG for larger images. 
  • PNG (.png) images are quickly becoming an alternative option. They preserve quality even with re-saves, unlike JPEG. They also support more colors than GIFs. however, file sizes tend to be much larger than JPEG.

In general, JPEG is still the overall winner for quality and size. They tend to be ideal for eCommerce websites and product photos. Avoid using GIFs for large photos, because of the extensive file size. Instead, opt for GIFs when it comes to decorative images and thumbnails. 

Thumbnail Optimization

Many websites use thumbnails, especially eCommerce sites with category pages. If you are not careful, thumbnails can kill your page load speed.

Use small image sizes for thumbnails. It may even be worth sacrificing a bit of quality for.

Furthermore, pay attention to the alt tag. Alt attributes for thumbnails should be different than the text used for the larger versions of the images. Try to make it clearly different, so that search engines do not accidentally index the thumbnail instead of the primary image.

Optimize Decorative Images

Decorative images are any that are not directly related to your products/services. Most websites are filled with decorative images like buttons, borders, background images, etc. 

Aesthetically, they can add a ton of appeal. They help your website look more professional and appealing. However, they can also quickly add up to cause slow load times. When using decorative images, you must be careful not to let them suck your website’s speed. 

  • Use GIF or PNG for simple images, like borders. This helps reduce the file size. 
  • When it makes sense from a design perspective, opt for CSS to create color areas rather than inputting images. 
  • Shrink down large images (especially background images) as much as possible without sacrificing the quality. 
  • Remove the middle of a background image to help decrease the file size.

Image Sitemap

Setting up an image sitemap helps ensure that Google will crawl all of the images on your site. The sitemap should include all of your image URLs. 

Creating the image sitemap helps boost your chances of showing up in relevant search results. Craft a dedicated image site map for this purpose. Keep in mind that you’re able to include URLs from multiple domains and can therefore use a Content Delivery Network (CDN) to host images.

Audit Your Images

Keep these important image optimization tips in mind as you build and expand your website. If you already have a website, then now is the time to go through and optimize your images. Yes, it does take some time to do this when you already have a bunch of images, but it will be well worth it.

Here are some steps for auditing your current website/images:

  • Fix any broken images/ ones that do not display. You can use a site audit tool to quickly identify broken images. Update the URLs or change the image when necessary.
  • Add or update alt attributes. All images should have an alt tag. Add a relevant alt tag to any that do not. Evaluate the current alt tags to make sure they are the most effective and do not repeat. 
  • Test page load times. If you identify slow-loading pages, then consider the images. You may need to resize them or change the format of decorative images. 
  • Rename your images. It’s certainly a pain, but you should rename any images with a generic file name to a more descriptive name.

Image Optimization is Essential for SEO!

Images should not be an afterthought when it comes to SEO. If you want to fully optimize your website and have the best chance of getting in front of your target audience online, then you must optimize your images.

Many image optimization tips are simple and just take some time. However, it is well worth it to implement all of these key image optimization techniques. Overall, images are a core part of your website, and optimizing them will help you rank higher in search engines. 

Image Optimization Gif

Like this post?

Try out Content Cucumber with a custom blog post written for your business.