: How can I beat the browser when it comes to reducing image size? Can't get my head around this. I tried several ways to reduce the pixel size of a logo in Gimp. However, the browser (either

@Sherry646

Resizing raster images always results in some quality loss. The degree is subjective and scaling up tends to highlight flaws while scaling down is more forgiving.

The browser will render an EPS "scaled down" better than opening it in GIMP and later scaling it down because an EPS is not typically a raster image. It is stored as "math" and only gets rendered to pixels for display. Your browser is "scaling" by plotting the coordinates of the curves at the specific pixel intervals tailor-made for the pixel size specified in your html.

When you open in GIMP and then scale it, you are rasterizing the image for a larger grid size and then later scaling down by averaging pixels. This leads to small errors. The best outcome for you will be to somehow specify the desired final display size when opening the EPS in GIMP so that the curves are plotted especially for that size. If you do need to open it larger than that, then sizes which are powers of 2x the desired size will be the best choice (2x, 4x 8x size).

Vote Up Vote Down

@Shelley591

If the browser truly does it better, resize in HTML and then screen shot it.

Vote Up Vote Down

@Ann6370331

Resize your raster image in several steps. At each step divide the width and height by 2 (or lower) and apply some sharpening.

Vote Up Vote Down

@Si6392903

The quality of the reduced image depends on the process used, and of course of the original files.

2 things that you can try are:

1) Work in a much higher resolution. For example, if you need a final file of 100x100px work on an image 800x800px and at the end, resample it to the final size.

2) Apply some sharpening on this final size file.

You have to be certain the image is displayed in its real size in your web page, not resized afterwards in the html properties or a css value.

And make sure you are not compressing too much a jpg file. For logos the png format is better option than jpg. But also you can try some vector format like svg.

Vote Up Vote Down