Ebooks Stack Exchange is a question and answer site for ebook publishers and readers. It only takes a minute to sign up.
Sign up to join this community
I have written a book in Microsoft Word with a lot of images. But I am facing issues that the titles that I have given are going in the next page.
I understand I can resize the images but I wanted to tie the captions with the image. Even if I convert it to other format like mobi/epub, if it does not fit on the page let the image be scaled down in that format.
Is there any way to achieve this in Word or epub or mobi formats?
Ultimately, it depends on which ereader devices you want to support.
Unless you are making a fixed layout book, the only method that will work 100% of the time is to make the caption a part of the image. Since epub and mobi are reflowable document formats, there is always a possibility that the device being used to view the document will push a text caption on the next page. However, devices do not usually split images across more than one page.
While I have used the text-in-image solution in the past, I don't personally recommend it, since images can be displayed at many different sizes and resolutions depending on the device or screen. It may be difficult for readers to read the caption while viewing on their phone, but the caption may look unusually large compared to body text on a computer screen. People using an e-ink reader may find the image text grainy or difficult to read. I agree that it is undesirable for the caption to get orphaned from its image, but I think that most readers of ebooks are accustomed to these kinds of text-flow failures, and would prefer the text being on the next page over not being able to read the text at all.
If you would like to do the best you probably can, you could try wrapping your image and caption in a <div> with page-break-inside: avoid; styling, but support for this CSS property is not universal, so you are still at the mercy of the device.
Some people prefer to use page-break-before: always; before the image, but this also has drawbacks. (You can end up with only one or two lines of text on a page and then a forced page-break for the image.)
In the event that all of the devices you plan to support can handle SVG tags, you could wrap the image in <svg> and include the text caption inside the SVG tag with the image. I have heard this works very well (but it requires SVG support).
If you're still interested in other more complicated ideas, you can check this thread on the MobileRead forums.
Here's a practical suggestion. Download or buy one of the epub files by Oreilly publishers (or some other technical publishers). (They may even have some free downloads available).
Then rename the .epub to .zip and then unzip the files. Open in a browser, turn to a chapter with graphics and captions or titles and see how they solved the issue by inspecting the css (a right-click browser option).
Blendezo's solution is the preferred solution, but note that 1)Google Books historically haven't supported page-oriented css very well and 2)although Kindle supports image scaling, it does it automatically and sometimes can disregard the css (particularly in smaller devices). You will have to use css media queries.
If the images and captions are an important part of the ebook, I think it's fair to say that it is supported only for medium-to-large tablets.
One compromise is to put the images at the end or beginning of chapters -- where it's less likely for these issues to arise.
