iPhone Human Interface Guidelines for Web

Page 34

CHAPTER 4

Metrics, Layout Guidelines, and Tips

Figure 4-5

Portrait orientation layout metrics in pixels Status bar: 20 pixels URL text field: 60 pixels

Visible area for your content: 320 x 356 pixels

480 pixels

Button bar: 44 pixels 320

When iPhone is in landscape orientation the metrics change, although the relative arrangement of the status bar, URL text field, and button bar is the same. Figure 4-6 shows the dimensions of the visible area available for your content when iPhone is in landscape orientation. Figure 4-6

Landscape orientation layout metrics in pixels Status bar: 20 pixels URL text field: 60 pixels

Visible area for your content: 480 x 208 pixels

Button bar: 32 pixels 480

34

Lay Out Content for Safari on iPhone 2009-01-06 | Š 2009 Apple Inc. All Rights Reserved.

320 pixels


Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.