Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Laying Out a Print Book with CSS

iangmcdowell.com

Post reply on HN
Print view View original

91–100 of 121 posts

Re: Laying Out a Print Book with CSS

#91

Post by nforgerit »

Another method I haven't seen mentioned yet and that I grew fond of is to use Apache FOP ("Formatting Object Processor") which is still under active development and comes with this beautifully retro Apache open source homepages[0]:

(1) It has a pretty good idea about Layouts, Pages and other elements one would need for printing

(2) It supported all the graphics formats that I ever needed in the past and automatically fetches images by URL when it stumbles upon them.

(3) It is easily embeddable into some custom Java app.

(4) It is based on W3C open standard (which though doesn't seem to be developed anymore)

(5) It does PDF/A.

(6) XML/XSLT is a bit annoying to write for your template, so I used a common templating engine (e.g. Thymeleaf) to render the XML/XSLT that I passed on to FOP. Worked like a breeze and gives you the possibility to create your own little DSL.

(7) I'm still happily generating my invoices through FOP put behind an API that takes input data and uploads the generated documents into a bucket.

(8) I don't have the exact numbers but last time I checked and compared output sizes of browser printed pdfs vs "generated by Fop", I saw smaller PDFs with Fop. It doesn't mangle the input images though

All in all, I trust FOP better to generate printable documents than any CSS/Headless Browser thing. It comes with an arcane template format which, as said, can be abstracted away but therefore has much smaller infrastructure footprint than spawning headless browsers.

[0] https://xmlgraphics.apache.org/

Re: Laying Out a Print Book with CSS

#92

Post by grecy »

For my print books I've used LaTeX for the print pdf, then I run that through Pandoc to create an epub from that same source files with a script. I'm extremely happy with the final results. Here's how I did it all [1]

Using macros and defining your own functions in LaTeX is a game changer, and when it came time to make my second book, I was up and running typing content in about five minutes, and it has the precise same look and feel.

[1] http://theroadchoseme.com/how-i-self-published-a-professiona...

Re: Laying Out a Print Book with CSS

#94

Post by nye2k »

I remember my excitement when CSS3 became reality in modern browsers. I was following this project closely, which attempted to use recreate Robert Bringhurst’s The Elements of Typographic Style in CSS. That project made it clear just how far we were from a legible, printable web.

http://webtypography.net/

Re: Laying Out a Print Book with CSS

#95

Post by starkparker »

smulloni wrote: post #89
cubefox wrote: post #64

The author is actually underselling CSS for rendering PDF layouts. Of course, if you just do a static book, you are probably better off with software like InDesign. But if you need PDFs with dynamic and complex content (e.g. info documents with graphs, tables, dynamic text) then HTML/CSS is actually pretty great. As he mentions, unfortunately the CSS3 Paged Media spec is not very well-supported by major browsers, tho…

I've formatted ~100 non-scientific books with LaTeX, including poetry and experimental/avant-garde fiction that makes considerable layout demands. I have yet to run into a problem that could not be solved. It isn't always the best tool for the job — for layouts with lots of images that need to be precisely placed with text, something like Affinity Publisher or InDesign would be a shorter path to the right result — bu…

I mean, good for you and congrats, so you must be right. Something other than LaTeX must be responsible for so many non-academics and non-technical people bouncing so hard off of it for almost any other tool. It can't possibly be anything related to LaTeX because if you're so good at it, anyone can be.

Re: Laying Out a Print Book with CSS

#96

Post by yojo »

bayesian_horse wrote: post #32
ognarb wrote: post #24

For those interested in this topic, you might want to checked paged.js https://pagedjs.org/documentation/ It's an polyfil for the unimplemented CSS paged specification, which is exactly that is needed for laying out pages. https://www.w3.org/TR/css-page-3/

At the moment, the combo of pagedjs with a headless browser is my first recommendation when you need something to output pdf automatically. Weasyprint looks nice, I have yet to use it. It probably has the advantage of not using an actual browser document (with all the relayouting problems), and may use fewer resources in terms of time and memory (I'd have to check though). The disadvantage is also it's not an actual…

> meaning you need to render the html and css in some form before passing it to weasyprint

I'm not sure I understand this part. WeasyPrint is a rendering engine; it takes an HTML file as input and outputs a PDF.

I can't speak to resource usage, since this was very ad-hoc. For my needs, it was very simple to set up, and worked on the first try. I was testing with about five pages of content, and on my M1 MBP it rendered out the PDF pretty close to instantaneously, which was nice for the edit/refresh cycle. Preview on MacOS actually live reloaded when the PDF changed, which was a pleasant surprise.

Re: Laying Out a Print Book with CSS

#97

Post by yojo »

ognarb wrote: post #24

For those interested in this topic, you might want to checked paged.js https://pagedjs.org/documentation/ It's an polyfil for the unimplemented CSS paged specification, which is exactly that is needed for laying out pages. https://www.w3.org/TR/css-page-3/

Thanks for pointing this out. I came across paged.js but for some reason thought it wasn't implementing the margin boxes – I think I just searched their documentation page for @top-center and didn't find it. Looking again, I see that they definitely do.

Something to check out next time I do this.

Re: Laying Out a Print Book with CSS

#98

Post by yojo »

cardamomo wrote: post #36

As a former freelance book compositor, I can say there are typically many more details that go into laying out a book. To take this layout up a notch, I would want to create a baseline grid (set the line heights and paragraph margins to align text of different sizes). I would also want to control widows and orphans, which is built into CSS.

Good point. My goal was definitely just getting to an output that satisfied me as a reader, but there are certainly people out there with more refined aesthetic sensibilities that are going to spot the places I fell down.

The part that seemed hardest to get just right with CSS was text justification. I can specify inter-word justification, but there are cases where getting the spacing just right is impossible without breaking a long word using a hyphen. As far as I can tell, there's no programmatic way to do this with just CSS.

I addressed widows and orphans in my ePub layout, but for some reason forgot it in the print layout (d'oh). The nice thing about print on demand is it's easy to make updates, which I will. So thanks for pointing that one out! I'll also read up on using a baseline grid, I suspect CSS will work fine for that, since my content is all text with little variation between sizes.

Re: Laying Out a Print Book with CSS

#99

Post by pauljonas »

A few years back, I wrote a web based publishing tool that used `wkhtmltopdf` to generate PDF from database content along with web images (& even more complicated with API access & Google Maps API). It took a lot of tinkering but it worked. At times, extra fiddling needed to generate accurately the Table of Contents (basic, uses `H1-6` elements in document) with proper page references and formatting. But it worked, even with allotting for stuff like "bleed" (it was being printed a massive color printer we leased that could bind or staple.

Re: Laying Out a Print Book with CSS

#100

Post by Hackbraten »

pauljonas wrote: post #99

A few years back, I wrote a web based publishing tool that used `wkhtmltopdf` to generate PDF from database content along with web images (& even more complicated with API access & Google Maps API). It took a lot of tinkering but it worked. At times, extra fiddling needed to generate accurately the Table of Contents (basic, uses `H1-6` elements in document) with proper page references and formatting. But it worked, e…

Thank you for wkhtmltopdf. If I recall correctly, Pandoc uses it under the hood for generating PDF?
Post reply on HN