CODEWITHSUNDEEP
htmlretina
Andrew Morris
Andrew Morris

Reputation: 1652

HTML size for retina display

I don't often get to work for high resolution displays as most of my clients tend to work with the oldest machines known to man, however I'm currently working on something which will only be displayed on retina display iPads. A graphic has been mocked up of the design they want to the retina resolution (2,048 by 1,536) and I've been building my site based off the dimensions in the graphic. However now I'm actually trying to view it on an iPad, everything is far too big, my '260px header' which I assumed would take up a 6th of the page (ish) is closer to double that.

I don't seem to be able to find anything regarding a workable HTML size for retina displays, only pages talking about how to prep images for retina, what size resolution should I work to when building the HTML?

Upvotes: 0

Views: 912

Answers (1)

Andy Holmes
Andy Holmes

Reputation: 8047

I believe the best way for you to achieve this is to use CSS where possible and build your site at 1024x768 utilising @2x graphics for retina devices.

A simple guide on utilising these ideas can be found here - http://www.kylejlarson.com/blog/2012/creating-retina-images-for-your-website/

Upvotes: 1

Related Questions