Go Back to the EPUB and Check Who’s There

(Continued from earlier post)

4. Create a table of contents, again.

Wait, didn’t we already do that? Yes, but that was a HUMAN table of contents. We made it “by hand” and it both looks good and works well. However, most E-readers won’t specifically recognize that ToC as a ToC. So now, we need to make what’s called a “logical” ToC.

Aesthetic disclaimer: This technique kind of sucks. It comes into play because there are three (3!) different kinds of Tables of Contents for E-books.

  • Traditional Table of Contents: The thing you think we’re talking about? That’s what we’re talking about. This is a list of sections, or chapters, or poem titles, typed up by a human and positioned in the first few pages of a book (let’s not argue, now) so that people browsing the book can find out where to go.
  • A Logical or Metadata Table of Contents: This is a list in outline format that lists the contents of your book by header <hx> elements. It usually is not styled, typed, or formatted so much as it is generated by an E-book editor. This list is where people will go when they click on the “Table of Contents” button or menu option in their E-reader. It should go at the end of your E-book so it doesn’t clog up your frontmatter (which already has a ToC).
  • An NCX file. The NCX file is a series of bookmarks or milestones (EPUB 2.1 and Kindle .mobi) in an E-book that helps some readers on some devices jump around inside the book. For example, a proper NCX file will allow a reader to jump around in the E-book in exact, one-chapter increments. The NCX file is created automatically by an E-book editor.

Fortunately, our E-book editor Sigil will handle most of this for us. Continue reading



Filed under Organization and Data

Notes On The Writing Process, the Struggle, the Sacrifice, the Chilli Fries.

Brilliance by Baruch Porras-Hernandez.

Baruch Porras-Hernandez

chicken and wafffles please!!!

View original post

Leave a comment

Filed under Uncategorized

Let’s All Gather Together at the EPUB!

Use Sigil to assemble the files for the E-book anthology.

illustration of files into epub

Our files are back together like peas in a pod.

You can, if you wish, use a text editor and a compression utility to make the EPUB .zip file. You can, that is; I sure can’t. And I see no clear reason why anyone would want to, not when Sigil is back in active development.

As Sigil is (kind of) an HTML editor, I could have used it all along for making the HTML/CSS markup in Steps 3 and 4. That wouldn’t have been a particularly awesome idea, though. As of this writing, Sigil hasn’t fully transitioned to HTML5. I feel it’s better to code in an HTML5 setting such as Dreamweaver, then step backwards a little bit closer to the end, rather than to do a whole project soup-to-nuts in an older specification and have more to re-code if you ever update the book to modern standards.

The first move is to download and install Sigil. If you need an older/more compatible version, those are still available, too, although they have been deprecated. I’ll wait…got it up and running? Great! Here’s what we’ll do next:

  1. Dump our files into a new Sigil document.
  2. Put the files in the proper order.
  3. Input some metadata (I’ll explain).
  4. Create a table of contents, again.
  5. Validate the files with FlightCrew.
  6. Rinse and repeat.

This post will cover 1-3. It’ll be fun. Ready? Continue reading

1 Comment

Filed under Organization and Data

The Poem? How Many Divisions Does it Have?

As I put the finishing touches on Yellow Buick Review No. 2, I take a minute to reflect on what has changed, for good and ill.

This tutorial is based on the first generation of HTML/CSS techniques we figured out (with plenty of help) for our poetry E-books and E-book anthologies. The first issue of Yellow Buick Review used those techniques. The commercial offerings at Bicycle Comics all use the first generation markup/code. It works, it looks good, it’s even elegant in the right light.

We have a second-generation set of techniques, though. Those are what I’ve been using on Yellow Buick Review No. 2. The biggest difference? YBR 2 uses the div element to structure each stanza of a poem.

(Update: We now have a third-generation set of markup techniques that use media queries to serve cascading style sheets appropriate to the device in use. Most of this post is now outdated, but I’ll leave it here as a marker of our thinking in mid-September, 2014.)

Here are two stanzas of a poem formatted using 1st Gen YBR markup:

<p class="PoemStanza">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<p class="PoemLine">Etiam id lacus ligula. Sed libero sem, ullamcorper</p>
<p class="PoemLine">Non pulvinar eget, ultricies eu felis.</p>
<p class="PoemStanzaIndent1">Etiam lacinia metus ligula, sed convallis turpis tristique eu.</p>
<p class="PoemLineIndent1">Nam in tortor dictum odio dapibus egestas.</p>
<p class="PoemLineIndent1">Nullam id odio ut ante lobortis sodales eget sed quam.</p>

