Designin 4 iPad

Lots of questions today …

What are the main things when a page is designed for iPads?
I did it, 1024x960 and nothing fits right on the screen. Especiall
when I turn the pad …

  • I have a white line on the right side
  • When I turn the pad, nothing fits within the screen
  • what is the best width?
  • what is the best hight?
  • Set the documant iPhone atributes to what? Automatic?

More will follow …


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Found a first help here:

http://www.softpress.com/images/uploads/Building_iPhone_WebsitesII.pdf


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

If you want your page to flex to fill the iPad screen, regardless of
orientation, then your first step will be to build a fluid layout.
Make sure your page is set to Align: None in the Inspector. Then make
sure that all elements on your page have their width set in
percentages rather than in pixels.

Second, understand that iDevices like to resize HTML text to be a more
readable dimension depending on zoom percentage, regardless of how you
have defined that dimension. This can lead to awkward mismatches of
headers to text, and images to text if you use graphical text as
headlines or subheads. Stick to one method of defining text
dimensions, like maybe keywords or ems, and you won’t be nearly as
surprised.

Walter

On Nov 18, 2010, at 9:45 AM, TomP wrote:

Lots of questions today …

What are the main things when a page is designed for iPads?
I did it, 1024x960 and nothing fits right on the screen. Especiall
when I turn the pad …

  • I have a white line on the right side
  • When I turn the pad, nothing fits within the screen
  • what is the best width?
  • what is the best hight?
  • Set the documant iPhone atributes to what? Automatic?

More will follow …


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Walt 1000 thanks - I’l try it and will give a feedback …


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Looks good so far.

  • 2 more question: What about the hight?
  • When I set the hight to 768px, the page is to high…

This has obviously something to do with the iPhone settings within the document settings

  • what are the correct iPhone settings within the document settings?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Have you seen this?
http://www.ipad-emulator.com/

Type your url in the browser

Nathan Garner

http://www.austinwellsdesign.co.uk

FW5 Pro | MacBook Pro | Snow Leopard

On 18 Nov 2010, at 16:12, TomP wrote:

Looks good so far.

  • 2 more question: What about the hight?
  • When I set the hight to 768px, the page is to high…

This has obviously something to do with the iPhone settings within the document settings

  • what are the correct iPhone settings within the document settings?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

And if you click the grey border it changes the orientation.

Nathan Garner

http://www.austinwellsdesign.co.uk

FW5 Pro | MacBook Pro | Snow Leopard

On 18 Nov 2010, at 16:15, Nathan Garner wrote:

Have you seen this?
http://www.ipad-emulator.com/

Type your url in the browser

Nathan Garner

http://www.austinwellsdesign.co.uk

FW5 Pro | MacBook Pro | Snow Leopard

On 18 Nov 2010, at 16:12, TomP wrote:

Looks good so far.

  • 2 more question: What about the hight?
  • When I set the hight to 768px, the page is to high…

This has obviously something to do with the iPhone settings within the document settings

  • what are the correct iPhone settings within the document settings?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Nathan thank you for the link - but it wont lead to the ipad page. (Used the lead to ipad/iphone action on the main page …)
