Contents
What is RIOT – Offline Image Optimization Tool?
RIOT, or Radical Image Optimization Tool, is a unique tool for Windows OS designed to help optimize images for the web offline. Free software allows you to adjust image compression parameters visually, ensuring the smallest file size while maintaining good quality.
RIOT is an essential tool for optimizing a website’s images. It provides a real-time comparison between the original and optimized image, allowing you to see the changes in file size immediately. This feature is handy for those unfamiliar with the technical aspects of image optimization, as it provides a visual guide to the process.
Why Use RIOT Web Image Optimization?
The importance of RIOT web image optimization cannot be overstated. Large, unoptimized images can slow your website, leading to bad user experience and search engine rankings. RIOT helps to prevent this by reducing the size of your images without significantly impacting their quality.
How Does RIOT Work?
RIOT supports various image formats, including JPEG, GIF, PNG, and, in the latest update, WEBP. It offers automatic optimization, manual color reduction, and the ability to remove unnecessary metadata from JPEGs, such as the EXIF block. These features make RIOT web image optimization a versatile tool for all your image optimization needs.
Setting Up RIOT – Offline Image Optimization Tool
You can download RIOT from the official site or download from the MajorGeeks site RIOT page.
If you’re unsure which version to Download and you’re on the latest Windows OS, the best option would be “Riot x64 application installer”.
Install the downloaded file.
The default path should be:
C:\Program Files\Riot
Remember the path if you chose something else since we’ll add some plugin files into the plugins folder:
C:\Program Files\Riot\plugins
Run the RIOT offline image optimization program.
Before you open any image, you see two gray boxes.
Under the left box, click on [PNG]. This action will select PNG output file optimization.
On the right side of the options, you will see “External optimizers.”
This list contains three optimizer plugins: AdvPNG insane (fast), OptiPNG o3, and PNGout Xtreme (very slow).
Each of these optimizers adds extra compression to your image if you compress the PNG images.
You can close RIOT since we’ll be downloading these plugins.
AdvPNG Plugin
Download the binary of the plugin from the AdvanceMEME download page.
Search for “AdvanceCOMP” binaries. In the description, you should see “Windows binary for x64”.
Extract the contents of the archive to the RIOT plugins folder so the main executable path will be:
C:\Program Files\Riot\plugins\advpng.exe
OptiPNG Plugin
Download OptiPNG from the official source site:
Extract the contents of the archive to the RIOT plugins folder so the main executable path will be:
C:\Program Files\Riot\plugins\optipng.exe
PNGout Xtreme Plugin
Navigate to Ken Silverman’s Image Utility Page.
Find “PNGOUT.EXE” there and click it to download.
Place it in the plugins folder so that the final path will be:
C:\Program Files\Riot\plugins\pngout.exe
RIOT Offline Image Optimization Tool Usage
Always back up the images you want to compress when working with RIOT since there is an option to Save in place. If you click it by mistake, you will still have the original.
Open the RIOT offline image optimization program.
[Open] the image file.
You will now see two images.
On the left is the original. Above it, you will see the label “Initial image” and its size.
On the right side is the image processed by RIOT. Above, you will see the label “Optimized image,” which should be smaller than the original image after optimizations and compression.
Under the images, you will see a toolbar.
On the toolbar’s left side are output formats to save the image to JPEG, PNG, GIF, or WEBP.
On the right side of the toolbar, there are additional options: Rotate, Flip, Resize, and Compress to size.
When using “Compress to size,” you enter the desired size in kilobytes, and the program will try its best to optimize the image to that size.
When clicking the “Resize” option, you can do it by percentage on each axis or entering pixel amount. When choosing a Resampling filter, “Lanczos3” is the slowest but will give you the best quality for resizing resampling.
Output to WEBP
The WEBP image format, developed by Google, represents a modern image compression and optimization approach. As an advanced image format, WEBP offers superior compression ratios, enabling it to maintain high-quality visuals while significantly reducing file size compared to traditional formats like JPEG and PNG. This aspect is crucial for web performance and user experience, directly influencing website speed, efficiency, and SEO. RIOT (Radical Image Optimization Tool) is instrumental for efficient offline image optimization. You can read more about WEBP and its history on Wikipedia.
As you can see, WEBP format is preferable over other image formats while working on a website.
Note: after you save the image, check that the quality suits your desire.
In the RIOT offline image optimization program, Click [WEBP].
You will see another toolbar related to the selected format at the bottom.
Click the [WebP Options] tab at the bottom.
- The “Quality” slider is the main feature here.
As you change the quality in the “WebP Options,” you will see that the “Optimized image” size also changes. The lower the Quality, the lower the Optimized image size. - Check [V] High compression (slow).
This will make your WEBP image lighter. - Compression type: (*) Lossy
This is the lowest image quality, resulting in a lightest image. If you select “Near Lossless” or “Lossless,” the image quality will be higher, resulting in a heavier image.
Click the [Image adjustments] tab at the bottom of the program interface.
These options are the same for all the formats: WEBP, JPEG, PNG, and GIF.
Enabling “Greyscale,” of course, will lower the Optimized image size.
You can play with other values if you wish. Just notice the difference in the Optimized image size.
Output to JPEG
JPEG can be much lower quality than PNG, meaning it can take much less space than PNG. But JPEG doesn’t have a transparent background. If you need a transparent background, then use other formats that do.
Click [JPEG], then [JPEG Options].
The “Quality” slider works the same as in “WEBP”.
In the “Encoding” option, selecting “Progressive” makes the image lighter.
You may check the [Image adjustments] tab for more options.
Output to PNG
Click [PNG] in the RIOT offline image optimization tool.
You can use the “Color reduction” option to reduce the number of colors, for example, to 16 colors palette.
However, if you change color, make sure in “Color quantization algorithm” to select “(*) NeuQuant neural-net (slow).” It will give you more quality when changing colors.
You can also use the option “Reduce colors to” by manually selecting the number of colors you want to reduce. In this case, the “Color reduction” option will be omitted.
In the “Compression” option, choose “maximum (very slow).”
Select the first optimizer in the “External optimizers” section and click the “Play” icon under the selector. This action will execute the optimizer. Then, select the second optimizer and click the “play” icon. Do it until you execute all the optimizers.
Don’t forget the [Image adjustments], as we explained in the “Output to JPEG” section.
Saving the Output File
To save the file after all the processing in the [File] menu, click [Save as…].
Batch Mode
RIOT also supports batch processing of several files simultaneously with the same settings.
Similar Tools Online Image Optimization Tools
There are several other tools like RIOT, but you must upload images to their site online and then download the optimized one. If you’re okay with that, here are the popular options: the TinyPNG website and the Compressor IO website.
Conclusion
RIOT is a must-have for faster websites. It lets you easily shrink image sizes without losing quality. With RIOT offline image optimization, your website can load quicker, making users and search engines happy. Try RIOT and see the difference it makes!
If you find any mistakes or have ideas for improvement, please follow the email on the Contact page.