ENTRIES TAGGED "Javascript"

Visualizing book production

Applying data viz techniques to study how a project evolves over time

Data visualization is one of the hot topics of the last year or two. So what does this offer publishing and book production?

Open data activists in particular have been lobbying governments for access to databases which they use to create infographics and visualisations for campaigns. It’s not a new science of course, it was here long before the net (for some background on contemporary practice see the wonderful books by Edward Tufte) but the net is made of data and a good mechanism for transporting it. The net is a good medium for scraping and re-presenting data in more palatable forms. Read more…

Are we over-thinking EPUB?

The future of the book is inherently linked to the browser

One common misnomer I have come across is that EPUB3 is ‘a technology’ – something in and of itself. I believe this category mistake is largely a result of the the IDPF’s (the organisation that maintains EPUB3) success in promoting EPUB as a ‘standalone’ technology to the publishing world.

While all content is trending towards CSS and JavaScript, the core technologies of the browser, it seems a little weird to position EPUB as being a collection of things that do something different from what browsers do. The nuance might not be clear so here goes…

Read more…

HTML5: The code to maximizing revenue

SPi Global's latest whitepaper is a must-read for everyone in publishing

SPi GlobalHave you heard all the hype about HTML5 but you’re still not sold on it? You need to read the latest whitepaper from SPi Global. It’s called HTML5: The Code to Maximizing Revenue and it does a terrific job explaining why this technology is so important. The document is only 7 pages long but it will give you a solid foundation. Here are a few of my favorite excerpts from the whitepaper:

Abandoning the “walled garden” environment of downloaded applications also has distinct SEO advantages, because only one set of search criteria is needed to make content discoverable across platforms.

Read more…

WYSIWYG vs WYSI

WYSI editors enable a whole new level of interaction

Since HTML is the new paper and the new path to paper online editing environments are becoming much more important for publishing. Dominant until now has been the WYSIWYG editor we all know and…err…love? However the current WYSIWYG paradigm has been inadequate for a long time and we need to update and replace it. Producing text with a WYSIWYG editor feels like trying to write a letter while it’s still in the envelope. Let’s face it…these kinds of online text editors are not an extension of yourself, they are a cumbersome hindrance to getting a job done.

Read more…

InDesign vs. CSS

Any typesetting engine without Javascript support is going to lose

The explosion in web typesetting has been largely unnoticed by everyone except the typography geeks. One of the first posts that raised my awareness of this phenomenon was From Print to Web: Creating Print-Quality Typography in the Browser by Joshua Gross.

Read more…

Gutenberg Regions

The new typesetting engine blueprint is right here in front of us

The “best price” phase of TOC NY 2013 registration is about to end. Don’t wait or you’ll end up paying more than you would today. To save even more on your registration, sign up here and use the discount code JOE20 to get an additional 20% off the current price on the conference package of your choice.

With the onward march towards the Browser Typesetting Engine, not an invention but a combination of technologies with some improvements (much like Gutenberg’s press) it’s interesting to think what that would mean for print production. Although there are various perspectives on how the printing press changed society and they mostly reflect on the mass production of books, and while the first great demonstration involved a book (The Gutenberg Bible), the invention itself was really about automating the printing process. It effected all paper products that were formerly inscribed by hand and it brought in new print product innovations (no not just Hallmark birthday cards but also new ways of assembling and organising information).

The press affected not just the book but print. With browsers able to produce print ready PDF and the technology arriving to output PDF from the browser that directly corresponds with what you see in the browser window we are entering the new phase of print (and book) production. Networked in-browser design. We are not talking here of emulated template-like design but the 1:1 design process you experience with software like Scribus and InDesign.

The evolution of CSS

There are several Javascript libraries that deal with this as I have mentioned in earlier posts (here and here) and the evolution of CSS is really opening this field up. Of particular interest is what Adobe is doing behind the scenes with CSS Regions. These regions are part of the W3C specification for CSS and the browser adopting this specific feature the fastest is the Open Source browser engine Webkit which is used by Chrome and Safari (not to mention Chromium and other browsers).

