Thursday, April 29, 2010

19th century speech, and focus

This line from Walden, "I should not obtrude my affairs so much on the notice of my readers..." reminds me so much of the letter from my great-great-grandmother to her first husband, with whom she was in the process of divorcing, "pleas do me the favor of leaving me uninterrupted for the future".

It's such an interesting concept of focus and humility. I love the way they use words that seem so unusual for their context.

And I admire their reluctance to impose their presence, or be imposed upon by another. How different is this from being online 24-7, able to connect with friends around the world, or with strangers next door.

Tuesday, April 20, 2010

Images in iPad eBooks, thanks to InDesign

There's some talk on Twitter about what InDesign does to images when you export an ePub so I thought it would make sense to give a quick synopsis in more than 140 characters!

When you choose Export to ePub in InDesign, you get the choice of checking "Formatted" for images. What does that mean?
Formatted images with InDesign during Export to ePub

InDesign Placed ImageIf you check "Formatted", InDesign looks at the images in your document and takes into account their current physical size on the page, and any cropping, shearing, or other effects that you have applied. It then exports the image at 72dpi.

This image originally measured 3264 x 2448 pixels. I both resized and cropped it until, as you can see, it measured 4" x 3" on the page in InDesign.

 images infoBut the original size of the image doesn't matter, because if I check "Formatted", no matter its original size, InDesign will export it with a size of 288 x 216 pixels. (288 = 72 x 4", 216 = 72 x 3")

If you don't check Formatted, InDesign exports the images at the same size they had originally, in this case 3264 x 2448 pixels, and forgets about shearing or cropping. The one thing InDesign does do is change the resolution of the image to 72dpi, though, this is largely irrelevant.

Why is it irrelevant? I'm not going to get into a big discussion about resolution here (though perhaps one day I will), but I will tell you that InDesign can change the resolution to anything it wants, but the only factors that determine the output size of an image are its size in pixels and the resolution of the output device.

So, if the 288 x 216 pixel image is output on the iPad, which has a screen resolution of 132 dpi, it will measure 1.63" x 2.18". (288/132= 2.18", 216/132=1.63", and I admit, I checked it with a tape measure and it really does measure that.)

IMG_0093

The physical size of that same image on a Mac, say in an eBook on Adobe Digital Editions would depend on the output resolution of the screen. It used to be that all Mac screens were 72dpi, but that's not the case anymore; for example, mine is around 98dpi. So, on my screen, the image measures 2.9" x 2.2".

images formatted ade

Ah, you say, they look just the same! That's partly because I can only show them at a single resolution here—both of those images measure 288 x 216—and partly because everything else is in proportion and so they look very similar.

It probably makes more sense to decide on the size of an image by taking into account the full area possible. As I mentioned in Anatomy of an iBooks page, the usable area on a (vertical) iBooks page is about 560 pixels x 760 pixels. So, an image that measures 288 pixels wide will take up about half a page.

Please ask questions. It helps to know what's confusing. I'm feeling my way a bit as well.

And yes, that's our calf, Julieta. She's about a month old in this picture. We're getting about 3 quarts of milk every day and she takes the rest. She deserves a post of her own.

And to my non-American readers, I'm sorry about this "inches" business. I'd be curious to hear if you measure screen resolution in dpi, or not. I seem to remember using dpi even in Barcelona, where no-one cares the slightest bit about what an inch is, but it's been a while. 

Tuesday, April 13, 2010

More fonts for eBooks on iBooks on the iPad

[Update: With iBooks 1.1, Apple has changed much of the system for applying fonts. Please read Apple damaging ePub standards with pseudo-support and Apple kills fonts in iBooks, strikes blow to standards.]

Just a few minutes ago, I wrote that there were 10 possible fonts you could use when designing eBooks to be read with iBooks on the iPad, but it turns out there are several more, 44 according to this site, with 109 font styles in all.

I tried them out to make sure they work in iBooks on the iPad and sure enough, they did:

More fonts for iPad eBooks 1

More fonts for iPad eBooks 2

More fonts for iPad eBooks 3

That is, most of them did. I’m not sure what I’m doing wrong with Zapf Dingbats but I can’t get it to work at all, not even in TextEdit. And I don’t have sample text for the non-Latin alphabets.

