Percent vs picas (or mm) for Kindle

[Notjohn]

For the first time, I want to use a series of mug shots in a book. At present I have them sized 20% wide, height=auto. I appreciate that this can turn out fairly ragged in a K1, K2, or DX Kindle, and perhaps in Apple IOS. What's the best way to go? Shall I ignore the Mobi 7 gang, revert to absolute measure, or futz about with media calls? (I don't like the last because they would require me to have separate builds for Amazon and the rest of the digital world.)

[JSWolf]

If you use absolute measures, you have to make sure your images will fit properly on ALL devices that have a Kindle app such as an iPhone. Can you do that? a % makes sure it fits based on the size of the screen. Absolute means is might not fit.

[Notjohn]

I'm told that the early Kindles will respect em measures if they are even (or will round them up). I often use 130 picas for a thumbnail on a web page. What would be the rough equivalent in ems?

(Or the equivalent of 20%?)

[JSWolf]

Originally Posted by Notjohn

I'm told that the early Kindles will respect em measures if they are even (or will round them up). I often use 130 picas for a thumbnail on a web page. What would be the rough equivalent in ems?

(Or the equivalent of 20%?)

Just remember, anything you do with graphics has to work on a small 4" iPhone or you've botched your eBook and/or website. Now, as picas to ems, try a Google search. I have never used picas because they aren't useful at all.

[Notjohn]

I am enchanted to see that my iPhone 4 measures 640 pixels wide. That's not terribly far off from the latest Fire HD 7 inch (800 pixels) and wider than the early models -- or the first generation Kindle, for that matter (600 pixels).

Indeed, it's only the more recent 8.9 inch tablets that have blown up the standard, at 1600 pixels wide.

[Notjohn]

OMG, did I really say picas? I meant pixels....

>I often use 130 picas pixels for a thumbnail on a web page.

[pdurrant]

Never use pixels as a measurement in ebooks.

[EDIT: Whoops, I was wrong. I still wouldn't use it often, but it isn't as bad as I'd thought, and there are some places where it's the best option.]

[Jellby]

I don't know how it is for Kindle, but in ePubs pixels are absolute units, just like millimeters or inches, and they are not equivalent to the device's pixels. In particular, they should not change with the device resolution. I think the definition is exactly 1 in = 96 px.

That, at least is what the spec says. I've seen devices with "creative" definitions of what a "mm" is, so I'm not surprised there are devices that translate "px" to device pixel too.

[pdurrant]

Originally Posted by Jellby

I don't know how it is for Kindle, but in ePubs pixels are absolute units, just like millimeters or inches, and they are not equivalent to the device's pixels. In particular, they should not change with the device resolution. I think the definition is exactly 1 in = 96 px.

That, at least is what the spec says.

Could you point me to the part of the spec that says that. I've found in ePub 2.0.1:

3.2.3: Length
All non-zero coordinate and size values must have specified units. All units defined by CSS1 and CSS2 are supported:
px Pixels

the CSS2 specification has this to say about pixels:

4.3.2 Lengths

Lengths refer to horizontal or vertical measurements.

[snip]

There are two types of length units: relative and absolute. Relative length units specify a length relative to another length property. Style sheets that use relative units will more easily scale from one medium to another (e.g., from a computer display to a laser printer).

Relative units are:

em: the 'font-size' of the relevant font
ex: the 'x-height' of the relevant font
px: pixels, relative to the viewing device

Note that pixels are explicitly defined as a relative unit, based on the viewing device.

It may be that some popular ePub renderers choose to interpret pixels as 1/96 inch, but I couldn't find that in the spec. I'd be happy to be wrong.

[Jellby]

If you scroll down a bit the CSS 2 spec, it is more specific about "px":

Pixel units are relative to the resolution of the viewing device, i.e., most often a computer display. If the pixel density of the output device is very different from that of a typical computer display, the user agent should rescale pixel values. It is recommended that the reference pixel be the visual angle of one pixel on a device with a pixel density of 90dpi and a distance from the reader of an arm's length.

But in the CSS 2.1 spec, "px" is already defined as an absolute unit:

px: pixel units — 1px is equal to 0.75pt.

So, yes, strictly speaking ePub 2.0.1 uses CSS 2, where "px" is not hardwired, but it's still not the device pixel. In CSS 2.1 (and I assume CSS 3 too), this was fixed to 1/96 in, which roughly agrees with the recomendation of CSS 2.

[pdurrant]

Originally Posted by Jellby

If you scroll down a bit the CSS 2 spec, it is more specific about "px":



But in the CSS 2.1 spec, "px" is already defined as an absolute unit:



So, yes, strictly speaking ePub 2.0.1 uses CSS 2, where "px" is not hardwired, but it's still not the device pixel. In CSS 2.1 (and I assume CSS 3 too), this was fixed to 1/96 in, which roughly agrees with the recomendation of CSS 2.

Many thanks! I should indeed have read on further.

[DaleDe]

Originally Posted by pdurrant

Never use pixels as a measurement in ebooks.

Pixel is the unit of choice for W3C to use to autoscale images based on ppi. Read about this in our wiki https://wiki.mobileread.com/wiki/CSS_pixel#The_CSS_pixel

Dale

[SBT]

I can definitely confirm that on Kindle Touch and Kindle Paperwhite 2, the pixels are not device pixels. If the previewer is to be trusted, nor is Voyage. However, a kindle e-ink pixel seems to be larger than a kindle fire pixel.

I've struggled with this particular display problem myself. Use fixed pixel dimensions, and the proportions only look OK on certain devices. Use relative dimensions, and it looks pixellated and/or silly on large screens, and miniscule and silly on small screens. I really miss support for the max-width attribute on the kindle at times like this.

I normally try to set a min-width in pixels to ensure it will look sensible on small screens, and give the width itself in %, so the layout will be OK on "normal", 6-inchish devices, and not too silly on 10-inchers. People reading on computer screens will just have to live with the silliness of the image dimensions...

(That is, unless the image contains text. Then of course em's would be the way to go.)

[Notjohn]

Thank you, SBT. You have stated my problem precisely.

And thank you, everyone. This has been most enlightening, even though I'm not surely where it leaves me.... It would never have occurred to me that Gertrude Stein was wrong, and that A Rose Is a Rose Is Not Always A Rose.