CSS Regions allow text to flow from one page element to another. That means you can flow text from one box to another box, which is what is leveraged in the BookJS technology I wrote about here. This feature was included in Webkit by the Romanian development team working for Adobe. It appears that Adobe has seen the writing on the wall for Desktop Publishing although they might not be singing that song too loudly considering most of their business comes out of that market. Their primary (public facing) reason for including CSS Regions and other features in Webkit is to support their new product Adobe Edge. Adobe Edge uses, according to the website, Webkit as a ‘design surface’.

A moment of respect please for the Adobe team for contributing these features to Webkit. Also don’t forget in that moment to also reflect quietly on Konquerer (specifically KHTML), the ‘little open source project’ borne out of the Linux Desktop KDE which grew into Webkit. It’s an astonishing success story for Open Source and possibly in the medium term a more significant contribution to our world than Open Source kernels (I’m sure that statement will get a few bites).

”HTML-based design surface’ is about as close to a carefully constructed non-market-cannibalising euphemism as I would care to imagine. Adobe Edge is in-browser design in action produced by one of the world’s leading print technology providers but the role of the browser in this technology is not the biggest noise being made at its release. Edge is ‘all about’ *adaptive design* but in reality it’s about the new role of the browser as a ‘target agnostic’ (paper, device, webpage, whatever – it’s all the same) typesetting engine.

A consortium, not an individual company

However we should not rely on Adobe for these advances. It is about time a real consortium focused on Open Source and Standards started paying for these developments as they are critical to the print and publishing industries and for anyone else wanting to design for devices and/or paper. That’s pretty much everyone.

Gutenberg died relatively poor because someone else took his idea and cornered the market. Imagine if he put all the design documents out there for the printing press and said ‘go to it.’ Knowing what you know now would you get involved and help build the printing press? If the answer is no I deeply respect your honesty. But that’s where we are now with CSS standards like regions, exclusions, and the page-generated content module. The blueprints are there for the new typesetting engine, right there out in the open. The print and publishing industries should take that opportunity and make their next future.

The new New Typography

Replacing the book production ecosystem with webpage production tools

In the 1920s and 1930s in Europe there was a movement known as the New Typography. It was a movement that rejected traditional type set in symmetrical columns and instead treated the printers block as a blank canvas to be explored in its entirety. The calling card of the movement was type arranged in harmonious and beautiful asymmetrical compositions. In the last 2 years there is another slow breaking wave of typographical exploration. The printers block is now HTML and CSS and Javascript are fast becoming the new tools of the typographer – not just for the web, for ebooks and for print, and not just for printed books, but for all printed material.

Browser as typesetting machine

The change of the books basic carrier medium from paper to HTML (the stuff webpages are made of) has meant many changes to what we might still call typesetting. Kindle and other e-ink devices actually move ink on a display to form words, sentences and paragraphs. The moveable type of Gutenberg’s time has become realtime, in a very real sense each book is typeset as we read it. Content is dynamically re-flowed for each device depending on display dimensions and individualised settings to aid readability. Moving type in ‘read time’ marks a significant paradigm shift from moveable type systems, including digital moveable type manipulated by Desktop Publishing software, to flowable typesetting. We are leaving behind moveable type for flowable type.

The engine for reflowing a page in realtime is something we have seen before. It is the job of the browser. And, since ebooks are webpages, browsers have come to play a central role in digital ereaders. In the case of the iPad the iBook reader is actually a fully featured browser engine; Webkit, the very same technology behind the Chrome and Safari browsers. Browsers are the typesetting machines for ebooks.

What is interesting here is that the browser can also reflow content into fixed page formats like PDF which means that the browser is becoming the typesetting engine for print. CSS and Javascript are the print design tools of our immediate future and the vast majority of innovations in this area are based on Open Source and Open Standards.

The power of CSS and Javascript

