What is an image optimizer? | How to reduce image sizes

What is an image optimizer?

An image optimizer is a service, product, or library that makes image files smaller. Typically, an image optimizer will reduce the file size of an image by compressing and resizing it, ideally without compromising the quality of the image too much. This optimizes images for the web because they will take less time to load in a user's browser, increasing website speed and performance.

Why is it necessary to reduce image size?

All images that appear on a webpage need to be downloaded by the user's browser before they can be displayed. The larger an image is (in terms of file size, not dimensions), the longer it takes to download, and the more bandwidth it will will take up. If users are on a mobile device, large images will also use up a lot of their data as they download.

Therefore, keeping images small is crucial for website performance, and website performance is extremely important for SEO and for keeping users engaged and active on a website. Google prioritizes sites that load quickly, and users are more likely to bounce and less likely to convert if a webpage takes a long time to load.

How is image file size reduced?

The first step for reducing image size is to shrink its dimensions. The typical website will not need images that are 3,000-plus pixels wide, for example. (In fact, most desktop displays are 1,920 pixels wide or smaller.) Adjustments to the dimensions of an image should reduce file size without reducing quality.

Images can also be compressed. Image compressors (such as Photoshop's 'Save for Web' feature) can shrink JPEG files to a much lower resolution level, and the images will look essentially the same. However, images should still look professional, not pixelated. There's a tipping point where the resolution becomes so low that the accompanying performance gains are not worth it. Testing is important; images should appear professional on large monitors and small smartphone screens alike.

Are there other ways to optimize images besides resizing or compressing them?

The file format used for an image affects how large the file is. Most images for the web should be in JPEG format, not PNG or GIF. This is because it's easiest to adjust the quality (which affects the file size) with JPEG files. JPEG files are lossy, which means they lose visual information when they are compressed. As a result, compression can shrink JPEG files to a fraction of their original sizes, which is usually not possible with GIF and PNG files (both are lossless).

How does a CDN speed up images?

A CDN, or content delivery network, is a group of servers distributed around the world that store and deliver content, including images, to end users. CDN servers are optimized for speed, and they are located closer to end users than origin servers are, reducing latency and speeding up load times for images, video, and other content delivered over the Internet. Learn more about the Cloudflare CDN.

What is image SEO optimization?

Image search engine optimization and image optimization are separate, but related. Reducing image file size does help optimize images for search by reducing load times, and Google encourages developers to compress images when possible.

However, for an image to be truly optimized for search, developers should:

1. Give the image file a relevant, readable name, and include a relevant keyword if possible
2. Include a brief, descriptive image alt tag that is helpful for site visitors using screen readers and contains one or more keywords
3. Make images responsive and mobile-friendly
4. Caption images where doing so enhances the user experience and keeps users engaged
5. Include Open Graph and Twitter card images for social sharing