What are the exact sizes for standard and Retina iPad screens and how do you prepare your background images for use in iBooks Author®? In this tutorial, we will take a look at the image requirements.

As we mentioned in a previous tutorial, all but one of the iPads, the iPad® Pro, have the same number of pixels, or points, filling the screen. In the landscape orientation, the Retina screen is 2048 pixels wide by 1536 pixels high. The standard screen has half those pixels.

Your iBA book will use almost all of this real estate, with the exception of a small black bar at the top of the screen. For the Retina screen, this bar is 40 pixels high and for the standard screen, it is 20 pixels.

The Cover Image - Book Title Page

The iBooks app displays a thumbnail of your iBA book cover in the iBook Library and iBooks Store. This thumbnail is reduce in size from the cover image that you place on the Book Title page in iBooks Author. This image needs to be in the standard size, even when you are designing your iBA book for the Retina display. The standard size is half the pixels as the Retina and therefore takes less time to load on to the screen. Also, your cover image must be in the portrait orientation, even when your book is in the landscape orientation. One last rule is that we need to remove 20 pixels from the top of the image to make room for the bar.

Portrait Cover Pixel Size: Width 768 Height 1004

Full Bleed Background Images for Other Pages

For those of you making a portrait orientation iBook, you will want to use this same size of 768 pixel width and 1004 pixel height for the background images for the rest of your pages. For the Retina screen, double the pixels to 1536 x 2008 pixels.

Portrait Layout: Standard Width 768 Height 1004 | Retina Width 1536 Height 2008

If you are making a landscape orientation iBA book, you will need your background images to be 1024 wide and 748 high. For the Retina screen, again we need to double the number of pixels to 2048 x 1496.

Landscape Layout: Standard Width 1024 Height 748 | Retina Width 2048 Height 1496

Keynote® and Other Widgets

If you are making widgets in Keynote for your iBA book or using one of iBA's widgets, the size of your background image for an inline widget will be determined by the size of the widget on the page. If your widget will play in Full Screen mode, you do not need to remove pixels for the black bar at the top of the page. So you will use the full screen dimensions for the background image.

Portrait Layout: Standard Width 768 Height 1024 | Retina Width 1536 Height 2048
Landscape Layout: Standard Width 1024 Height 768 | Retina Width 2048 Height 1536