How to Optimize Images for Site Speed

November 2022

Images are often the largest files on your webpage. Larger image files can take time to load and will slow down the overall speed of your website. This, in turn, can hurt your organic search performance. Don’t risk slow load times that deter users and reduce your chances of ranking on crucial search engine results pages (SERPs). Learn how to optimize your images to make a visual splash without doing a belly flop behind the scenes. 

decorative image decorative image

Images are often the largest files on your webpage. Larger image files can take time to load and will slow down the overall speed of your website. This, in turn, can hurt your organic search performance. Don’t risk slow load times that deter users and reduce your chances of ranking on crucial search engine results pages (SERPs). Learn how to optimize your images to make a visual splash without doing a belly flop behind the scenes. 

Images are often the largest files on your webpage. Larger image files can take time to load and will slow down the overall speed of your website. This, in turn, can hurt your organic search performance. Don’t risk slow load times that deter users and reduce your chances of ranking on crucial search engine results pages (SERPs). Learn how to optimize your images to make a visual splash without doing a belly flop behind the scenes.

Why Site Speed Matters

Site speed is necessary for your website to remain competitive. By maintaining a fast load speed, you make a strong first impression, keep users from bouncing somewhere else and increase your conversions. This can be especially critical for ecommerce sites where you risk losing potential customers. If you think that an extra second or two won’t matter, think again. Amazon found that one second of extra load time could cost them $1.6 billion.

During Google’s core vitals update of 2021, the search engine (which channels 92% of web traffic) listed site speed as one of several new user experience factors that would affect a webpage’s rankings. With the risk of losing rankings over your site’s speed, you’ll want to make sure you have optimal imaging to keep things moving quickly.

How to Optimize Images for Your Website

Optimizing images essentially means reducing their file size without losing on-page resolution. To achieve this you want to deliver high-quality images in the right format, dimension, size, and resolution while keeping the smallest possible size.

Here are some website image best practices to keep in mind:

Use Concise and Direct Image File Names

Create descriptive, keyword-rich file names for your optimized images. Instead of using the string of characters that may have accompanied your image (depending where you got it), use clear and concise descriptions that are also optimized for SEO.

For example: the accompanying title for this image from Shutterstock is “shutterstock_2151335283.jpg.” You could use this title however, changing it to “2020-Harley-Davidson-Road-King-Black.jpg” informs search engines and your users what they will find on your site. It gives your content more clarity and cohesion.

2020-Harley-Davidson-Road-King-Black. An example of an optimized image.

Optimize Your Image Alt Tags

Alt text is a small blurb describing an image. It is intended to give sight impaired users a better accessibility and a clearer idea of what is on the page.

When you write your alt text, follow these best practices:

  • Describe your images in plain language.
  • Don’t overstuff your alt attributes full of keywords.
  • Keep descriptions short and concise.

Include product numbers and models when appropriate.

Resize Your Images

The most important way to optimize images for a website is to reduce the file size so that it doesn’t interfere with the page’s ability to load quickly. There are numerous online tools you can use for image editing.

TinyPNG and Bulk Resize are two free options that users find easy to use. Simply drop your image in their file window and download the reduced version.

tiny png site

Shopify also has a similar free image optimizer tool that allows you to select the image size ahead of time.

The key to resizing your images is to find the right balance between image quality and file size. In most cases any of the image compression tools above should suffice. Make sure you resize your images before you insert them in your webpage and that you use the new, smaller version of the file.

shopify image optimizer

Use the Right File Type

There are multiple image file types to choose from.  JPEG, GIF and PNG are the most popular. The golden rule is that JPEGs are the best image file type for your webpage. PNGs may have a larger color spectrum but JPEG files remain clear and crisp at lower file sizes. They will give you the best quality at the smallest size.

 

Keep Your Website Performance Clean

Reducing and renaming your images may add an extra step to your content process but it’s an important part of website performance optimization. It will help your site maintain a competitive edge and keep users from clicking away. For help with your content program or an audit of your existing site, contact the Gemini team today. We’d love to maximize the impact of your message across all digital channels.