The screenshot is far away from what I see on my ipad … :O(


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Nathan, that’s really great, but oops Š

The first downside it does not display mobile content like the iPhone or
iPad does, the pages are clipped. The second downside, it does not
automatically get the iPad specific pages, in other words if you’re on a
real iPad it goes here:

http://dt360.co.uk/mobile/ipad/

If I just put in the base URL:

http://dt360.co.uk/

I get the normal non-mobile site.

on 18/11/2010 16:15, Nathan Garner at email@hidden wrote:

Have you seen this?
http://www.ipad-emulator.com/

Type your url in the browser

Nathan Garner

http://www.austinwellsdesign.co.uk

FW5 Pro | MacBook Pro | Snow Leopard

On 18 Nov 2010, at 16:12, TomP wrote:

Looks good so far.

  • 2 more question: What about the hight?
  • When I set the hight to 768px, the page is to highŠ

This has obviously something to do with the iPhone settings within the
document settings

  • what are the correct iPhone settings within the document settings?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Best wishes Peter

================================
Peter Tucker, Oxford UK email@hidden


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Ah. I havent actually used it for testing - just saw it on a link someone had sent me and assumed that it showed the position correctly.

Nathan Garner

http://www.austinwellsdesign.co.uk

FW5 Pro | MacBook Pro | Snow Leopard

On 18 Nov 2010, at 17:00, Peter Tucker wrote:

Nathan, that’s really great, but oops …

The first downside it does not display mobile content like the iPhone or
iPad does, the pages are clipped. The second downside, it does not
automatically get the iPad specific pages, in other words if you’re on a
real iPad it goes here:

http://dt360.co.uk/mobile/ipad/

If I just put in the base URL:

http://dt360.co.uk/

I get the normal non-mobile site.

on 18/11/2010 16:15, Nathan Garner at email@hidden wrote:

Have you seen this?
http://www.ipad-emulator.com/

Type your url in the browser

Nathan Garner

http://www.austinwellsdesign.co.uk

FW5 Pro | MacBook Pro | Snow Leopard

On 18 Nov 2010, at 16:12, TomP wrote:

Looks good so far.

  • 2 more question: What about the hight?
  • When I set the hight to 768px, the page is to high…

This has obviously something to do with the iPhone settings within the
document settings

  • what are the correct iPhone settings within the document settings?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Best wishes Peter

================================
Peter Tucker, Oxford UK email@hidden


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

There are the Develop > User Agent > Mobile Safari tools in Safari 5 that can help with seeing how you page behaves (remembering to turn off flash etc. in preferences).

Nathan Garner

http://www.austinwellsdesign.co.uk

FW5 Pro | MacBook Pro | Snow Leopard

On 18 Nov 2010, at 17:00, Peter Tucker wrote:

Nathan, that’s really great, but oops …

The first downside it does not display mobile content like the iPhone or
iPad does, the pages are clipped. The second downside, it does not
automatically get the iPad specific pages, in other words if you’re on a
real iPad it goes here:

http://dt360.co.uk/mobile/ipad/

If I just put in the base URL:

http://dt360.co.uk/

I get the normal non-mobile site.

on 18/11/2010 16:15, Nathan Garner at email@hidden wrote:

Have you seen this?
http://www.ipad-emulator.com/

Type your url in the browser

Nathan Garner

http://www.austinwellsdesign.co.uk

FW5 Pro | MacBook Pro | Snow Leopard

On 18 Nov 2010, at 16:12, TomP wrote:

Looks good so far.

  • 2 more question: What about the hight?
  • When I set the hight to 768px, the page is to high…

This has obviously something to do with the iPhone settings within the
document settings

  • what are the correct iPhone settings within the document settings?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Best wishes Peter

================================
Peter Tucker, Oxford UK email@hidden


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Something is wrong with the setting possibilities for mobiles in FW. Since hours I try to setup a page – no chance to bring it 100% by 100% to the screen. 1024 x 768 for ipads. Absolutely lost … even with 100% width …


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

What do you mean Tom? Do you have an example we can see?

Joe

On 18 Nov 2010, at 17:45, TomP wrote:

Something is wrong with the setting possibilities for mobiles in FW. Since hours I try to setup a page – no chance to bring it 100% by 100% to the screen. 1024 x 768 for ipads. Absolutely lost … even with 100% width …


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi Nathan,

My point was these sites are already setup to work on iPad and iPhone in FW and work just fine on the actual devices. BUT they don’t work on the emulator.

Peter Tucker, Oxford UK - but mobile somewhere

On 18 Nov 2010, at 17:11, Nathan Garner email@hidden wrote:

There are the Develop > User Agent > Mobile Safari tools in Safari 5 that can help with seeing how you page behaves (remembering to turn off flash etc. in preferences).

Nathan Garner

http://www.austinwellsdesign.co.uk

FW5 Pro | MacBook Pro | Snow Leopard

On 18 Nov 2010, at 17:00, Peter Tucker wrote:

Nathan, that’s really great, but oops …

The first downside it does not display mobile content like the iPhone or
iPad does, the pages are clipped. The second downside, it does not
automatically get the iPad specific pages, in other words if you’re on a
real iPad it goes here:

http://dt360.co.uk/mobile/ipad/

If I just put in the base URL:

http://dt360.co.uk/

I get the normal non-mobile site.

on 18/11/2010 16:15, Nathan Garner at email@hidden wrote:

Have you seen this?
http://www.ipad-emulator.com/

Type your url in the browser

Nathan Garner

http://www.austinwellsdesign.co.uk

FW5 Pro | MacBook Pro | Snow Leopard

On 18 Nov 2010, at 16:12, TomP wrote:

Looks good so far.

  • 2 more question: What about the hight?
  • When I set the hight to 768px, the page is to high…

This has obviously something to do with the iPhone settings within the
document settings

  • what are the correct iPhone settings within the document settings?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Best wishes Peter

================================
Peter Tucker, Oxford UK email@hidden


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Sorry just saw this message too. Peter

Peter Tucker, Oxford UK - but mobile somewhere

On 18 Nov 2010, at 17:05, Nathan Garner email@hidden wrote:

Ah. I havent actually used it for testing - just saw it on a link someone had sent me and assumed that it showed the position correctly.

Nathan Garner

http://www.austinwellsdesign.co.uk

FW5 Pro | MacBook Pro | Snow Leopard

On 18 Nov 2010, at 17:00, Peter Tucker wrote:

Nathan, that’s really great, but oops …

The first downside it does not display mobile content like the iPhone or
iPad does, the pages are clipped. The second downside, it does not
automatically get the iPad specific pages, in other words if you’re on a
real iPad it goes here:

http://dt360.co.uk/mobile/ipad/

If I just put in the base URL:

http://dt360.co.uk/

I get the normal non-mobile site.

on 18/11/2010 16:15, Nathan Garner at email@hidden wrote:

Have you seen this?
http://www.ipad-emulator.com/

Type your url in the browser

Nathan Garner

http://www.austinwellsdesign.co.uk

FW5 Pro | MacBook Pro | Snow Leopard

On 18 Nov 2010, at 16:12, TomP wrote:

Looks good so far.

  • 2 more question: What about the hight?
  • When I set the hight to 768px, the page is to high…

This has obviously something to do with the iPhone settings within the
document settings

  • what are the correct iPhone settings within the document settings?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Best wishes Peter

================================
Peter Tucker, Oxford UK email@hidden


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Still in trouble:

Page size: 980x720

White line 100% wide (anyhow to small on ipad screen)

If I turn the pad, the side is too big. No automatic “resizing”

http://www.piranha-ag.ch/da.php

Is it on me? Am I on the wrong path …


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Uploads do NOT fit to the “first” screen I see. No matter what kind of sitting I use …

They also do not “resize back” when I turn the ipad. No matter what kind of sitting I use …

I bet I find it out …


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Are you expecting that blue bar to stretch? It’s currently a graphic so will be fixed in size, regardless of orientation. Make it an HTML item and it will stretch to the dimensions of the viewport/window.

Joe

On 20 Nov 2010, at 08:50, TomP wrote:

Uploads do NOT fit to the “first” screen I see. No matter what kind of sitting I use …

They also do not “resize back” when I turn the ipad. No matter what kind of sitting I use …

I bet I find it out …


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Jep. This is one good thing!! Thanks Joe.
Thats on me … forgot it …

And how can I made them switch back
to the correct wide when I turn the pad?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

And what about pictures. How can I made them 100% wide?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options