Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Blurred Images Are Everywhere

medium.com

Post reply on HN
Print view View original

31–40 of 43 posts

Re: Blurred Images Are Everywhere

#31

Post by kinkrtyavimoodh »

mrguyorama wrote: post #28
M4v3R wrote: post #20

Earlier quoted context omitted.

On a MacBook with a retina (high-DPI) screen, the browser resized versions of animal photos look much sharper to me, because the browser utilizes all the pixels, while the resized image doesn't utilize screen's resolution fully.

I was wondering why I wasn't noticing the problem the author talked about.

https://news.ycombinator.com/item?id=15704661

Make sure you resize the screen if you are reading this on a browser

Re: Blurred Images Are Everywhere

#32

Post by simooooo »

kinkrtyavimoodh wrote: post #3

Make sure you are reading this blog on a phone or change the width of your browser to resemble that of a phone, otherwise you won't be able to see what he is trying to point out. On normal laptop screen size, the 'original size browser resized' ones are sharper than Photoshop resized ones.

On my phone and the dog one looks identical to me

Re: Blurred Images Are Everywhere

#34

Post by ricardobeat »

This is the case since late 2015, and they haven't budged since. If you want to provide a @2x image to look nice on hi-dpi, or simple responsive elements, you are out of luck. It worked fine before, I really don't get why this is being ignored. At my job we went so far as experimenting with image-rendering: optimize-contrast, but it doesn't work well for logos / solid shapes, so we have to live with blurry crap in the most popular browser.

https://bugs.chromium.org/p/chromium/issues/detail?id=562162

Re: Blurred Images Are Everywhere

#35

Post by thrownaway954 »

I think this is a non issue for most visitors and sites. I can see this being a problem for photography sites and enthusiasts, however, for the average Joe like myself, our eyes have not been trained enough to "look" for the imperfections the author is describing.

Re: Blurred Images Are Everywhere

#36

Post by s17n »

AstralStorm wrote: post #26
bla2 wrote: post #21

Earlier quoted context omitted.

Chrome used to do lanczos filtering, but moved to bilinear because it needs less energy and looks good enough, especially in high-dpi. Seems like an ok engineering decision.

As if even simple cubic interpolation is energy intensive. Or allowing the GPU to scale instead of doing it in software.

Every milliamp counts on mobile and users don't give a shit about subtle differences in image quality. Chrome is doing the right thing here.

Re: Blurred Images Are Everywhere

#37

Post by mikejmoffitt »

This is just a study of filtering algorithms. The author is just looking at Photoshop's (default!) bicubic filtering, which emphasizes high-frequency detail content at the expense of accuracy. The browser examples are doing simple linear filtering.

Re: Blurred Images Are Everywhere

#38

Post by fjsolwmv »

cmg wrote: post #19

I find it very clever that the author is using characters in the Unicode "Mathematical Double-Struck Small" range for the title, so that it appears blurry in the browser title bar.

On android it's just boxes because the font isn't available

Re: Blurred Images Are Everywhere

#39

Post by qume »

"What developers should do right now is to turn on webkit auto-sharping property"

No, no please don't take this advise.

This is a good start on an important subject, but it's not that simple. The aliasing on line art type images is horrible, even on the example on the page.

Re: Blurred Images Are Everywhere

#40

Post by stephenr »

ricardobeat wrote: post #34

This is the case since late 2015, and they haven't budged since. If you want to provide a @2x image to look nice on hi-dpi, or simple responsive elements, you are out of luck. It worked fine before, I really don't get why this is being ignored. At my job we went so far as experimenting with image-rendering: optimize-contrast, but it doesn't work well for logos / solid shapes, so we have to live with blurry crap in th…

Isn't the solution to use a media query to deliver 2x images only to double-density screens?
Post reply on HN