Image compression is an important part in preparing photos for the web. Here are some great tools and apps to assist in compressing your images.
You’ve captured an amazing sunset overlooking the Himalayan Mountains, a ring of birds encircling the corner of the frame. What an image! You can’t wait to sit down, write a 500-word blog, and post your breathtaking photos. However, after you’ve published your article, you test-drive your blog page and realize it’s loading slowly. You’ve neglected a crucial step that’s slowing down your page speed — image compression.
Why Image Compression Matters
What is Image Compression?
When you compress an image for the web, you use a tool or app to make the file size smaller. File size decreases by using a plugin or a script, removing image information, or otherwise reformatting the image.
What is File Size?
The overall goal of image compression is to reduce the file size to avoid weighing down your web page. Your image’s file size is a measure of how much space it takes up on a given storage medium, whether on your camera’s SD card, your computer, or your website.
File size is measured in bytes. Large photos may be as big as 1 megabyte (MB), while a compressed image can be as small as a few kilobytes (KB).
Why is it Important to Compress Images for the Web?
Compressing images increases page speed, as well as producing a clear image. Image via Alliance Images.
There are two main reasons why you should always compress images that are uploaded to the web.
A reduction in file size increases page speed. You don’t want your landing pages to be larger than 2 MB. Optimizing your images will help your site load faster, which, in turn, boosts your search engine rankings. Keeping your images and web pages small allows the page to load right away. Fifty-three percent of mobile users will close your site altogether if the page doesn’t load in three seconds. Your pages will also require less storage space on your server and use less bandwidth.If you properly optimize your image and use them in the right context, you won’t notice a dip in quality. As long as you use one of the tools below, ensure your pixel dimensions are adequate, and start from a rich, detailed image, your optimized photos will look virtually the same as the originals, at only a fraction of the file size.
What Are Web-Friendly File Types?
Choosing the right file type depends on the image you’re compressing. Image via Maxim Cherednichenko.
For most web uses, you’ll need raster images that are composed of a bitmap of colored tiles called pixels. The three most common raster file types used online are JPEG, PNG, and GIF.
JPEG files are ideal for photos and screenshots. JPEGs use lossy compression, which means they sacrifice image data to reduce file size. PNG files are larger, as they use lossless compression to retain all image data. PNGs are preferable for images with sharp geometric shapes, as the curves and lines will render cleaner. GIF files only use 256 colors, making them the best choice for animated images but little else. GIFs utilize lossless compression.
Luckily for you, we’ve compiled a complete guide to the best image formats for the web, so you can choose the appropriate file type before using the image compression tools below.
Online Tools to Compress Images for the Web
Simple, yet useful image compression tools exist online. Go to any of the websites below to compress JPEGs, PNGs, and other image files.
Online compression tools are great for editing photos. Image via Alexey Boldin.
Our free online image editing tool includes intuitive photo compression features to ensure your image is ready for the web. Choose between JPEG or PNG files and download the images at 72 DPI to optimize them for web use.
Pros — Shutterstock Editor includes a suite of features and options, in addition to image compression, to ensure your image stands out, is sized correctly, and uploaded in the ideal format. Choosing the right setting when downloading your image is straightforward. Cons — File sizes may not be as small as they would be in specialized image compression tools.
Kraken.io, a popular option, has a free online image optimizer, as well as a paid “PRO” version. Users can select between lossy, lossless, and expert compression. Unlike other online compression tools, Kraken optimizes your images for the lowest possible size.
Pros — With Kraken.io, you can upload images from Box, Google Drive, or Dropbox. With the free version, you can compress photos up to 32 MB in size. Kraken.io works quickly, even on the free plan.Cons — You’ll need to upgrade to the paid version to select multiple image sources, resize images, and compress more than 100 MB of photos.
Specializing in PNG and JPEG files, TinyPNG is one of the oldest go-to options for compressing images and one of the most consistently popular. Upload up to twenty images at once, and up to one-hundred during any given month, without paying a cent.
Pros — TinyPNG reliably reduces image size by about seventy percent. The interface is easy to navigate, and there’s a WordPress plugin, if you decide this is the tool for you.Cons — TinyPNG uses lossy compression, which won’t be an issue for many, but isn’t ideal for all applications. There aren’t many features beyond image compression.
If you’re only working with JPEGs, this could be the tool for you. JPEG Optimizer has a clean interface and a dependable process for compressing JPEGs destined for the internet.
Pros — JPEG Optimizer gives you the power to resize your images before you optimize them for the web. You can select an optimization level between zero and ninety-nine to find the balance between display quality and file size. Plus, it’s free!Cons — As the name implies, this tool strictly works with JPEGs. You’ll have to find another tool for PNG, GIF, and SVG files.
Compressor.io is compatible with PNG, JPEG, GIF, and SVG files, making it a versatile and robust option. It’s completely free, though you can support the developers with a PayPal donation.
Pros — Compressor.io often reduces image size by ninety percent, while maintaining quality. You can choose between lossy and lossless compression for added control. Results are typically reliable, regardless of the file format.Cons — Compressor.io only optimizes one image at a time, so bulk compression isn’t possible. There’s also no preview window. Features are scarce, but it still works well.
What a catchy name! Optimizilla allows batch compression of up to twenty images at a time and supports JPEG and PNG file formats.
Pros — The online tool features a slider so you can effortlessly preview what your images will look like after compression. Slide as far as you’d like to reduce the file size before experiencing a loss in quality.Cons — Optimizilla is free and performs well, so expect to put up with a few large banner ads, with buttons like “Convert” and “Start Now” attempting to pull you away from the tool.
Desktop Apps to Compress Images for the Web
Professional editors, designers, and creators use software to accomplish image compression from the familiarity of their desktop. Here are the top options to consider.
For miniaturizing JPEG images, why not go with the aptly-named JPEGmini? This functional tool substantially shrinks the file size of JPEG images and has a crisp, attractive interface that details how to compress a JPEG.
Pros — The practical slider tool compares the original image to the optimized version while you’re working. The batch resize feature enables you to resize any amount of images at a given time, which is a nice bonus. The Creator version includes Photoshop and Lightroom plugins. Cons — In what probably won’t come as a surprise, this app only optimizes JPEG files. Are you looking for a PNG-centric tool instead? Then may we recommend:
This Windows tool is, rightly so, loved by those who use it. PNGGauntlet achieves the smallest PNG file size possible, without reducing quality through OptiPNG, PNGOUT, and DeflOpt techniques.
Pros — PNGGauntlet can optimize any image into a PNG, including JPEG, BMP, TIFF, and GIF files. The impressive optimization results in web-friendly file sizes, even for complex images. The interface is painless, and the software is simple to use.Cons — PNGGauntlet can only be used on Windows devices. In addition, as the name implies, this tool only outputs PNG files.
ImageOptim utilizes lossless compression to prep photos and images for a life on the internet. Many bloggers use ImageOptim to help their page speed. This app is the rough Apple equivalent to PNGGauntlet.
Pros — ImageOptim is free, open-source, and committed to accessibility. The software is compatible with PNG, JPEG, and GIF file formats. The smooth, easy-to-use app has an interface that won’t intimidate beginners. Cons — This app is only compatible with Mac computers. Also, the app will eliminate the metadata of your image to reduce the file size. You will lose information like geolocation.
RIOT, or the Radical Image Optimization Tool, is an advanced free image compressor and editor that gives you the flexibility to adjust several parameters.
Pros — This is the free software of choice for users who want to determine the contrast, gamma, color, brightness, and metadata settings, in addition to adjusting the file size. Optimize JPEG, GIF, and PNG images in batches to save time.Cons — The interface is reasonably easy to navigate. Still, the features and options may be overwhelming for users who want a direct and quick compression tool for blogs and other everyday use cases.
Mobile Apps to Compress Images for the Web
Smartphones are an integral part of our daily lives. Designers and other creative professionals can compress images and optimize them for web use, without ever firing up a computer. Here are the top mobile apps for image compression.
JPEG Optimizer PRO with PDF Support
This android app accomplishes the neat trick of compressing images while, in some cases, enhancing picture quality. This app also supports conversion to PDF, which is useful in some instances, if not for web uploads.
Pros — While compressing your images, the app runs a unique ISO Noise Optimization Algorithm to improve the image quality. You can combine compressed images in multiple formats, including lesser-available options like PDF and ZIP files. Cons — Some users report that the menu can be buggy, making navigation difficult. The app is affordable, but there’s no free version at this time.
Bulk Image Compressor
If you’re on an Android device and are searching for a free compression app, you can’t get much better than Bulk Image Compressor. This convenient and efficient app delivers bulk compression for a series of photos on-the-fly.
Pros — Users can share compressed images directly from the app. The app includes a full-screen image viewer and completes bulk compression quickly.Cons — This app is currently only available for Android users. Because the app is free, it lacks some features included in paid image compression apps.
Photo Compress – Shrink Pics
This iOS app reduces the file size of the images on your iPhone to make room for additional files, thereby optimizing images for sharing on Whatsapp, Facebook, and Instagram, all without sacrificing quality. Choose between a free version and a paid upgrade with more features.
Pros — Users have the option to compress images in bulk. You also have the option to customize the final image size. The preview function prevents you from reducing the quality to a point where you wouldn’t share the image.Cons — The free version of Photo Compress – Shrink Pics has limited functionality. The bulk compression feature can take considerable time, depending on your available disk space. This app is also only compatible with JPEG images.
PhotoShrinker is an Apple exclusive. This app functions similarly to Photo Compress – Shrink Pics. With PhotoShrinker, you can compress images on your iPhone or iPad to one-tenth of their original size.
Pros — PhotoShrinker has a full preview mode, so there are no surprises after optimization. This app does an exceptional job of decreasing file size, while keeping the quality virtually the same. The interface is easy to navigate for beginners and pros, alike.Cons — PhotoShrinker is a paid app, so you can’t access its capabilities for free. What’s more, you can only optimize fifty images at a time.
Plugins to Compress Images for the Web
Add these plugins to WordPress so you can automatically compress images while uploading them to your website. However, don’t rely on these plugins alone to format your images for the web. For example, you still shouldn’t upload a 3 MB image to WordPress.
In terms of performance, ShortPixel stands above the crowd. The numbers don’t lie — this powerful plugin can shave off up to two-thirds of your images’ file sizes without dropping the quality.
Pros — ShortPixel features three compression options and delivers small files that still look beautiful online. ShortPixel allows you to convert images to WebP format and enables you to optimize up to 1,000 photos per month.Cons — Some users may find installing the API key difficult. If you decide to uninstall ShortPixel, you must also manually delete your backups. The freemium model means your costs can add up if you also optimize thumbnails.
Imagify Image Optimizer
This WordPress plugin advertises itself as “the most advanced tool to optimize images.” With the bulk optimization feature activated, you can choose between three compression settings. If you’re dissatisfied with the quality of a particular image, you can one-click restore.
Pros — Imagify is compatible with WooCommerce, NextGen Gallery, and WP Retina. Imagify compresses images on their third-party servers, so your website doesn’t slow down. The plugin includes options for deleting original photos and resizing larger ones. Cons — With a free account, you’re limited to 25 MB a month of original image size.
Optimole is a truly hands-off plugin, automating the process of image compression. One reason why Optimole stands out in a crowded field is its automatic downgrading of image quality when site visitors have a slow internet connection.
Pros — Optimole is entirely cloud-based and requires no work on your end. The plugin serves images at the appropriate size based on a visitor’s browser and viewport. This advanced detection helps your site load quickly on every device.Cons — There are two tiers of plans. You should upgrade to the premium plan if you need more processing space and bandwidth. Some troubleshooting may be required to avoid issues with other plugins.
WP Smush is available as both a free plugin and as a premium paid plugin. It will bulk “smush” up to fifty images at once, and you can manually compress individual images as well.
Pros — WP Smush uses lossless compression. It works by stripping away hidden information from image files, thereby lowering their size without sacrificing quality. The plugin also scans images you have already uploaded to your site to compress, as well. WP Smush works on JPEG, PNG, and GIF files.Cons — You can’t “super smush” images without the premium version of the plugin, meaning you can’t compress your images to the smallest size with the free version.
Searching for more web design tips and tricks? Check out these articles.
Black Backgrounds on Websites: How to Do it RightHow to Build Your Graphic Design Portfolio — Print, PDF, or Website?How to Resize an Image in Photoshop Without Losing QualitySimple Website Layout Design Tips Anyone Can FollowHow to Resize Images for the Web Without Losing Quality
Cover image via Thaspol Sangsee.
Read more: shutterstock.com