Converting PDF to flipbook without loosing focus
As Google is progressing further and further away from flash the transition for many publishers taking their PDF web publications to the web is becoming something of increasing importance. While there are many services out there offering conversion of PDF to various HTML5 formats, very few of them actually offer real conversion. At best, they convert documents to bitmapped versions. With FlowPaper Elements, PDF documents are not bitmapped, they’re actually converted to real, crisp elements that stay sharp on all devices and sizes. This post illustrates a few things we do as part of this converting the PDF documents. You can see an example of a converted PDF flipbook publication below:
https://flowpaper.com/elements/catalog-flipbook/
How to convert your PDF documents to a HTML5 friendly format
To convert a PDF to a web friendly HTML5 flipbook, a few steps needs to be taken.
1. Fonts need to be converted to web friendly fonts
This means that all glyphs and characters needs to be adjusted to a format that is indexable by search engines and stays sharp on all devices. The fonts need to be converted to either woff, ttf and with a fall back eot.
2. All layers of the PDF needs to be flattened
To optimise the viewing experience for devices with slow CPU, only visible layers should be visible.
3. Visible text should be real sentences and rows
In a PDF, each character can be individually positioned in the document. While this may give a greater sense of accuracy, it also decreases performance significantly. By converting visible sentences and texts to real, actual sentences and rows, performance is improved greatly.
4. The PDF publication needs to be split up into easily downloadable sections
Speed is key. To avoid long download times, the PDF should be split into sections that are quicker to download for the browser.
On top of this, accuracy of course needs to be maintained to the maximum so that the flipbook matches the original publication correctly.
So what does the difference look like between a real conversion and a bitmapped conversion?
To illustrate how big the difference is we have taken this screenshot from a publication converted with FlowPaper elements (right side) and a typical flipbook (left side). You don’t need to be a rocket scientist to see the difference in output.
Want to try with your own PDF? Download the FlowPaper Desktop Publisher and give it a go!