Thursday, March 14, 2013

Kindle Fixed Layout Tutorial - Part 10

IMAGES

Since the foremost reason for using a fixed layout for an ebook’s internal design is usually due to the inclusion of high quality, full-bleed artwork or images with precise positioning, around or over which all other elements are placed, we will start our discussion of content here.

There are several factors to consider when creating or formatting images that will be used in a fixed layout ebook:

·   Device Display Resolution
·   Image Resolution & Aspect Ratio
·   Image Format & File Size

You may, of course, be creating an ebook that reproduces a print book you’ve already made, or producing a work for both print and digital publication at the same time. In this case the additional considerations of creating art for the physical edition will determine to a great degree how you will proceed with the digital production. The aspect ratio of your pages, for example, will depend much more upon the intended print dimensions than the Kindle screen size. But you will still need to decide how large to make your images, and in what format to save them.

Resolution & Aspect Ratio
In order to determine what size to make your images you will need to consider which Kindle devices it will most likely be viewed on, since there are now many variations is display size and screen resolution.

Resolution is the size of an image or display in pixels, while the Aspect Ratio is the length of its height relative to its width. Display resolution has continued to increase in recent years, and will likely do so for some time to come, until a practical maximum pixel density is reached (the point at which the human eye no longer discerns a difference in image clarity). Apple’s Retina displays and Google’s Nexus 10 are rapidly approaching that mark.

Below is a table comparing the current Kindle displays, with their Resolution, Pixels-Per-Inch, and Aspect Ratio given.
DEVICE
Resolution
Pixels
Aspect
Kindle 3
800 x 600
167 ppi
4:3
Paperwhite
1024 x 758
212 ppi
4:3
Kindle Fire
1024 x 600
169 ppi
10:6
Fire HD 7”
1280 x 800
216 ppi
16:10
Fire HD 8.9”
1920 x 1200
254 ppi
16:10
As you can see there is a wide range in pixel resolution among the Kindle devices, which has continued to increase as pixel density has improved. The highest resolution Kindle now boasts 1920 x 1200 pixels, which means that in order for your images to fill the display area completely without scaling on the HD 8.9” Kindle they must be at least this big. Moreover, Amazon recommends that images be two times the display size for retention of image quality when zoomed. Unfortunately, with their present restrictions on image file size, this is generally not possible (more on this in a minute when we get to file size).

The pixels-per-inch value of your artwork is not relevant in digital displays, since only the number of pixels determines how much space an image takes up on a given screen. For example, an 800 x 600 pixel image will fill the Kindle 3 screen completely, regardless of whether it was saved at 72 ppi or 300, but it will cover less than a quarter of the HD 8.9” display. An inch of any given display can contain a wide range of pixels, from as low as 132 ppi on the iPad 2 to 300 on the Nexus 10, which boasts a whopping 2560 x 1600 display. Using 2x zoom on the Nexus 10 would demand an image 5120 x 3200 in size to retain true image fidelity. That’s a total of 16,384,000 pixels! To any graphic artist who produces digital art this may seem incredible, given the file sizes involved, but this is where we are headed. At present, however, we must find a suitable compromise between image quality and file size.

That said, it is generally best (and Amazon recommends) to create and save all images at 300 dpi for maximum image clarity. If you are producing art for print, where the pixel-per-inch value does matter, you will want to do this anyway.

In addition to the Kindle e-readers there are, of course, computer monitors and smartphones of every size imaginable, as well as other e-reading devices on which the Kindle app is installed. Further, if you are also planning to format your ebook for other platforms, such as iBooks or ePub fixed layout, you may want to take those displays into consideration as well when creating your final art. An expanded version of the table above containing all the major e-reading devices can be found in the post Tablet & e-Reader Display Resolution, which I keep updated.

As it is nearly impossible to take every potential display into consideration, your primary concern with regard to formatting Kindle fixed layout ebooks should be the Kindle devices themselves, since this is very likely where they will be read more often than not. However, you will need to determine that for yourself, and for each individual project.
One problematic “aspect” of all this is the disparity in the aspect ratio even among the Kindle Fire line. The original Kindle Fire had the rather unusual aspect ratio of 10:6, which only a very few devices use, and Amazon quickly gave that up in favor of the more standard 16:10 ratio. What this means in practical terms is that the original Kindle Fire screens are taller than the HD models, so that your pages cannot fit them both precisely: there will either be a blank space above and below the page, or on both sides, depending on which aspect ratio you choose.

A comparison of a standard 6x9” print book page on the original 10:6 Kindle Fire and the newer 16:10 HD models shows something of this disparity:

In landscape orientation there is a less noticeable difference, but only because both devices waste a great deal of space due to their widescreen presentation, the HD models only slightly less so:
By comparison, this is how the same page spread appears on a 4:3 aspect ratio iPad display (and the Paperwhite as well, although not in color):
The fact that Amazon opted to use a widescreen aspect ratio for their flagship ebook reader in deference to its function as a multimedia device was a critical lapse in judgment, since adding letterboxing to a video in 4:3 ratio would not alter the actual size of the movie being viewed, while it dramatically interferes with the readability of two-page ebook spreads.

However, this is bound to remain a common occurrence for fixed layout ebooks, given the wide variety of display sizes out there, which will no doubt continue to diversify. My recommendation is to design your ebooks for the newest Kindle models, which currently use the 16:10 aspect ratio. This is also used by the Nook Tablet and Nook HD7” as well as the Kobo Arc, the Motorola Xoom, both of the newer Galaxy Tab devices, and the Nexus 7” and 10” tablets.

