Hexagora Forum
Hexagora Forum
Home | Profile | Active Topics | Members | Search | FAQ
Username:
Password:
Save Password
Forgot your Password?

 All Forums
 Dynamic HTML Editor
 Dynamic HTML Editor
 How to get web page to display properly on iPhone?
 New Topic  Reply to Topic
 Printer Friendly
Author Previous Topic Topic Next Topic  

rmmarsh
Super User

USA
396 Posts

Posted - 20 Jun 2011 :  18:06:55  Show Profile  Visit rmmarsh's Homepage  Reply with Quote
I created a Help file for my iPhone app (see: http://imgur.com/GtMpa). That exact file shows up just fine in a desktop browser (see: http://pragerphoneapps.com/iHelp.htm).

How can I get this page to fit in the iPhone browser? (i.e. have the text flow properly, and re-size the horizontal rules).

s.dav
Site Admin

Italy
3364 Posts

Posted - 22 Jun 2011 :  11:49:38  Show Profile  Visit s.dav's Homepage  Reply with Quote
I tried to see your page in mine and the page is completely fit into the screen, althought not visible; IMO you need to create a specific copy for low-resolution devices

Regards, Davide
Go to Top of Page

rmmarsh
Super User

USA
396 Posts

Posted - 22 Jun 2011 :  14:52:10  Show Profile  Visit rmmarsh's Homepage  Reply with Quote
Davide: That's what I thought I did, but I guess not... how would you do that? (I have an idea of how I would do it, but I think you have more experience than I do in this issue).

R

Edited by - rmmarsh on 22 Jun 2011 15:55:15
Go to Top of Page

s.dav
Site Admin

Italy
3364 Posts

Posted - 23 Jun 2011 :  08:42:33  Show Profile  Visit s.dav's Homepage  Reply with Quote

I've never created a documentation specific for phones but I suppose I would act in this way:

1- create an entry point page on my site/documentation
2- detect the type of device (iphone, others) or the resolution (I would probably redirect only for phones (with small screens)) and redirect on the right documentation
3- for each type of device find the native resolution (iphone 3gs 320x480, iphone 4 640x960) or the average
4- in D.H.E. you can choose to make the page exacly as the resolution of the device (so place a vertical guide at 320/640) and draw objects into this area or use the maximum resolution of devices (640 for iphone 4), place the vertical guide and use big fonts so pages can be seen also in the 3gs without zoom
5- publish

Let me know ;-)

Regards, Davide
Go to Top of Page

s.dav
Site Admin

Italy
3364 Posts

Posted - 23 Jun 2011 :  09:12:37  Show Profile  Visit s.dav's Homepage  Reply with Quote
I made some tests:

check it here with the iphone (I tested it only with Iphone 3GS, I don't know if it works on IPhone 4)

http://www.hexagora.com/tmp/test-iphone

This site is optimized for Iphone 3GS, I used very large fonts and the page width is about 610px

I also used an iphone specific tag to optimize the initial visualization:

<meta name="viewport" content="width=630, initial-scale=0.5, user-scalable=no">

Check here other specific tags:

http://stackoverflow.com/questions/387318/what-are-all-the-special-iphone-ipod-touch-html-tags

Regards, Davide
Go to Top of Page

rmmarsh
Super User

USA
396 Posts

Posted - 23 Jun 2011 :  18:32:34  Show Profile  Visit rmmarsh's Homepage  Reply with Quote
Placing the vertical guide and using straight HTML works like a champ. I had some positioning issues, but solved them and the iPhone Help file looks great!

Thanks for the help... I appreciate it.
Go to Top of Page

joneq
Super User

433 Posts

Posted - 26 Jun 2011 :  17:51:40  Show Profile  Visit joneq's Homepage  Reply with Quote
was wondering if this was any use to anyone

http://codecanyon.net/item/zenlayout-manage-your-layout-with-ease/308570
Go to Top of Page
  Previous Topic Topic Next Topic  
 New Topic  Reply to Topic
 Printer Friendly
Jump To:
Hexagora Forum © s.dav Go To Top Of Page
Snitz Forums 2000