3

I am preparing book in Indesign for an eventual ePub export. My page dimensions are:

Width 768 px Height 1024 px Orientation portrait Margins 0 px (since iBooks provides its own margins by default)

I added a cover image with the dimensions 800 px by 600 px. This shows perfectly as expected on my iPad. However, when viewing this ePub in iBooks on my Mac, the image splits across two pages. How can I make the image stay within a single page regardless of the device screen size? On my iPad, the image size remains constant no matter how many times I resize the font.

Also, is there any software one could use to emulate the various devices and their screen sizes for a finished ePub? I am far from able to afford every single reading device there is!

2

First, you are way behind the current standard.

Most (if not all) ebook distributors are requiring high resolution graphics for cover images. (a Minimum of 1500 pix or 2000 pix for width). This has been true for at least the last 2 years.

It's true that some of the smaller devices will display only 600x800, but all distributors recognized early on that it's easier to require a high resolution cover graphic and then downconvert rather than accept smaller graphics which can't be converted to the newer screens.

Second, I'm assuming you are not using Indesign for a Fixed Layout. Fixed layout requires you to set dimensions etc, but this is NOT epub. Epub is more flexible for a variety of standards. That indeed is the point.

Amazon (which doesn't accept epub but lets you convert from epub to a Kindle format) has a tool called Kindle Previewer which also lets you emulate the various Amazon devices. http://www.amazon.com/gp/feature.html/ref=amb_link_359603222_5?ie=UTF8&docId=1000765261

I found that on Chrome there is an extension called "Screen Resolution Tester" which lets you simulate various display sizes https://chrome.google.com/webstore/detail/screen-resolution-tester/bnbpeddmakpmblddofjnoghpjminhjph?hl=en

You can also check this reference guide for screen sizes. http://mydevice.io/devices/

This should get you started. I would start by testing dimensions for oldest Amazon Kindle Fire, ipad 1 or 2, ipad 3, the 7 inch ipad, iphone, Galaxy Tab 7 and 10.

  • I understand my image dimensions are much smaller than what's typically required these days and that's part of the problem. If my dimensions are this small, technically, there should be no reason for the image to split across pages when viewed in a reader, right? This is what I am confused about. Fixed Layout ePub is out of the question as I am only interested in reflowable but that's beside the point. So, again, why should an image that's just 800X600 px spill over to the next page on a display whose resolution is way more than that? – TheLearner Jul 6 '15 at 19:00
0

If you include a sample of your HTML and CSS, we'll be able to be of more help. My first guess is that the width for your cover image is set to a percent rather than an absolute value. You could make the width an absolute value, such as width: 600px, but that will cause problems on devices of different screen dimensions. In general, I tend to advocate designing for dedicated reading devices, rather than computers. On a computer, after all, you can change the window size until it looks good (or bad).

As far as device emulators go: there are some available, as idiotprogrammer has noted, but by and large they do a poor job of accurately representing what the device will show—the only way to be certain what you're getting is to test it on the device in question, and even then different updates can mean that it won't look the same on two of the same device.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.