How to design HTML for iPad?

Discussion in 'Web Design and Development' started by DennisMadsen, Feb 17, 2011.

  1. DennisMadsen macrumors regular

    Joined:
    Sep 21, 2010
    #1
    I'm trying to optimize one of my pages for iPad. You can see my test-page here: http://demo.dennismadsen.com/ipad/

    It contains a black box with a width of 800px. When I see it on my iPad and take a screenshow, I can see, that the box is more when 800px width - about 837px: http://demo.dennismadsen.com/ipad/screenshot.png

    I'm wondering why this is happening?
    The width of the screen is 1024px in landscape. If I'm showing a box with a width of 1000px I'm not seeing any margin on the right:
    http://demo.dennismadsen.com/ipad/index2.html
     
  2. Consultant macrumors G5

    Consultant

    Joined:
    Jun 27, 2007
    #2
    I believe iOS zoom in / out when possible, to fit the content. Apple has a patent on it.

    You should actually make a real page and content, then test.
     
  3. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #3
    Check this article for what's happening automatically and how to control the page zoom that is occurring.
     
  4. DennisMadsen thread starter macrumors regular

    Joined:
    Sep 21, 2010
    #4
    Please try to visit this page:
    http://demo.dennismadsen.com/ipad/example.html

    It's 1170px + 50px padding. It's too big for the landscape mode. When visiting the page, I expect that iOS will zoom out and view the complete page from left to right. But I cannot see the last part of the right side on my iPad.

    Why?
     
  5. Cabbit macrumors 68020

    Cabbit

    Joined:
    Jan 30, 2006
    Location:
    Scotland
    #5
    You better using a width of 100% and then em based measurements for children this is what i had to do to get my uni work working on the iPad.
     
  6. DennisMadsen thread starter macrumors regular

    Joined:
    Sep 21, 2010
    #6
    I'm not sure, where you think I should have the 100% width? I do not like the site to be 100% on a screen with a width of, for instance, 1600px. What about the childs you are talking about?
     
  7. jbyun04 macrumors 6502a

    jbyun04

    Joined:
    Aug 31, 2008
    Location:
    Canada

Share This Page