[email protected] wrote on 28-01-17 18:10:
Ray_Net wrote:
[email protected] wrote on 28-01-17 15:27:
Ray_Net wrote:
I have a big image 1852 pixels x 1852 pixels

When I use in html <img alt="xxxx" src="logo.jpg" height="79"
width="79" border="0"/>

The rendering by SM is superb

BUT using this have a side effect that when the end-user have this
picture on the web-page ... He downloaded the original picture
1852x1852 which is 2.042 KB


To avoid this, I use Irfanview to shrink the picture to a 79
pixels x 79 pixels so the end-user download this modified picture
which is 14 KB

And the rendering of this picture <img alt="xxxx"
src="logo-small.jpg" height="79" width="79" border="0"/> by SM is
poor.

I wonder if perhaps the "79x79" image is actually being displayed at
more than 79x79 pixels on screen, giving better quality. Do you have
the zoom in SeaMonkey set to 100%? Or are you using a high-DPI
monitor? I'm not sure if certain CSS styling or other things might
also affect the scaling.

If, for example, SeaMonkey's zoom was set to 200%, I'd expect that
image to be displayed at 158x158 pixels. A large image scaled down
to 158x158 pixels for display, is going to look better than a 79x79
pixel image scaled up to 158x158.

The zoom was and is always at 100%
I have used 79x79 because I have other "logo" on the same line, so
each logo have the same height 79.

Any other image would also be affected by any scaling, so setting both to 79 would indeed make the sizes match, but that doesn't necessarily mean they're displayed as 79 pixels on screen.

You can see the result at the end of this page:
http://www.randoevasion.be/index.php?lang=fr

For me with SeaMonkey set to 100% those images do indeed render as 79 pixels height on screen, so it's probably not that unless you're using a high-resolution monitor (where the image would need to be rendered large in terms of pixels to appear the same size as on a conventional monitor).

I'm guessing it's the "UPMM" logo that you're working on, since that's the one that's significantly large than displayed. Since it's a logo with large blocks of colour, you might get better quality (and possibly also better compression) by using PNG rather than JPEG format. If possible, start with a "clean" version of the logo, which has never been saved as JPEG.

Is it possible that SM download the logo.jpg picture - then applied
the reduction to 79x79 - then save this new file somewhere - before
showing it in the final page ?

Can I retrieve this picture.file ? Or have you another bright idea ?

As others have mentioned, the scaling algorithm used in your image
editor can have an impact on the final quality.

If you want to capture the image SeaMonkey actually displays, you
should be able to press "Print Screen" on the keyboard and paste
into an image editor. Or some image editors have a screen-capture
function within the application (GIMP does, at File > Create >
Screen Shot, I don't know about Irfanview). Then crop the screen
capture to just the image you want and save it. You'll also find
out that way whether it's really being displayed at 79x79 pixels on
screen or something more.

I had used this method PrtSc but the result was poor.

That is odd. It should capture exactly what SeaMonkey is displaying! Perhaps the problem is with the process of saving the file. Definitely try using PNG rather than JPEG. JPEG is more optimised for compressing photos, where colours are continuously variable and edges are not particularly sharp, and takes advantage of that. It tends to give odd artefacts around sharp edges on logos though. PNG is lossless, so doesn't affect the image, and does a good job of compressing images with large blocks of the same colour (like logos) - but it's not so good for photos.

I am happy with the result I got, but next time, I will give a try with the png format.
_______________________________________________
support-seamonkey mailing list
[email protected]
https://lists.mozilla.org/listinfo/support-seamonkey

Reply via email to