Book creation is usually managed in multiple environments – the simplest toolchain consists of the writing and editing environment – usually a word processor – and the design environment – usually desktop publishing software such as Scribus or InDesign. The transition is time-consuming and ‘clunky’ and made worse if multiple text sources are to be combined in the design processes.
Additionally, this process means there are two sources for the text. Changes made to the text once the source is in the design environment usually have to be copied also into the word processing files if the integrity of that source is to be maintained, and vice versa.
It would be simpler if there was one environment that could be used for creating and editing AND for design. That is what we have created with Booki.
Booki enables content creation through a web interface. Chapters can be easily moved around and content can be easily modified through a very simple WYSIWYG interface. The design environment is also Booki and is web based, and we have developed a technology for creating book-formatted PDF using CSS.
The interface is simple to use – in the ‘export’ tab of any book you can paste CSS into the text field provided in the ‘Advanced Options’ press ‘export’ and a very short time later you have the book-formatted PDF complete with Table of Contents, numbering, headers, and margin control.
While the interface is easy to use, the tool does not ‘by itself’ create a good looking book. The secret to a good looking book is a well-defined stylesheet and time spent manually tweaking some ‘content’ elements in the WYSIWYG editor (paragraph breaks, placement of images).
To understand the relationship between CSS and the final result, there is no substitute for trial and error. Designers must first understand how a ‘web native’ technology – CSS – applies to page-based media (books). This paradigm appears simple but it requires a slight re-alignment of how book designers think about designing books, and to do this, designers must try the process and persevere until they succeed. After that initial success, things become easier.
Probably the best way to start is to take an existing book and look at the CSS, then change it and see what happens. Generating a PDF takes anywhere from half a minute to a few minutes, so this is a pretty quick method for seeing how CSS affects the layout of the book. For experimenting, first, create an account in Booki and then visit this page. On this page, go to the ‘export’ tab and press the ‘Publish this book’ button. The PDF will be quickly generated – beware the ‘progress bar’ is rather fake… the PDF might be ready more quickly or slowly than the progress bar suggests.
Next, click on ‘Show Advanced Options’ scroll down and choose ‘Custom’ from the ‘CSS mode’ drop down menu. Now a text field will appear with the default CSS – the same CSS that was used for the design of the book you just created.
Now either change the CSS in the text box OR visit this site for help.
At the bottom of this page, you will find a link to the CSS used for the print version of the second edition of this book – it’s the same book you are currently working on. You can see that the CSS states:
/* Main CSS File: */
@import url("http://collaborative-futures.org/material/styles.css");
/* Uncomment based on the book size you export: */
/* A5 */
/* @import url("http://collaborative-futures.org/material/size/a5-hacks.css"); */
/* 5.5"x8.5" */
/* @import url("http://collaborative-futures.org/material/size/5.5x8.5-hacks.css");*/
This is CSS syntax that imports the ‘real’ CSS used which can be found here: http://collaborative-futures.org/material/styles.css
Copy this CSS, change it, and enter it into the CSS text field of Booki, then try exporting the book again. Experiment with changing the CSS and see what happens.