Here’s the full list. If you view this page on the iPad, you should see all the font names displayed with the corresponding font. On a desktop computer, they’ll only display correctly if you have them installed in your system—and most of them do not come standard with either the Mac or Windows OS.

Remember: many of these also have additional styles (bold, italic, etc.). I’ll see if I can get a full table up.
  • Academy Engraved LET: The quick brown fox jumps over the lazy dog.
  • American Typewriter: The quick brown fox jumps over the lazy dog.
  • AppleGothic: The quick brown fox jumps over the lazy dog.
  • Arial: The quick brown fox jumps over the lazy dog.
  • Arial Rounded MT Bold: The quick brown fox jumps over the lazy dog.
  • Baskerville: The quick brown fox jumps over the lazy dog.
  • Bodoni 72: The quick brown fox jumps over the lazy dog.
  • Bodoni 72 Oldstyle: The quick brown fox jumps over the lazy dog.
  • Bodoni 72 Smallcaps: The quick brown fox jumps over the lazy dog.
  • Bodoni Ornaments: abcdefghijklmnopqrstuvwxyz
  • Bradley Hand: The quick brown fox jumps over the lazy dog.
  • Chalkduster: The quick brown fox jumps over the lazy dog.
  • Cochin: The quick brown fox jumps over the lazy dog.
  • Copperplate: The quick brown fox jumps over the lazy dog.
  • Courier: The quick brown fox jumps over the lazy dog.
  • Courier New: The quick brown fox jumps over the lazy dog.
  • DB LCD Temp: The quick brown fox jumps over the lazy dog.
  • Didot: The quick brown fox jumps over the lazy dog.
  • Futura: The quick brown fox jumps over the lazy dog.
  • Futura Condensed Extra Bold: The quick brown fox jumps over the lazy dog.
  • Georgia: The quick brown fox jumps over the lazy dog.
  • Gill Sans: The quick brown fox jumps over the lazy dog.
  • Helvetica: The quick brown fox jumps over the lazy dog.
  • Helvetica Neue: The quick brown fox jumps over the lazy dog.
  • Hoefler Text: The quick brown fox jumps over the lazy dog.
  • Marker Felt: The quick brown fox jumps over the lazy dog.
  • Optima: The quick brown fox jumps over the lazy dog.
  • Palatino: The quick brown fox jumps over the lazy dog.
  • Papyrus: The quick brown fox jumps over the lazy dog.
  • Snell Roundhand: The quick brown fox jumps over the lazy dog.
  • Times New Roman: The quick brown fox jumps over the lazy dog.
  • Trebuchet MS: The quick brown fox jumps over the lazy dog.
  • Verdana: The quick brown fox jumps over the lazy dog.
  • Zapf Dingbats: The quick brown fox jumps over the lazy dog.
  • Zapfino: The quick brown fox jumps over the lazy dog.
There are also a number of non-Latin alphabet fonts:
  • Arial Hebrew
  • Geeza Pro (for Arabic)
  • Arial Hebrew
  • Heiti J, K, SC, and TC (for Chinese)
  • Hiragino Kaku Gothic ProN (for Japanese)
  • Hiragino Mincho ProN (for Japanese)
  • Thonburi (for Thai)
OK, can't resist. Just wanted to prove that they really do show in the iPad:
More iPad fonts

