Home/ Questions/Q 6841959
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-27T00:02:05+00:00

I generally take an image in Fireworks, change it to the right size for

  • 0

I generally take an image in Fireworks, change it to the right size for the website and then export it for the web as JPG/PNG. This is fine.

I’ve been noticing that if I use a larger image in my <img> tag and then resize it with the CSS width property, it will be crisper and clearer than if I resized it in an Adobe product.

Do others get the same experience? E.g.: take an image that’s 100×100, resize to 50×50 in Fireworks, and 50×50 with CSS, and the image looks better with the CSS resize.

I understand the smaller the image the better for site load times etc.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    This depends on the browser and the image manipulation program.

    When you resize using CSS or HTML, you are asking the browser to do the resizing, instead of supplying a pre-resized image.

    Whether the resulting resized image is “clearer” depends on the image, the browser, and the resizing algorithm used (bicubic, bilinear, Lanczos, etc).

    For best results, you should resize it yourself. You can try a number of different resize algorithms in your image manipulation program. With a browser, you are depending on that browser to supply the right resize algorithm, and you can’t guarantee that every visitor will use the same browser…

    http://en.wikipedia.org/wiki/Image_scaling

    Also, as @PeeHaa already noted, giving the browser the larger image means more loading time. It also means more RAM usage in the browser.

    • 0