Interactive chemistry ebooks: let us start now!

The problem
Henry Rzepa writes thought-provoking blogposts and his latest, entitled What is the future of books?, is no exception.  He describes the current state-of-the-art in science e-publishing and the very limited options and steep learning curves facing aspiring authors in this area.

Currently, there is only one publisher of interactive science e-texbooks: Inkling.  As a result, Inkling has their hands full and is unlikely to be interested in anything but the biggest best sellers in this area.

This means we chemists have to go at it alone, but there a is a big practical hurtle: there a no tools available to us.  The ePub 3 format that will allow interactivity will be released this month.  But when will tools to create and read ePub 3 files become available?

My first, and so far only, attempt at creating an ePub document taught me that the e-editors and e-readers are completely geared towards fiction.  Looking at Chapter 3 of Inklings Biology textbook on the iPad, which is available for free, is very educational.  Their design looks nothing like the traditional book that current e-readers such as Stanza and iBooks try to emulate with page swipes and similar layout considerations.  So we are not really waiting for these apps to become ePub 3 compatible; we are waiting for a science e-book reading app.  Who will write this and when?

One solution
But do we need all this stuff?  Broadly speaking, ePub is HTML in a zip file and ePub readers are hacked web browsers, and both are aimed at letting you read HTML off-line.   If we assume internet access, the need for ePub is mostly gone and this allows us to get started now by doing what we already know how to do: make interactive web pages.  Even if you think off-line access is essential, I hope you'll agree that "web-books" allow to test some design ideas for science e-books in ePub 3 format or book apps.

To kick things off, I have made a web page mock-up of how the section on electron density from my book Molecular Modeling Basics might look in the hands of the Inkling people, using an iPad-friendly template kindly made available by Matthew James Taylor. 

This is version 1, quite bare bones, and with a few blemishes.  For example, the top bar moves on the iPad (and on Chrome) because Mobile Safari does not respect position:fixed, and the Table of Content menu at the top doesn't work.  I would very much appreciate tips and suggestions from HTML experts on how to improve such things. You are very welcome to copy the HTML and the associated css, and experiment with this yourself.  (I am quite confident that a skilled HTML programmer could make a web page that is essentially indistinguishable from a page in Inkling's Biology book.)

Basic design considerations
Basic layout: The page can be read in both landscape and portrait mode.  The layout ensures that the main window is the same width in each mode, so that the formatting stays the same.  Portrait mode gives you reading without the clutter, landscape mode gives you access to options on the side.  Should the sidebar be on the left?  Should the sidebar scroll independently, and how do I do that?  When publishing Our Choice, Pushpoppress decided on landscape mode only, with a novel navigation, but I not sure this would look good for a real textbook. 

Continuous pages:  The section is not divided up in pages.  This avoids problems like figure captions spreading over 2 pages, but I think I would prefer this layout for fiction books as well: scrolling down on the iPad is a more natural gesture then side-swipe in my opinion.  I don't think I'll change that.

Table of content: Navigating a science textbook is very important.  The menu I have on the top left, will become too big, if I include the entire TOC.  Perhaps a nested drop down menu like this?  Could this be made to appear on a right-click?  Alternatively, I should I simply include a link to a separate page that holds the entire TOC, like iBooks?  Inkling's Biology book has a cool side-swipe feature where the TOC appears, but I have no idea how to do that.

Reading progress: Almost all readers have some indication of far along your are in the book or chapter, usually with dots.  Much of this is a legacy from novels.  In a textbook, you don't really care how much of the book you have read.  Perhaps it's important for a chapter?  Certainly in a section the position of the scroll bar is indication enough?  I don't think this has high priority.

Future plans
My plan for version 2 is to add interactive figures (should they be embedded or in separate pages?), and in subsequent versions I plan to add additional items to the right side-bar.  What should these items be?  Movies? Quizzes?  Again, suggestions are very welcome, as are links to similar mock-ups.

Now is the time to decide what interactive chemistry e-books should look like.  What do you think?

Related blogposts:
Interactive chemistry ebooks: interactive figures
Interactive chemistry ebooks: highligt and annotate
iPad: even 3D molecules that can be viewed from any angle
The Molecular Modeling Basics Electronic Color Supplement