GIMP Save for Web Plugin How to Optimize Images for Web blog image

Images with larger size often take much longer time to open up. And, if we cut the image size, quality of the image reduces. Thus, it becomes a bane to cut down the image size without compromising on the overall quality. This is where the GIMP Save for Web plugin really outperforms. It is the best and the simplest way for the image size reduction.

GIMP Save for Web is a very handy tool with the help of which you can optimize JPEG, GIF and PNG images in a better way. It reduces the image size by removing the unnecessary metadata without having much effect on the image quality. It is very easy to use and offers an image preview with the help of which you can check how your image is going to look after cutting the size.

Let’s talk about this in detail.

 

How to Install GIMP Save For Web Plugin in Windows

Step 1: Download GIMP Save for Web plugin for Windows.

save for web download page

Step 2: Extract the zip file.

save-for-web-folder

Step 3: Copy the Extracted files to (C:)/users/”user-name”/.gimp-2.8/plugins/. The files that need be copied are shown below.

save-for-web-files

Step 4: Run/Restart GIMP for the changes to take place. A new option will be available in the File menu > Save For Web.

save-for-web-options

 

How to Install GIMP Save For Web Plugin in Linux

Note: Make sure you should be in the Sudoers list. Also, you should Unhide System Files (Ctrl + h) to locate .gimp-2.8 folder. These Steps have been succesfully tested on Ubunutu 16.04.

Step 1: Download GIMP Save for Web plugin for Linux.

Step 2: Unzip the .tar.gz in /tmp and Open terminal here.

Step 3: sudo apt-get install libgimp2.0-dev intltool

Step 4: cd /tmp/gimp-save-for-web-0.29.3

Step 5: ./configure

Step 6: make

Step 7: sudo make install

Step 8: Launch/Restart Gimp

Step 9: A new option is created at File > Save for web

Now, to understand it’s working let’s check out How to Optimize Images for Web using GIMP Save for Web.

When you are done tailoring your image, it is the time to save the changes made. The smartest way to do this is Save For Web plugin. Just go to file menu and then choose Save for Web. Here, you will find four different image formats namely JPEG, PNG-8, PNG-24, GIF. You can select the desired format you want your images to be saved with.

 

Saving in JPEG format

Let’s have a brief look at different options we get when we select JPEG format for saving our image.

Gimp Save for Web jpeg screenshot

 

Quality:

It helps you set the overall quality of your image according to your needs. You can lower down the quality of your image according to your needs and image size will reduce in accordance with it. Thus, finding the right medium between image quality and file size becomes very important to optimize better images for Web.

The right JPEG quality ensures that your images will look great and your pages load faster. It will even help you to rank your pages better in search engines results.

As a general benchmark for JPEG quality:

  • 92% quality gives quite a high quality of image while there is a significant reduction over 100%.
  • 85% quality gives an even more file-size reduction that too without sacrificing much in quality.
  • 80% quality reduces the size even lower but here you can acknowledge an obvious difference in the image.

 

Smoothing:

It helps you to reduce the image size by smoothing it as per your choice. If you set the smoothing to a non-zero value, your images will smoothen out slightly.

This reduces unnecessary artifacts and reduces the size of the image accordingly. Setting the smoothing at 0.10-0.15 reduces a fair amount of image-size without blurring the edges.

 

Optimize:

Image Optimization is a tool for making as good or as effective images as possible. Images across the Web often account for a significant amount of size and visual space and thus, optimizing images becomes far more important. It removes extra colors and adjusts the image dimensions and size according to different parameters.

Gimp Save for Web Image Optimization

It not only helps you manage your image size in a smart way but also improves the performance of your website. Optimized images not only load fast but also maintain an appropriate quality to make your pages/sites rank better in search engine results.

 

Progressive:

Progressive JPEG organizes data in such a way that the image gets loaded progressively i.e. image loads at low quality first and then details are added as the complete file becomes available. Therefore, while the image is downloading you could be previewing the image already.

Gimp Save for Web Progressive Optimization screenshot

