PDF to HTML5 conversion – improving text grouping

When we developed our original product for the Times Newspaper to extract Newspaper content from PDF files 12 years ago, I spent a lot of time looking at pages and working out heuristics to achieve the best conversion. This was a good training ground for PDF to HTML5 conversion as I now spend a lot of time working out the best way to handle various  structures in HTML5.

Today, I have been looking at this text in a PDF file

pdf text

The first letter of each word is being made bigger to emphasize it. This works fine in PDF but HTML5 does not give us that much control on positioning. If we try to do this, it looks horrible:-(

html5 text

We are better off keeping the text the same size like this.

html5 text

This looks much closer to the original version and produces smaller files.

The final step is to run the change against our baseline of HTML5 and review any changes – turns out it works really well on large font sizes but best avoided on smaller sizes. A little bit of tweaking and reset the baseline. Then it is on to look at the next possible enhancement…

The following two tabs change content below.

Mark Stephens

System Architect and Lead Developer at IDRSolutions
Mark Stephens has been working with Java and PDF since 1999 and has diversified into HTML5, SVG and JavaFX. He also enjoys speaking at conferences and has been a Speaker at user groups, Business of Software, Seybold and JavaOne conferences. He has a very dry sense of humor and an MA in Medieval History for which he has not yet found a practical use.

Related Posts:

Markee174

About Mark Stephens

Mark Stephens has been working with Java and PDF since 1999 and has diversified into HTML5, SVG and JavaFX. He also enjoys speaking at conferences and has been a Speaker at user groups, Business of Software, Seybold and JavaOne conferences. He has a very dry sense of humor and an MA in Medieval History for which he has not yet found a practical use.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>