Images look terrible!

[fluoresce]

My EPUB contained many HTML tables, many of which would break on small screens. I therefore took screenshots of the tables and inserted the images into the EPUB in place of the HTML tables.

I just viewed my EPUB on ADE for PC. The table images look terrible! The text in the images is illegible. Please see attachment.

The images become blurry only when ADE downscales them. If I expand the window and force ADE to upscale the images, they look better. At full size, they look crisp.

I have been looking for an answer to this problem ALL day. The best one so far is to create new images of the tables, this time using very bold text and thick lines. This works quite well. Most of the images become legible; however, they look very ugly, and some still look quite terrible.

Does anyone know how I can fix this issue? I'll appreciate any suggestions.

[Turtle91]

I've heard before that ADE doesn't do a very good job with dynamically downscaling. I would think it is better to create a decent smaller scale version and add them to your epub. Then you can use media queries (I think they work on ADE devices??) to determine which version (hi- or lo- res) to display.

[jhowell]

Reflowable e-books generally need to work on a variety of devices with a font size chosen by the reader and so cannot be expected to display very much information per line. Tables with more than about three narrow columns are a poor fit for these devices.

I suggest rethinking how your data is presented in the e-book or switching to a fixed layout, such as PDF.

[fluoresce]

Originally Posted by Turtle91

I've heard before that ADE doesn't do a very good job with dynamically downscaling. I would think it is better to create a decent smaller scale version and add them to your epub. Then you can use media queries (I think they work on ADE devices??) to determine which version (hi- or lo- res) to display.

Hi, Turtle91. I can't add any more images, unfortunately. The file size is already too big.

Is this definitely a problem with ADE's downscaling? Might it be my CSS?

My CSS for every image looks like this:

Stylesheet CSS

img {
max-width: 100%;
height: auto;
}

HTML

<img src="whatever" alt=""/>

[JSWolf]

Originally Posted by Turtle91

I've heard before that ADE doesn't do a very good job with dynamically downscaling. I would think it is better to create a decent smaller scale version and add them to your epub. Then you can use media queries (I think they work on ADE devices??) to determine which version (hi- or lo- res) to display.

That's ADE for Windows or OS X. It works very well on Readers such as Sony or Kobo.

[fluoresce]

It looks like I'll have to redo all images of tables using a thicker font and thicker lines so that when they are downscaled by ADE they do not lose too much integrity. I also have to downsize the images using Photoshop so that ADE doesn't have to downscale them too much.

Doh!

[Turtle91]

Ahhh photoshop.... the good news is that you can set up saved functions...including automatically downsizing all the images in a specific folder. I'm sure I learned how to do that by watching youtube....

Warning: Work with a copy of your images, and save the originals somewhere else! (Ask me how I learned that lesson...)

[fluoresce]

[QUOTE=Turtle91;3515762]Ahhh photoshop.... the good news is that you can set up saved functions...including automatically downsizing all the images in a specific folder. I'm sure I learned how to do that by watching youtube....[/CODE]

Nice tip, Turtle!

Originally Posted by Turtle91

Warning: Work with a copy of your images, and save the originals somewhere else! (Ask me how I learned that lesson...)

How did you learn that lesson, oh Turtle?

No need to answer. I can imagine.

[fluoresce]

Is it even worth optimizing the images for ADE for PC? Would the images be the same for all e-readers that use ADE? How popular is it anyway?

[JSWolf]

Originally Posted by fluoresce

It looks like I'll have to redo all images of tables using a thicker font and thicker lines so that when they are downscaled by ADE they do not lose too much integrity. I also have to downsize the images using Photoshop so that ADE doesn't have to downscale them too much.

Doh!

You also need to have the images be high resolution so they can be read on an eInk screen. The problem will come that if the images aren't of high enough resolution, they won't be able to be read.

Do you have or have access to a high resolution eInk device such as a Kobo or Kindle so you can test your images?

[fluoresce]

Originally Posted by JSWolf

You also need to have the images be high resolution so they can be read on an eInk screen. The problem will come that if the images aren't of high enough resolution, they won't be able to be read.

Do you have or have access to a high resolution eInk device such as a Kobo or Kindle so you can test your images?

I've sent you a PM.

[DaleDe]

No need for photoshop for this task IrfanView can do it in a batch mode and will saved the modified files in a separate folder. It is a free app for Windows.

[RbnJrg]

Originally Posted by fluoresce

My EPUB contained many HTML tables, many of which would break on small screens. I therefore took screenshots of the tables and inserted the images into the EPUB in place of the HTML tables.

You can avoid that tables would break on small screens under ADE. So, if your tables, not images of tables, would look ok in ADE, you can get the tables won't break by adding in your .css stylesheet the following:

tr {
    page-break-after: avoid;
}

Take in count that the property page-break-after: avoid; only will work with ADE (with RMSDK, not webkit). Besides, if your tables have many rows, very probably each table will be displayed in a new page.

Regards
Rubén

[fbrzvnrnd]

Using images for tables is not a good thing (for accessibility for example). You can break a big table in more than one smaller table. You can also try to work the table as svg.

[RbnJrg]

If you finally decide to use images, the best choice is to employ svg tables. Sometime ago I wrote a little tutorial about how to create them:

https://www.mobileread.com/forums/sh...00#post3111300

Perfect results are obtained only if the .pdf are saved with the highest quality. I discovered that the built-in "Save as .pdf" command of the spreadshet, it doesn't make a good .pdf. It's preferable to save the sheet as .pdf with a program like pdfFactory.

Regards
Rubén