Retina graphics for your website | Hacker News Reader

Retina graphics for your website

retinajs.com

36 pointsbriandear12 comments

That seems incredibly inefficient. Wouldn't it be better to simply just server higher resolution images for users with a user-agent that matches the third-gen iPad, MacBook Retina, or any other high DPI devices?

Totally agree. CSS has media queries for that: http://blog.iwalt.com/2010/06/targeting-the-iphone-4-retina-...

There is no distinct user-agent for HiDPI Macs. Indeed, some Apple computers can be switched into HiDPI modes by the user. (For instance, my 15" laptop can run in a 720x450@2x mode.)

Thank you for saying "High DPI", I'm sick of that Retina quasi branding BS.

It is not quasi, it is just branding. It is not BS, just a clever name with specific meaning—which is more specific than "high DPI". Where exactly does high starts and middle ends? DPI does not take into account viewing distance, because it is all about linear measurement. "Retina" is about angular. If is is smaller than average eyes ability to resolve then it is retina, what's BS about that?

"Retina" is just as ambiguous as "High". Apple didn't invent anything with "Retina" screens so branding is pretentious, pixel density is just that: a number.

No. Retina means that you can't distinguish pixels at your normal reading distance. A number is meaningless without understanding the technology.

And I wouldn't downplay Apple's involvement in the Retina displays. Their prepayments allow for companies to do R&D/production.

It's weird because the iPhone 4 pioneered the "Retina" marketing and didn't need "Retina ready" websites.

But I'm not sure about "High DPI" either. I feel bad for future customers who have to decide between (crappy) HD and (good) High DPI displays. There simply is no good term for "devices where one CSS pixel maps to four physical pixels".

Then again, at least we don't need to worry about "High DPI" becoming obsolete in the same way as 16-bit "High Color" has. Or is there any conceivable scenario where we'd need higher-than-Retina DPI? Cyborg eyes?

>It's weird because the iPhone 4 pioneered the "Retina" marketing and didn't need "Retina ready" websites.

That's because webpage images in an iPhone 4 screen are resized to be smaller anyway (to fit), whereas in a 15" MacBook Pro you see them in their original dimensions but with half the detail of nearby fonts, hi-dpi images or vector assets.

Actually, "Retina", for all the branding-ness, is more scientific (as it incorporates facts about actual human vision, display density, angle of view, distances, etc), than "High DPI" which is just an un-quantified description.

Interesting concept, but it seems to slow at this point. My iPad lagged for several seconds (unable to interactive with the page at all) after the page had seemingly mostly loaded (but before the big background image appeared). Making a lot of requests at load time makes the page unresponsive, especially if you're not even making the requests asynchronously[1].

[1]: https://github.com/imulus/retinajs/blob/master/src/retina.js...

Why wouldn't you just use a media query and serve based on that, rather than make redundant requests?

Reply on news.ycombinator.com