Today I made a rather interesting discovery, once again making me lean ever-more towards favoring Webkit powered browsers over Firefox.

 

Recently I was working with using screenshot captures in a web page, and as I didn't have time to incorporate automatic resizing using GD library, I had temporarily reset the dimensions of the images using CSS (I know, huh?). As I was helping someone with something related to one of these pages, I was alternating between Chrome and Firefox (since this person uses Chrome and I use Firefox primarily).

 

I mentioned to him that I hadn't had time to resize the images in the proper way yet which was causing the images to look jagged and unclear. But as I said this, I had looked at the screens and I was surprised to see they were perfectly clear - that's when I realized I was viewing the page in Chrome.

 

I suspected Chrome was using a much more sophisticated resampling approach so I tried resizing a landscape photo I found online and comparing the difference.

 

Like night and day, the difference is incredible!

 

Now let me first make it abundantly clear that almost any webmaster will discourage you from ever relying on HTML markup or CSS to resize your images; it is cruel to both servers providing the bandwidth and to the client who has to download the files. Plus, some browsers (like Firefox - as seen here) do a lousy job and resampling the image.

 

So check out those screen shots and tell me you don't notice a difference! ;)

 

The image is originally 1280x720 and I resized it to 250 pixels wide using CSS (those are the top two images). For the sake or providing a close up of the difference, I enhanced both browser renderings two times (using "nearest neighbor" in Photoshop as to preserve the pixels).

 

Webkit powered browsers such as Chrome and Safari handle this CSS/HTML resizing incredibly well - almost so much as to make GD Lib resampling unnecessary (though of course it is cause: bandwidth, bandwidth, bandwidth).

 

In my opinion the difference is quite remarkable and really is one more example of Mozilla needing to get their sh!t together to keep up with Webkit.