Ultimately, the best choice for Kindle comics and graphic novels is to produce images designed for the highest resolution color display, so that they do not “pixelate” any more than necessary when zoomed or scaled to a larger display. Pixelation occurs when an image is stretched to fit a screen with more pixels than the image itself contains, thereby forcing the graphics processor to insert additional pixels in order to fill the extra space.

Fortunately, today’s tablets do a fairly reasonable job of calculating what color these added pixels should be, but since they are still not part of the original image, some blurring will inevitably occur as an image is stretched, causing crisp edges to become fuzzy and colors to be muddied. A black pixel next to a white pixel, for example, will have a grey pixel inserted in between as the reading system averages the difference. Thus, it is best to create images at the highest resolution possible, so that a minimal amount of scaling will occur.

Complicating matters further are the arbitrary file size restrictions Amazon has placed on images included in Kindle ebooks. This is done for the very practical reason that it can take a good long time to download a hundred megabyte file, and that file would take up a large part of the Kindle’s onboard storage. Furthermore, the larger the images the longer it takes to load each page, resulting in a poorer reading experience. Finally, Amazon adds a .15¢ per megabyte bandwidth surcharge to all ebooks sold via KDP with the 70% royalty option chosen, which means a loss of $1.50 profit for every 10 MB of file size - and 10 MB is not hard to exceed with image-intensive ebooks: the 18-page Advanced Template weighs in at 12.1 MB before conversion with images that are 1920 x 1200 pixels in size. Thus, you can see that a 100 MB file is impractical for purely financial reasons (assuming, of course, that you’re selling your title through Amazon). You can opt for the 35% royalty and not incur this fee, but there are still the other factors to consider.

For these reasons, Amazon has imposed the following restrictions on image files sizes:

·   127 KB for reflowable ebooks
·   256 KB for “non-comic” fixed layout ebooks
·   800 KB for fixed layout ebooks with the “comic” book-type value

Why they chose only to allow the largest file size for comics and not for children’s books or other image-heavy ebooks is a mystery. Photography collections and art books by their very nature contain rich images, as do cookbooks and travel guides, to name just a few. Even at 800 KB it is often difficult to compress an image the size of the HD 8.9” screen to fall within this limit without severely compromising the quality, let alone one twice that size. But those are the allowed size limits, and so we must live with them.

Bear in mind that this is the size allowed for each individual image, so that you can technically include two half-page images of this size to make up one full page image using absolute positioning. There are good reasons against doing this, but if you find yourself unable to include an image at the size and quality you like, this is a viable solution. You could, for example, include a separate image for each panel of a comic or graphic novel page, each of which can then be zoomed without losing quality, even on the HD screens. The downside is that it requires a lot more work to position your images, but if the only alternative is blurry images, it is an option to consider (keeping in mind the overall size of your ebook file).

This image size restriction will obviously have a great effect on your ultimate choice of image resolution. Were there no size limits one might simply insert enormous images for the sake of forward compatibility with tomorrow’s higher resolution devices, which will undoubtedly also contain faster processors and larger memory storage. But that is not the task we face today. At the present moment we are at a very early phase of digital publishing’s evolution, and things won’t stabilize for some time yet. Therefore, you must find a balance between image size and quality.
To compress your images into a suitable size, JPEG is the only viable option for most artwork, unless you’ve created vector graphics. Supported image formats for the Kindle include JPEG, GIF, BMP, non-transparent PNGs, and SVG (Scaleable Vector Graphics). The Kindle format does not recognize alpha channels, so transparent PNGs are not possible. GIFs are only good for images with sharp black and white contrast or very simple colors, while Bitmaps and PNGs are simply too large to consider, and KindleGen will convert them to JPEG anyway, so you should convert them using the control available in Photoshop or Gimp, where you can select “Save For Web” and choose a quality factor that results in the largest file size acceptable.

According to the Kindle Publishing Guidelines, KindleGen will compress image files by reducing the “quality factor” up to 40% during conversion to achieve the file size limit. If it cannot do so the file will fail conversion. Be aware that the “quality factor” is not the same as the amount of compression applied, and is something of a mystery. In general, the more white space and solid color areas there are the more compression that can be applied without loss of quality, while images with highly saturated colors and a lot of variation will deteriorate much faster.

Testing has shown that KindleGen will actually compress images by quite a large percent. In the Template, for example, the “tutorial-cover” image was inserted at a file size of 810 KB, but after conversion it was only 227 KB, a reduction of 72% in size, with a reasonably decent retention of quality.

Thus, an image can actually be considerably larger than the limit and still pass through conversion successfully. However, it may not look as good as if you compressed the image yourself.

Finally, when you have your images in a format you are happy with, drag them all into your epub/zip archive - preferably in a separate folder - and then add a reference to each one in the Manifest section of your OPF, as shown in the templates, giving its location in the archive and its media-type, such as:
<item id="image1" href="images/ImageName.jpg"
media-type="image/jpeg"/>
The id reference here is actually never used elsewhere, although we will reference each image file’s location again in their appropriate pages.


PURCHASE THE COMPLETE EBOOK TUTORIAL NOW!

The definitive guide to the Kindle fixed layout format, this fully revised and expanded tutorial will take you line-by-line through two working templates, including both the content and support files, as well as all layout and functionality features, explaining in painstaking detail what each element is for, and what your options are in every instance. Also included in the ebook is a code to download both templates for free!
Add to Cart
$7.99
Kindle .mobi format
+PDF Edition