full page image problems with iBooks/cover problems in iTunes

[iain robinson]

Hi all

I have a couple of queries hopefully someone can help me with. I’m making ePUBs out of Indesign CS5.5 and then manipulating them before loading them into iTunes to check on our iPad. The client's intended audience is iPad users so the majority of them will be using iBooks. My queries;

1. The first file in the ePUB is a picture of the cover of the print edition – it is intended to be the first page the reader sees. This gets resized to 1200x1720px (twice the “magic number” of 600x860px – deliberately bigger so people can zoom in on it if they want). We had trouble with a blank page appearing in iBooks after the full page image so after some searching around the net I recently changed the width of the image in the img tag to 99% from 100% and that seemed to fix that problem. I come to make another file (next issue of same job, different image but made to the same size) and the blank page problem is back. Here’s my img tag - <img width="99%" src="images/C%26L24-2_cover_fmt.jpeg" alt="blah blah"/>. I Did remove the ampersand from the file name (and wherever else it was referenced within the ePUB file) in case that was somehow causing a problem but that didn't help. Any ideas how I can get rid of this problem once and for all.
2. My other problem is that when I load the ePUB file into iTunes no cover image is displayed. Files I have made for other jobs display covers in iTunes but I can’t work out why this one doesn't.

NB The file passes ePUB check with no warnings.

thanks,
Iain

[iain robinson]

Think I have solved this myself. For posterity, the solutions to my two issues;

1. Indesign was putting the img tag within a <p>, and by default paragraphs come with some padding. To fix it I just put in my CSS files that the <p> class in question should have no padding. Job done.
2. Came across the solution to the iTunes cover problem when messing around with the cover file for the issue above. Basically I found that I had to remove the ampersand from the image file name (and also from wherever it was referred to - that didn't seem 100% consistent, which was perhaps part of the problem) and also reduce the physical dimensions of the image. I reduced it to 600x860px and it worked, but I haven't experimented to see what the acceptable ranges are.

Have a good weekend everyone!