Progressive images load in a number of passages thus you need not worry about the slow network connection or browser. Your image is going to load in a flash rather at low quality first and then progress is added continuously as the image loads.

 

Baseline:

Baseline JPEG images open up in progression i.e. in continuation from top left corner to the bottom right corner exactly like we write. As we open a web page image will start loading and we could be seen partially from the beginning itself. But, it will keep on loading in progression and once the data is completely received it will be displayed completely.

Gimp Save for Web Baseline Optimization screenshot

Baseline JPEG images open up in progression i.e. in continuation from top left corner to the bottom right corner exactly like we write. As we open a web page image will start loading and we could be seen partially from the beginning itself. But, it will keep on loading in progression and once the data is completely received it will be displayed completely.

 

Strip EXIF:

To understand about this feature we first need to understand about What does EXIF mean??

EXIF (Exchangeable image file format) is a standard format that contains all the information about the photograph like camera maker, camera model, flash model etc.

When a photograph is captured from a phone it may contain some more sensitive information like location, email address and uploading such images with all this information could be a serious risk. Thus, it becomes very important to stripe such an information from the image. That’s exactly what Strip EXIF do. It removes all such information from the photo and this also reduces a fair amount of image size.

GIMP Save for Web Strip Exif screenshot

Thus, Strip EXIF is a very handy feature when it comes to protecting your privacy. It is also a very handy tool to reduce the image size without harming the quality of image at all.

 

Saving in PNG-8 format

We will discuss how to save images into PNG-8 image format. So, let’s not waste time and get to work.

Gimp Save for Web png 8 screenshot

 

Generate Optimum Palette:

It allows us to manually select the number of colors we want to insert into our image. Lesser the number of colors we add so will reduce the size of the image. But, it is not only the size that reduces but also the quality.

We can add a maximum of 256 and minimum of 2 colors into our image. With the decreasing colors quality of the image also decreases.

 

Use Web Optimized Palette:

As the name suggests, it is the tool to automatically adjust the size of the image to make it load faster on the Web. It removes extra colors from the image and reduces the image size smaller to make it load faster as per SEO norms.

Unlike General Optimum Palette which adjusts the number of colors added to the image manually, this tool’s adjustment is all automatic.

 

Use Black and White Palette:

It allows you to reduce your image size by removing all the colors out of the image and make it black and white. This helps you to drastically reduce the image size making the image black and white. You do not need to remove colors manually rather select this option and the image will be turned into black and white.

 

Dithering of Transparency:

Dithering of Transparency means alternating pixels in a way to fill the broken patches in the color pattern to create subtle color variations. This effect smoothes the image edges making it appear more color rich.

 

Interlace:

Interlace is more like a progressive image format and allows an image on a web page to be progressively displayed as it gets downloaded.

Progressive image display becomes very handy when it comes to slow connection speeds. This is because images will be displayed in a flash. In the beginning, images might be in the lower quality but as they load quality improves. This is a very useful feature from SEO point of view as it helps to load images effectively.

 

Compression:

It is a feature with the help of which you can compress the size of your image. Your images are by default with the compression set at 9. You can reduce it further to compress your image to the smaller size. You can compress your image on a scale varying from 0 to 9.

 

Saving in PNG-24 format

You can save your image to this file format and it is very simple to do so as you only have to adjust compression and tick/untick the Interlace check box according to your requirements.

Gimp Save for Web png 24 screenshot

 

Saving in GIF format

Saving the image to the GIF format, you will have the same set of options and feature as described above in the “Saving in PNG-8 format“ section. You can accustom them according to your needs.

Gimp save for web gif screenshot

 

GIMP Save for Web also offers you to adjust the image dimensions while saving your image into any of these formats. Here, you can adjust the height, the weight of your image. You can also crop your image according to your preferences and needs.

These are the options and set of features we get with the GIMP Save for Web plugin. You can save your image into any of these file formats choosing the right set of features and dimensions according to your requirements.

For any further queries or suggestions feel free to approach us with your valuable remarks in our comments section below.