GIMP Version: 2.8.10
Operating System: Windows
OS Version: Win7
GIMP Experience: Beginner Level

---

My image size is 200px X 200 px with 3 text words. When I post this to my html page and set the height and width to 80px, the image is sharp. When I scale the image to 80px X 80px and post to my html page, the image is fuzzy. Does a tutorial exist explaining which setting should be used?

Thanks,

Andy

I guess there is somewhere in Gimp-chat a similar question and the suggestion of the specialists was:
when you scale down an image you should first blur it with an amplitude related to the scaling factor, hence -in your case- 5.

In your navigator, use File>Open file to open the 80x80 image from your disk.

• If it's fuzzy, then the problem is local (scaling down is indeed degrading it), so show it to us (as well as the 200x200 version).
• If it is not, then the problem is likely something happening on the server that degrades a perfectly good image, two possibles causes:
  
  • the server has recompressed the image. Save the image from the server (right click -> save image) and compare to your 80x80 file (size, in particular). They should be identical, unless the server has re-encoded it (some sites bluntly re-encode your finely crafted PNGs into low-grade JPGs).
  • the HTML of the page is enforcing a slightly different size, so your browser is resizeing it on the fly (unless your browser isn't at 100% zoom...). Make a screenshot of your browser and measure the size of your image (or load both screenshot and original as layers in Gimp and check how they overlap).

Note that on the whole, text doesn't scale well because its sharpness depends a lot on the anti-aliasing pixels along the edges and the right ones at a given size aren't exactly those obtained by interpolating the ones from another size. Additionally, at small sizes the fonts are not scaled linearly, the character shapes are a bit different from bigger sizes to maintain readability.

Dinasset's recommendation to pre-blur the image before scaling down also helps avoiding scaling artifacts (jagged edges, mostly), but going from 200px to 80px requires a 200/80=2.5px blur.

(That should have been obvious to me.)

I scale down first, then add the text and the result is an acceptable thumb. Thank you both.

Andy