Image Optimization Basics

image optimization

If you control any type of website, you’ll need quality images. Knowing how to optimize your images is a basic SEO skill that you need to master for your online business. Image optimization benefits your site in several varied ways, from attracting more viewers and customers to reducing your site's load time. Here, Virtual Market Advantage will go over the basics to get you started on image optimization for your website’s visual marketing!

What is Image Optimization?

Before we get into the details of optimizing your images, it’s helpful to know more about what it actually involves. Basic image optimization is about reducing the file size of your image as much as possible without sacrificing the quality of the image. You need to do this if you want to speed up the load time of your website. It’s been proven that even slight delays on website loading times can deter many potential customers.

Image size is also important for SEO. It helps get your product and decorative images to rank higher in Google and other search engines, so you bring in more viewers searching for your niche. Image optimization also involves some elements of behind-the-scenes SEO work and graphic design.

How to Optimize Images for the Web

There are roughly ten steps you need to follow when it comes to setting up good image optimization:

  1. Write descriptive image names in plain language.
  2. Optimize your alt attributes carefully.
  3. Choose image dimensions and product angles wisely.
  4. Reduce the file size of your images.
  5. Choose the right file type.
  6. Optimize your thumbnails.
  7. Use image sitemaps.
  8. Be careful with decorative images.
  9. Use caution when using content delivery networks (CDNs).
  10. Test your images.

Let’s take a closer look at these elements to help you understand and complete each step.

1 - Naming Images Descriptively

This step is easy to overlook but is an important part of image optimization. Once you’ve chosen your image, take the time to think about how you would want to describe it.

Your image descriptions are important for SEO. Make sure you use relevant keywords to help your webpage rank on the search engines, which don’t only crawl the text paragraphs on your webpage, but also the images and their descriptions. Make sure that your image has descriptive words as well as relevant keywords.

2 - Optimize Alt Attributes Carefully

Unfamiliar with alt attributes? They're the text messages that appear in place of images when the browser can’t render them properly. They’re also used for web accessibility. When the image is rendered and you hover the mouse cursor over it, you can see the alt text pop up, depending on your browser settings.

Alt attributes also add to your SEO value. Adding appropriate alt attributes with the right keywords to your images can help you rank better in the search results on any search engine. This is one of the most important ways to make sure that your e-commerce products show up in Google image and other search results.

3 - Image Dimensions and Product Angles

It’s a common feature to show multiple angles of the same product, so the customer can see exactly what they’re about to purchase. If you provide this service, keep your images as small as possible while remaining easy to see. Also make sure each one has a unique alt attribute, rather than copying the same attribute to each image.

4 - Image Size

The majority of viewers won’t wait longer than 3 seconds for an image to load before they scroll past or leave for another website. This is a huge problem if you have an e-commerce business with slow-loading images! For image optimization, the smaller the size, the better. A good rule to follow is to keep your images below 70 kB. This can be difficult to do with larger images, but should be possible with some effort.

If you don’t have Photoshop to use to reduce the size of your images while maintaining their integrity, there are many online tools that can help you accomplish the same task. Adobe does offer Photoshop Express for phones and tablets, which comes with all the tools necessary to edit your photos without the hefty price tag. You can also get a free picture editing software such as the GNU Image Manipulation Program GIMP, which is very similar to Photoshop. There are also many websites out there that specialize in reducing image sizes, but always double check that the image quality looks good after its size change.

5 - File Type

There are 3 major file types used for web images – JPEG, GIF, and PNG. JPEG is an older file type that has become a standard, partly because of its ability to keep the quality of the image intact when compressed to a small size. However, JPEGs tend to lose quality over time through repeated transfers and saves. GIFs are lower quality than JPEGs and are used for simple images and animations. PNGs are on the rise, because they provide higher quality and more colors than GIFs and don’t degrade over repeated uses like JPEGs. They don’t save the quality of the image as well as JPEGs do if it’s a complex, very pixelated picture. Which file type you use will depend on the circumstances, but you can usually get by with a JPEG for more complex images, a PNG for images that have large blocks of the same colors, or a GIF for animated images.

6 - Optimize Thumbnails

Thumbnails are little sneak peeks of images found on other webpages. They’re often used to display products on a page that might also interest your viewer. Be careful with the amount of thumbnails you show, as they can affect your page’s load time. To avoid this problem, keep these images as small as possible. Make the alt text for thumbnails different from and shorter than the larger version of the image.

7 - Image Sitemaps

Image sitemaps help the web crawlers for Google and other search engines find specific images on your site. In order for all of your images to be indexed into Google, you'll want to create a sitemap for all of them. This is exactly what it sounds like - a map of where all your images are located on your website.

Creating a sitemap doesn’t guarantee that your images will get indexed by Google, but it’s a factor that helps step up your image SEO. It’s important that you add specific tags to each image, or you can create a separate sitemap to exclusively list each image. Either way, make sure you have all the correct and important information listed for the images. Google has a list of sitemap guidelines that can help you make sure you have everything you need.

8 - Be Careful with Decorative Images

Decorative images are any pics that aren’t product-related. These include your background, buttons, and borders. Sure, these types of images add aesthetic appeal to your site, but they can also slow your load time way down. Here are a couple of things you can do to keep those decorative images without the added load time:

  • Simple patterns or borders can be converted to a PNG-8 or a GIF file.
  • Use CSS to create colored areas instead of using images.
  • Shrink down large style wallpaper backgrounds, as these files may be way too large for your site.

9 - Use Caution With CDNs

Content delivery networks are the places to go when it comes to hosting images and media files. Just beware that CDNs can affect the backlinks on your webpage. If you’re using a CDN, you’re probably doing it to create bandwidth on your site and make it load faster. What you may be unaware of is that in doing this, you’re taking the actual image off of your page and indexing it with the CDN instead. This will remove backlinks for your site. There are ways around this problem, but unless you’re well-versed in image SEO, you’ll likely need the help of a professional to help you come up with a strategy.

10 - Test Your Images

After you’ve gone through all the step above and are ready to put an image on your website, you should have a test run before you send it out live. This will allow you to tweak any issues that aren’t working, as well as get some good data feedback that will help you make further improvements.

You’ll be able to see if your description, alt text, and image size are good for your site. You’ll also be able to see if your load times are fast enough. This is a great time to try out some A/B testing. Test factors such as which angles of the image your customers like best, how many images you should put on a page, or how many products you should have listed in a category. All of this data can help you set up your e-commerce better, with the help of good image optimization.

Image optimization might seem like a daunting process, but it’s important to set it up properly so that your website loads quickly and your images help draw in viewers. Taking the time to do this right the first time will make your website run more smoothly and allow you to focus more on the customers and your growing business!