CSS is the set of rules used by the browser to know where to place type, images and other elements on a webpage and style those elements. Typical rules define where an image is placed in relationship to text, what fonts used, the font size, background color of the page, and the maximum width of an image, etc. While designed originally for the exclusive application to webpages the CSS Working Group, responsible for overseeing the development and direction of CSS, anticipated the intersection of the book and the web some time ago. In the latest drafts of the CSS standards new additions are almost entirely focused on typography and page control. As a consequence this area is starting to blossom. In particular, the CSS Generated Content for Paged Media Module specification is astonishing for its reframing of flowable text into a fixed page. Cross reference and footnote controls, not needed on the web, are among many book-like structure controls being addressed by CSS. Table of contents creation, figure annotations, page references, page numbers, margin controls, page size, and more are all included. The definition of these rules precede their adoption in browsers, however they are being included in browser engines, notably Webkit, at a very fast pace.

Coincidently there has recently been an explosion in interest in improving browser typography primarily for the better design of websites. Although these advances have not been made with book production in mind these advances can be inherited by the browser for typesetting both electronic and paper books. Of interest is the sharp rise in the websites offering tips on CSS typography an explosion of web fonts, and some very interesting Javascript libraries.

Javascript is the programming language of the web and it can be used to create dynamic content or manipulate objects on a webpage in ways CSS can not, or can not yet. Of particular interest is Kerningjs, inspired by the previously available letteringjs library. These code libraries allow you to change each letter individually in a paragraph or heading and control the spacing between letters (called ‘kerning’). Kerning is essential for printed books, and ebooks, but missing from browsers for a very long time. Colorfont is another Javascript library which enables dual toned glyphs, and the amazing TypeSet Javascript emulates the sophisticated TeX line spacing algorythims developed by Donald Knuth. Even the layout of musical notation (which was never effectively mechanised with Gutenberg’s moveable type and was hand written into books for many decades after the printing press came into the world) has come into focus with the VexFlow Javascripts. With libraries like this it is apparent that Javascript, the programming language of the browser, has a future with typography, and with that Javascript is fast becoming the lingua franca for all typesetting.

There is a lot of fuel in these developments and, interestingly, most of it is coming from outside the traditional print and publishing industry. It could be said that these industries, built upon the printing press, have lost sight of their very foundation. Instead the IT industry is taking hold on a very deep level. Apple and Google are behind the development of Webkit – the rendering engine behind iBooks, Safari and Chrome – which makes a lot of these typesetting innovations possible. Apple utilises these typographical features not just in its browser, but in the development of its iBook reader – the ebook reader on iPad which is itself based on Webkit. Google also fuels these innovations for many reasons other than the browser – better typography in Google Docs being one of them. We can expect the momentum to build and it is possible to say with some confidence that the browser, together with CSS and Javascript is to become the most important typesetting engine of our time as it is fast becoming the typesetting mechanism for digital and paper books and the web.

Ease and efficiencies

The implications for this are enormous and possibly not yet fully realised. At publishing industry conferences and other book-focused forums the attention has largely been on the ebooks effect on distribution, ereaders and the demise of the so-called brick-and-mortar book stores. The biggest effects however are elsewhere, ‘bubbling under’ in the recasting of the browser as a typesetting engine, and with it the slow realisation that the technical ecosystem surrounding book production can be replaced by tools for producing webpages. We are beginning to turn our attention to the tools for making webpages, to make books, and this, it turns out, is much easier than with Desktop Word Processing and Publishing software. Additionally due to recent developments, all of this, as it turns out, can also be used to design print (more on in-browser print production in a future post). Book production once again is becoming faster and cheaper and on its way to achieving another leap of magical efficency.

The future of book production right now is exploding all around us. These pieces of the puzzle are coming together and coming together fast. We can almost watch in real time the necessary mechanics get filled in by new release candidates of major browsers and searching online for ‘out of the blue’ small innovations such as Javascript typography controls. It is getting easier and easier to make books in the browser and consequently there has never been a time when it has been this easy to make books of all kinds. Ease of production is where it all started for Gutenberg and it is starting again for us. If you believe Gutenberg’s efficiencies changed society forever then what effect will the new new typesetting engines have? Its a giddy question. Making books in the browser will have an enormous impact on society as a whole, and just like the printing press, it will not revolutionise the old order, but create a new one.

This material is Creative Commons BY-SA 3.0 unported. Attributable to Adam Hyde, 2012.