Comments on: How to make your web content look stunning on the iPhone 4′s new Retina display

By: Patrick H. Lauke

Patrick H. Lauke — Sun, 18 Dec 2011 13:35:33 +0000

Sorry, late to the game here, but I was just testing some browser behaviour relating to this and stumbled across your post. My question: for web content, why bother with the specific media query stuff to serve higher-dpi images only to high-dpi devices? Why not just specify the high-dpi versions in all cases, and let browsers on lower-dpi devices render the graphic down? Is it purely to have absolute pixel-perfect control over how things look on low-dpi devices? And not just with CSS, also good old image elements…

By: matt

matt — Fri, 09 Dec 2011 19:08:02 +0000

thanks! This helped me out greatly

By: Lee Probert

Lee Probert — Thu, 25 Aug 2011 14:16:05 +0000

Would make sense for the time being for Safari on an iPhone 4 to do the image swap in exactly the same way it would for the native apps.

Until there’s a slicker solution that works with all ‘future’ hi-res displays.

By: datenkind

datenkind — Thu, 14 Jul 2011 14:01:40 +0000

Thanks for this little guide. I just stumbled over some problems with a small embedded webserver that fracked up the SVG i used for menu icons and which worked great on the Retina – when not using this embedded server. I can’t re-engineer the problem, but I just did it your ways – and it just works. :)

By: Designing for the Retina Display (326ppi) « bento blogging

Designing for the Retina Display (326ppi) « bento blogging — Fri, 27 May 2011 02:33:23 +0000

[...] How to make your web content look stunning on the iPhone 4’s new Retina display by Aral Balkan outlines the high-level impact of the Retina Display on Web design & development. [...]

By: andy matthews

andy matthews — Tue, 11 Jan 2011 20:42:23 +0000

Thanks for this article Aral. Exactly what I needed for the mobile website I’m building.

By: Max C

Max C — Mon, 29 Nov 2010 12:41:44 +0000

It isn’t the start of resolution independence, it’s the end! Once displays hit 300dpi, there is no further to go. That’s the resolution magazines are produced at. Once 300dpi is commonplace, it will be the standard resolution forever.

By: Troy Mcilvena

Troy Mcilvena — Mon, 25 Oct 2010 21:57:20 +0000

For the jQuery users:

http://troymcilvena.com/post/998277515/jquery-retina

For MooTools users:

http://mootools.net/forge/p/mooretina

By: Anthony Alexander

Anthony Alexander — Fri, 22 Oct 2010 06:09:03 +0000

Once again mac fans have no clue what they are talking about. It’s troubling.

By: Chris

Chris — Mon, 18 Oct 2010 10:01:38 +0000

An important advice: It’s better to use the Webkit-specific CSS property “-webkit-background-size” instead of the generel “background-size” because iOS 3.1 can’t interpret the latter.