As imaging technologies move from pixel sizing to physical (cm, pt, etc.) sizing, web browsers will need to resample images to the user's display resolution. We can no longer rely on all inline images being created at 96 dpi, stored at 96 dpi, sent over the wire at 96 dpi, and displayed at 96 dpi. We can't rely on Mozilla's current "nearest neighbor" scaling algorithm that introduces horrible aliasing artifacts because the ugly appearance of scaled images will discourage web site designers from using resolution-independent markup and stylesheets.
These steps always reproduce the problem in Mozilla build 2001101803 on Windows ME:
In both quirks and standard mode, scaled images have ugly aliasing due to nearest-neighbor resampling. (This also happens in MS Internet Explorer 5.0, 5.5, and 6.0.)
To reduce aliasing by 6 dB/octave, use bilinear interpolation instead of nearest neighbor resampling. If this poses a performance problem, make it a preference.
Bug 90813 covers the same problem with respect to text rather than inline images.
This section demonstrates the operation of Mozilla's current image scaler.
|
| Original image at 16x16 pixels |
|
| Actual result at 128x128 pixels (HTML) |
|
| Approximation of Mozilla 0.9.5 actual result at 128x128 pixels (GIMP nearest-neighbor resampling) |
|
| Expected result at 128x128 pixels (GIMP linear interpolation) |
This section demonstrates more typical scaling ratios that occur when an image stored at 96 dpi is displayed at 72 dpi or at 120 dpi.
| Original image at 64x64 pixels |
|
| Actual result at 32x32 pixels (HTML) |
| Expected result at 32x32 pixels (GIMP linear interpolation) |
|
| Actual result at 48x48 pixels (HTML) |
| Expected result at 48x48 pixels (GIMP linear interpolation) |
|
| Actual result at 80x80 pixels (HTML) |
| Expected result at 80x80 pixels (GIMP linear interpolation) |
|
| Actual result at 96x96 pixels (HTML) |
| Expected result at 96x96 pixels (GIMP linear interpolation) |