Compare that with the same poem in 2nd Gen YBR markup:

<div class="PoemStanza">
<p class="PoemLine">Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
<p class="PoemLine">Etiam id lacus ligula. Sed libero sem, ullamcorper </p>
<p class="PoemLine">Non pulvinar eget, ultricies eu felis. </p>
<div class="PoemStanzaIndent1">
<p class="PoemLine">Etiam lacinia metus ligula, sed convallis turpis tristique eu.</p>
<p class="PoemLine">Nam in tortor dictum odio dapibus egestas. </p>
<p class="PoemLine">Nullam id odio ut ante lobortis sodales eget sed quam.</p>

The big difference? In 2nd Gen, each stanza gets wrapped in its own <div> tags. It is the <div>, not the <p>, that holds the margin-top attribute and value. 2nd Gen also uses percentages for most of its measurements, not em.

Continue reading

Leave a comment

Filed under Look and Feel, Testing and Uploading

Sigil is Back, Baby!

Sigil's stylized "S" icon

Sigil’s Icon for OS X

Editing EPUBs in the Post-Post-Sigil World?

I wrote the first drafts of these tutorials in April and May 2014, and I’ve been dribbling them out ever since. But almost since the day I started, there has been an uncomfortable reckoning on the horizon: Step 5 of my workflow uses Sigil, an open-source HTML/EPUB editor that ceased development right as The Yellow Buick Review project got underway.

Computers, E-books, the Web, life in general—we understand these things to be dynamic and shifting. Anyone reading this blog in 2022 (hi!) will find outdated information. The best I can do is offer honest advice in good faith. But when Sigil went quiet in Spring 2014, I felt as if I were leading people down a path I knew to be a dead end. It was hard to be enthusiastic about documenting Step 5:

5. Place the HTML and CSS files into an EPUB. We’ve been using Sigil, a free, open-source EPUB editor. Sigil wrangles together our HTML/CSS files, plus any images or media files we’ll be using. Sigil also helps us make a Table of Contents…

But I got excited this week reading this post over on the development blog of Sigil:

Now that all changed about a month ago when Kevin Hendricks decided to invest his time in some bug fixes. Then he decided to start working on a plugin framework for Sigil. He’s been spearheading the effort to get this feature implemented. It’s not ready yet but it’s coming a long (sic) nicely.

Continue reading

1 Comment

Filed under Publishing Industry

Let’s Split Up but Stay Friends

Just as a book should (must?) have multiple pages, an E-book should have multiple .html files.

Having one big .html file for the interior of our E-book has its advantages. After all, what’s the expression we use when we talk about keeping a project organized? “Let’s make sure we’re all on the same page.” But we’re (almost) done with the HTML and CSS portions of our book, and there are good reasons to split our .html file into smaller .html files:

splitting .html file into smaller files

  • Compatibility with older E-readers. Some of the early E-books couldn’t load a file larger than 128K or 256K. Splitting our book into segments helps us keep early-adopters in the game.
  • Easier navigation on some devices. Some devices, again, often older ones, allow the reader to “blip” ahead by section. If your anthology is all one big section, then the only “blips” allowed will be the very beginning and end of the book.
  • Guaranteed page breaks. Sometimes, you just need to be certain that a certain line will appear at the top of a new page. Start with a fresh .html file and know that it will have a fresh page all to itself.
  • Alternate cascading style sheets. YBR uses one CSS, but it might be that part of your book (a prose section, perhaps) will refer to a different .css file. Put that part on its own .html file and you’re good to go!
  • Reuse of “evergreen” sections. Okay, look, the back 10 pages of every Bicycle Comics poetry E-book thus far has been 8 pages of advertising for our other E-books. We don’t want to re-write or re-code that section; we just want to pop it in.

To be clear, we are making one E-book poetry anthology; an E-book can contain multiple .html and .css files. For the Tandem anthologies, we made each month its own chapter, so each month got its own .html file, as did the frontmatter and backmatter. But we combined those .html files into one EPUB file for each of our E-books. Here are the steps: Continue reading

Leave a comment

Filed under Code Samples, Organization and Data