Optimizing images for the Web

Visuals can constribute a lot to a web application. On the flip side they contribute significantly to the amount of data that needs to be transferred from server to client. Higher data volume leads to slower page load times. Slower page loads lead to users being more likely to leave your application and ultimately cause a loss in revenue.¹1 See essays of companies like Google and Amazon Moreover, page speed affects search engine rankings for desktop searches and is soon to affect mobile search rankings. One way to improve page speed is to ensure that all images on the page are only as big as necessary. This is why we delevoped an image minification operator for Ameto.

Ameto's minification operator can be included in a processing pipeline just like any other operator. It recompresses the input image and returns a more space-efficient image with no significant impact on the visual quality. Let's see how it performs.

We started out our test with a picture taken with a semi-professional digital camera. Our goal was to turn it into an image spanning the full screen width on a website. For this purpose we had to (1) remove all metadata, (2) crop the image to the desired aspect-ratio, and (3) resize it to our target resolution (1920x900 px). We performed these steps with both a well known image processing tool ²2 GraphicsMagick and Ameto. We uploaded both images in the final resolution to the following slideshow to show you what they look like. Feel free to download the image created by GraphicsMagick and the image created by Ameto to inspect them in more detail.

he original image was a 6.1 MiB JPEG image. After stripping the image from all the metadata, we could bring it down to 5.2 MiB. Cropping and resizing the image with GraphicsMagick resulted in an 87.1 KiB JPEG. Performing the same steps with Ameto resulted in a file size of only 68.7 KiB – roughly 21 % smaller than the reference image.

This is how Ameto's image optimization operator performs on a single image. However, Ameto can help you shave off size of all your images – fully automated from data acquisition to publishing.