More fonts on iPad 2

    Choosing Fonts for iBooks on iPad

    [Update: With iBooks 1.1, Apple has changed much of the system for applying fonts. Please read Apple damaging ePub standards with pseudo-support and Apple kills fonts in iBooks, strikes blow to standards.]

    iBooks doesn't yet support font embedding*. I don't quite get why Apple doesn’t want to give book designers the freedom to be able to create beautiful books, but that’s another topic entirely.

    And though the choices are limited, and yes, frustrating, it’s still better than nothing at all: Times (serif), Helvetica (sans-serif), Courier (monospace), Apple Chancery Snell Roundhand (cursive), Papyrus (fantasy), Baskerville, Palatino, Cochin, Times New Roman, and Verdana (these last five by name).

    Check it out. Here is 1-8

    Default Font iBooks on iPad

    And here are 9 and 10. Palatino is used by default if you don't specify anything and your reader doesn't either.

    Default Font in iBooks on iPad

    Strange things happen when your readers choose other fonts. If they choose Cochin or Baskerville, everything gets bigger:

    Baskerville chosen in iBooks on iPad

    If they choose Verdana, the size of all the text (regardless of font), is reduced:

    Verdana chosen in iBooks on iPad

    If they choose Times New Roman, all font information is lost, and the size goes back to normal.

    Times New Roman chosen in iBooks on iPad

    Note that size and font choices are used for every book in the iBooks library and not just the one in which the settings were adjusted.

    There are 10 sizes, the default is size 4.

    *The iPad itself does allow font embedding, but only in Safari, and only as long as you use SVG fonts. But embedded fonts don’t work in iBooks. Aargh. (At least I haven't gotten them to work... if you have, please share!)

    Updating ePub tests in iBooks on iPad

    Wow. I've been doing a lot of ePub testing. I edit the XHTML and CSS. Zip an ePub. Copy it to iTunes. Hit Sync. Get bored with waiting the THREE ENDLESS MINUTESit takes to sync a tiny book file. I open the book, calculate the results of my test, go back to BBEdit and start over again.

    And that's not counting keeping track of each ePub document.

    But that wasn't enough. There must be some sort of caching going on, because even if I delete the ePub from inside the iPad and even if I delete the ePub from inside iTunes, and even if I wait those excruciatingly long 3 minutes for the thing to entirely sync up my tiny new ePub file, I wasn't seeing the changes that I had made.

    What could be the problem? Well, the problem is the title. There must be some caching going on inside iBooks, I don't know. But if you try to upload and sync an ePub with the same title as an existing one (even if you had deleted the existing one!!), it will continue to see the old one.

    The key is to change the title in the content.opf document. Then it works.

    (And, you can cancel a sync right after the ePub is copied to the iPad and save 2.5 minutes.)

    Wednesday, April 7, 2010

    Anatomy of an iBooks page

    I'm trying to figure out how exactly iBooks treats an ePub file: which formatting it preserves, and which it ignores. The fact that it ignores any at all, is incredibly short-sighted. Nevertheless, given that limitation, it seems like a good idea to at least quantify what we’re dealing with so that those who wish to design a book can have a safe idea of what it might look like, once it’s on the iPad.

    The first thing to note is that the size of a page in iBooks depends on whether you’re viewing it horizontally or vertically. If you’re viewing it vertically, there is a single page whose text area measures about 4.25" x 6"(roughly 11 x 15cm).

    Anatomy of Vertical page in iBooks on iPad

    If you’re viewing double pages horizontally, each one measures about 3" x 4" (about 7.5 x 10cm).

    Anatomy of an iBooks page on iPad-1-1

    But how big is the text? First, the resolution of the iPad screen is 132 pixels per inch. I’ve found that if your CSS specifies text of 1em, the text you get will be 10 points.

    Finally, I’ve decided that the maximum width of an illustration with wrapped text (until we can apply dynamic sizes), should be between 200 and 250 pixels, so that there’s enough space for text around the edges.

    If you’re adding a full page illustration, make sure it's no bigger than 600 x 860 pixels, or else it will be divided between pages (ew!).

    Printable iPhoto Book Theme Guides

    I’m pleased to announce that I’ve finally made available online my printable iPhoto Book Theme guides, which detail with beautiful color examples all of the possibilities that iPhoto gives in each of its themes. Because layouts often depend on the original orientation of the photos placed, it’s not always obvious what layouts are possible. My iPhoto Book Theme guides show you all of the choices, and how to use them.

    Each e-book is priced at $3, and you can buy the entire set of 16 guides, completely updated for iPhoto ‘09, with Asian, Tropical and Old World Travel, for only $20. Satisfaction is completely guaranteed. If you’re not satisfied, email me and I’ll refund your purchase price.

    It seems kind of funny to be publishing PDF format guides while I’m immersed in thinking about ePub books for the iPad, but my carefully laid out guides to iPhoto Book Themes are really much better suited to PDF. Indeed, the whole reason it is in PDF format is so that you can print them, in an attractive and economical way, to have by your side while you’re designing an iPhoto Book.



    You can download a sample of the Modern Lines layout. My favorite feature is the page with all of the layout menus so that you can see at a glance what sort of theme it is (text-heavy? photo-heavy?), and the basic range of layouts.

    Comments more than welcome!







    Tuesday, April 6, 2010

    Wrapping Text in an ePub for the iPad

    Yesterday, I noted that Apple's sample Winnie-the-Pooh eBook had text that wrapped around the image at the beginning of each chapter, and that I'd like to know how they did that. According to the OPS spec, CSS position properties (like absolute and fixed) are strongly discouraged. I originally interpreted that as applying to the float property as well, but that does not seem to be the case.

    Indeed, the float property works just fine, and I assume that's what Winnie is relying on. Here is my own example:

    Wrapped text in iPad

    The code is absolutely standard and familiar:
    img.float {float:right; margin-left:10px}

    It works in Adobe Digital Editions also.

    Seems like it opens up a world of possibilities. I'll be spending the day looking at them, but I'd love to see what you come up with.

    One thing to keep in mind is that when the iPad is rotated, the image does not change size. And the wrapped text can get pretty squished:

    Wrap text horizontal

    The answer to that problem is probably keeping the image small enough to work on the horizontal spread, and big enough to be helpful on the vertical.

    Don't be distracted by the italics and small caps. Those are tests as well. And yes, that is Walden Pond.

    Monday, April 5, 2010

    iBooks on the iPad, a first glance

    I've been looking at the iBooks app with an eye toward designing eBooks for the iPad and have a first collection of observations I hope you find useful:
    1. I hate it that iTunes won't let me see the free, public domain eBooks that I've downloaded through the iBookstore. They simply don't appear in my Books section in iTunes. I'm not quite sure why I didn't see these originally, but they are there in the iTunes Music Library. (Thanks, Nick.)
    2. iBooks doesn't deal with tables very well. I downloaded Pride and Prejudice and it had this terribly broken table of contents:
      Funky columns
      I wanted to see what was causing it, so I had to go to Project Gutenberg, download the ePub there, copy it to the iPad to confirm it was exactly the same file (yup!), and then open it up. The problem is that the three columns of Chapter numbers were formatted as a table, and though there is plenty of room for the contents, iBooks smushes the cells together anyway.
    3. I opened up a book of poetry and cried for page breaks.
      Page Break Control!
    4. All the books I've downloaded from the iBookstore and from Feedbooks open on page 3, 5, or 6 the first time, and not on page 1. In addition, page 1 is on the left instead of the right.
    5. I'm unimpressed with Smashwords' conversion process. It is so automated that the results are practically unreadable. In the books I downloaded, there was no TOC and there was way too much spacing between paragraphs. It's just not how I want to read.
      Smashwords in iPad
    6. Liza Daly over at ThreePress says that links in Feedbooks in iBooks go to Safari and then end up with an error. When I click a link in a Feedbooks book, Safari asks me if I want t download the file and open it in Stanza (which I had installed already). I looked around to see if there was a way to change the default program for opening ePubs but couldn't find one. Strange that the iPad would opt for Stanza over iBooks.
    7. I have yet to find a book that does images well, except for Winnie the Pooh, which I can't dig inside of. (Does someone who has jailbroken the iPad want to send me the ePub file? I'd love to see it.)
    8. In the Winnie the Pooh sample, there is text that wraps around an image at the beginning of each chapter. I'd like to know how to do that.
    9. When you drag an ePub to iTunes, it first adds the iTunesMetadata.plist to the epub file itself (as Liza points out), and then makes a copy of it and adds it to your iTunes folder inside the Music folder. As usual, if you change the metadata (with Get Info), the names of the files and folders change accordingly.
    10. You can only browse a tiny fraction of the free titles in the iBookstore. If you want to browse all of the Gutenberg titles, you can go to their site, find the title you want, and then jump back to the iBookstore and use the Search bar to find the title. They really are in there. I found a Catalan translation of Twelfth Night (La festa dels reis), which did not appear in the Featured section of the iBookstore, but did appear after a search. And all of the accented characters display just fine, as expected.
    More soon!

      More of my books