You can create folios and custom viewers for platforms to account for multiple device sizes. For example, the iOS (Apple) platform includes 1024x768 and 2048x1536 models for the iPad and 480x320, 960x640, and 1136x640 models for the iPhone.
Android and iOS viewers have different requirements for displaying folios. Any folio size you create can appear in an Android viewer. The articles are scaled and letterboxed as needed. However, on the iPad, the viewer displays only folios with a 4:3 aspect ratio. The iPhone viewer displays only folios with a 3:2 or 16:9 (1136x640) aspect ratio.
Although renditions are an option, it's possible to create a single folio for each platform and allow the content to be scaled.
For iPads, you can create a single 1024x768 folio that works on both SD and HD iPads. Similarly, you can create a single 480x320 folio that works on both SD and HD iPhones (see Creating multi-rendition articles). We recommend creating an additional 1136x640 rendition that works on iPhone 5 and 6 devices.
For Android viewers, you can create a single folio, such as the 1024x768 folio used for iPads or a 1280x800 folio that is a better match for Android device dimension. That folio is scaled up or down on Android devices. For best results, test the folio on multiple Android devices. Another option for native Android viewers is to create a one folio for phones and another folio for tablets, and then select the smaller folio to appear only on phones and the larger folio to appear only on tablets when building the app. See Setting up renditions for native Android viewers.
For Windows Store viewers, we recommend using a single 1024x768 folio size to avoid extra design effort. Content is scaled and letterboxed as needed. To design folios specifically for Windows devices, use 1366x768.
Multiple versions of the same folio designed for different devices are called renditions. If you create multiple folio renditions, the viewer makes available only the rendition that most closely matches the device’s dimensions.
On Android devices, if the viewer displays a rendition that does not match the device’s aspect ratio, it scales the folio proportionally. The viewer can add either letterboxes (black bars top and bottom) or pillarboxes (black bars on the sides) as needed.
Renditions are useful for several reasons:
- To create iPhone content that is not letterboxed on the iPhone 5. For example, you can create a 480x320 rendition that works on iPhone 3/4 devices and a 1136x640 rendition that fills the display area of iPhone 5 and later devices.
- To create a Web Viewer Only folio. See Customizing the Web Viewer.
- To create separate folios for Android devices that target either the phone or tablet.
- To create separate SD and HD folios (1024x768 and 2048x1536) for the iPad. This option is especially useful if you want to use a PNG or JPG article format instead of PDF.
A. 1024x768 folio B. 1024x600 folio C. 1024x768 folio letterboxed on 1024x600 device
- The iPad viewer displays only folios with a 4:3 aspect ratio, such as 1024x768. The iPhone viewer displays only folios with a 3:2 aspect ratio, such as 480x320 and 960x640, as well as 1136x640 (iPhone 5) folios. For iPhone 6 and 6 Plus models, use 1136x640 renditions. 1366x750 and 1920x1080 renditions are not supported at this time.
- On Android devices, viewers scale content both down and up as much as 300% to fit content within the device dimensions. Some letterboxing may occur.
- When you add articles to a folio, the aspect ratio of the document’s Page Size setting must match the folio’s Size setting (unless you select a Smooth Scrolling option). For example, you can add 1024x768 InDesign documents to a 2048x1536 folio because the aspect ratios are both 4:3. However, you cannot add 1024x768 documents to a 1280x800 folio.
- When designing for Android devices, keep in mind that the system navigation bar reduces the display area. For example, if a 1280x800 device includes a 48-pixel navigation bar, the display area is 1280x752 in landscape and 800x1232 in portrait. We recommend that you allow some scaling and letterboxing to occur rather than trying to create folio renditions that account for these different dimensions.
- Objects on hidden layers do not appear in the exported folio. You can create separate layers for different mobile devices and add objects that appear only when that layer is turned on. Before you create an article from a document, show and hide the appropriate layers and change the page size as needed.
- If you're enabling social sharing to display content in the Web Viewer, you can create a special rendition that appears only in the Web Viewer browser. See Creating a Web Viewer only rendition.
- We recommend that you use different Application IDs for iOS, Android, and Windows platforms so that you can use different content for the different platforms, if necessary. Not all features supported in iOS are supported in the other platforms, as described in the next section.
Some of the features that work on the iPad are not supported in Android and Windows viewers. For example, panoramas are not supported on the Android or Windows platform. For HTML content, check to make sure that it works properly in the platform’s browser and in the DPS folio. See DPS supported feature list.