Methods for Enhancing Picture Quality in Your Electronic Book
Revamped Article:
Optimize Your Images for a Better Ebook Experience
Welcome back to our three-part series on optimizing media for your ebooks. In the first post, we demonstrated the ins and outs of optimizing videos, and this time, we're excited to dive into how to optimize audio for your ebook. Be sure to catch up on How to Optimize Videos and Add Them to Your Ebook and How to Optimize Audio for Your Ebook if you're planning on adding audio to your masterpiece. Today, we're focusing on something equally vital—images.
Images play a significant role in enhancing the look and feel of your ebook. However, their size can significantly impact the overall ebook performance. Don't worry, we're here to show you how to optimize each factor to reduce the image file size while preserving their quality. Plus, we'll throw in some ideal dimensions for ebook book covers, ebook app icons, and images within your ebook.
What's Image Optimization All About?
Simply put, image optimization involves adjusting images to minimize their file size without significantly impacting their quality. The goal is to ensure the images load quicker on websites and apps, which improves the reading experience.
Pro Tip: Learn all about images in an e-book from The Ebook Author's Guide to Images.
Factors That Affect Image File Size
There are several factors that can influence an image's file size. Understanding how to control them will help optimize these images while maintaining their quality.
Image Dimensions
Often, large images meant for large prints—such as DSLR shots or Photoshop creations—even poster-size images, aren't ideal for ebooks, especially when they'll primarily be viewed on smaller screens like smartphones. To address this, simply resize the image to fit your target screen size.
Image Resolution
Choosing between image quality and file size isn't always straightforward. Higher quality usually results in larger file sizes, but lossy compression techniques like those used in JPGs may not sacrifice as much quality as you'd expect.
If your images boast a very high resolution, consider reducing the quality to the minimum possible when saving JPG files. Although experimenting with reducing JPG quality is recommended, it might not be feasible for everyone. So, try one or two images with different settings and pick the one you prefer.
File Type
Each image file type offers distinct advantages. The two most popular are PNGs and JPGs. To learn more about other file types, check out the comparison of 16 file formats at Common Image File Formats.
- PNGs were intended to lower file size by limiting the color range to RGB for web use, complemented by lossless compression.
- JPGs provide a broader color range best for printing, but they achieve this by using varying degrees of lossy compression to reduce file size.
In most cases, JPG is the optimal format for photographs on the web, while PNG excels with images containing large areas of uniform color orif you're displaying a photograph in web format without losing quality.[2]
Essential Tips Before Optimizing Your Images
Before optimizing your images, ask yourself if they need optimization in the first place. To answer this question, you'll need to know two things:
- Ideal Image File Size
- Your images' current sizes
We've got you covered on all the data, and we'll make it easy for you to find the answers in the end.
Ideal Image Size
The ideal size can vary depending on your purpose and target screen size. Here are some general guidelines, as well as specific recommendations, and quick guidelines applicable to most images in digital content.
Cover Images
Images Within Your Ebook
[Learn more about official guidelines from major distribution venues like Amazon, B&N, BookBaby, Draft2Digital, Google Books, Lulu, and Smashwords. Bookmark this page for easy reference when you're ready to publish.]
Ebook Web Apps and Desktop Apps
If your ebooks will be viewed on a computer screen—either via our ebook web apps, ebook desktop apps—you should aim for larger images, similar in size to those used for web or desktop content.
- Fill the width of the screen: 1,500 - 2,500 pixels wide.
- Most images: 500 - 700 pixels wide.
- Thumbnails: around 150 pixels wide.
Mobile Devices
Whether you're creating ebooks for smartphones or tablets, prioritize minimizing image sizes to reduce loading time and overall file size. Keep in mind that the largest mobile device capacities aren't substantial; for instance, the iPhone 15 Pro Max's max image size is 430 x 932 pixels, and the iPad Pro's maximum resolution stands at 2048 x 2732 pixels.[4]
Full Page Images
At times, you might want to include a full-screen image to make it stand out. To ensure the image looks sharp, aim for the following widths:
- Landscape: 1920 - 2048 pixels wide
- Portrait: 1280 - 1536 pixels wide
Images Surrounded by Text
Most images within your ebook will not stand alone on the page; instead, they'll sit surrounded by text. We recommend resizing their width to 350 - 1000 pixels to maintain an effective balance between the image and the text.[5]
App Icons
When creating icons for your app, consider that size varies between mobile and tablet devices. Although you should create icons of 512 x 512 pixels, avoid creating icons smaller than 120 x 120 pixels.[5]
How to Check Your Image Sizes
To determine the size of your images on your Windows computer:
- Open File Explorer and navigate to the folder containing your images.
- Change the view to Content or Details, and boom! You can see the dimensions of the images in pixels.
To check your image sizes on macOS:- Open Photos: Double-click a photo, then click the Info button in the toolbar or press Command-i. Here, you'll find the file size and image dimensions.
Want More Info?
If you've uploaded your images to our website, all images are saved in one folder. Locate your ebook in our website Author, click on Settings, then navigate to Working Directory. File Explorer will open, showcasing all your files. Navigate to the EPUB folder, then imgs to see the images and their sizes.[5]
Should You Crop Your Images?
Before resizing your images, ask yourself if cropping them might make the image look better. If so, crop first, then resize if necessary. We recommend completing all edits before optimizing your image.
Where to Find the Recommended Width for Your Images
After learning about the ins and outs of image size and optimization, here's a summary of the recommended image width for your images in ebooks:
Compare the widths in the table below to your image dimensions. If the widths of your images exceed these guidelines, optimize the images to ensure a seamless reading experience.[5]
Streamlining the Optimization Process
Here's a quick and efficient process to optimize your images in bulk, if you want them all to be the same size.
Online Tools
If you don't want to download software and prefer a quick, simple solution, utilize online tools that allow you to resize images effortlessly. Most of these platforms offer a drag-and-drop interface and various resizing options.
- I LoveIMG:
- Drag and drop all images.
- Select the new image size.
- Enter the desired width and click Resize Images.
- Download resized images as a zip file.
- BeFunky:
- Resize images, crop, and make minor edits before resizing using this user-friendly platform. Note that advanced features such as batch resizing require a paid subscription.
- Pixlr:
- This online editor mimics Adobe Photoshop's features, but be aware that it requires Flash to function.
Desktop Editors
If you prefer working on your desktop, consider these excellent—and free—options:
- IrfanView:
- Download the lightweight 32-bit version (2.4 MB) if your images are less than 1.3 GB or the 64-bit version (12.8 MB) for larger images.
- To resize images within IrfanView, follow these steps:
- Open the image and go to Image > Resize/Resample.
- Set the width (be sure the aspect ratio is locked) and click OK. The image will be resized, and you can save it by going to File > Save As.
- Adobe Photoshop:
- Manipulate your images, then add resizing to the mix if desired. We recommend completing most edits before resizing, except when it comes to adding text after resizing.
Resizing While Editing
- Go to Image and select Image Size.
- In the window that appears, enter the desired width. Be sure the Constrain Proportions option—which locks the width and height together—is enabled.
- Click OK.
Resizing When Saving
To test different image quality settings in Photoshop, follow these steps when you're ready to save your work:
- From the File menu, select Save for Web. The Save for Web window will appear.
- Set the Image Size in the lower right corner. The image will automatically adjust to the new dimensions. You'll now have your image at the right size, with four different quality settings to choose from.
- Use the top right corner to set the file type and image quality for each window individually, depending on whether you're dealing with a photograph (choose JPG) or a graphic (choose PNG).
- Choose the image sample you like best and click Save. Don't forget to rename the file to preserve your original image.
The Results
Now, let's see what these optimization techniques bring to the table. The following images have been adjusted using each optimization technique to give you an idea of the resulting file sizes.
- Original image
- 4460 x 2973 pixels
- 3,477 KB
- Resized Images
- Width = 670 pixels
- IrfanView: 137 KB (4.25% of original file size)
- Adobe Photoshop: 98 KB (2.84% of original file size)
Although IrfanView outperformed Adobe Photoshop in terms of percentage reduction, Adobe Photoshop produced an image with superior quality. If you want lots of images in your ebook with decent quality, we recommend using IrfanView. If high-quality images are essential and you're fine paying a price on file size, Adobe Photoshop's results will suit you best, especially if you're already using it to edit your images.[1]
Sources:1. https://www.lifewire.com/adjust-the-image-quality-of-photos-in-adobe-photoshop-cs5-40656952. https://www.lifewire.com/what-is-the-best-image-format-1171803. https://www.lifewire.com/image-file-format-comparison-charts-5468344. https://developer.apple.com/design/human-interface-guidelines/ios/user-interface/adaptivity/layout-considerations/5. https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/ image-content/6. https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/image-content/ chose-images/
- For a seamless mobile reading experience with ebooks, it's crucial to optimize the file sizes of images, especially considering they'll likely be viewed on smaller screens like smartphones.
- When designing images for ebook covers, app icons, or images within the ebook, understanding the ideal dimensions and file types is essential for efficient distribution and optimal performance.
- Consider using online tools such as I LoveIMG, BeFunky, or Pixlr to resize images swiftly and easily, without requiring any downloaded software.
- When it comes to technology and mobile gadgets, staying informed about image optimization can help authors make better decisions, enhancing the overall visual design of their ebooks for social media and future distribution channels.