Live data from Hacker News

Laying Out a Print Book with CSS

iangmcdowell.com

81–90 of 121 posts

Re: Laying Out a Print Book with CSS

#81
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/

If I wanted to write a book, how does this translate to the publisher's standards when it comes time to hand in the design? Do publishers accept css files? How does that whole publishing pipeline work with this css framework?

That would depend very much on your publisher... that could be anywhere from "use this page size and send a PDF" to "manuscripts only and our designer/typesetter/etc. will work on the rest". As someone who has used CSS in the way described here, I think it's beneficial even if you end up having to redo it in InDesign. It may not be a perfect 1:1 but simply coming up with the rules will make setting up styles and master pages in publishing software much more straightforward.

Re: Laying Out a Print Book with CSS

#82
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…

CSS definitely has some (a lot of?) benefits over LaTeX in terms of styling, but what I like about LaTeX is that, when you don't care about the specifics, it's insanely easy to get a good looking document. About half of this article is trying to finagle CSS into producing styling that LaTeX would produce automatically, by default.

That's only the case if you have very simple documents though, like the novel in the blog post. And those aren't usually dynamic anyway. Any more complex layouts, charts, flexible boxes are a major problem for LaTeX. Even seemingly simple tables can be a pain.

Re: Laying Out a Print Book with CSS

#83
I printed a book recently (https://makejsgames.com/) as a test and was surprised how straight-forward it was using LeanPub for the layout and Lulu for the printing.

Leanpub accepts standard Markdown (though does have its own markdown format now) and gives you an "export for printing" button that you can upload to Lulu. The cover was kind of tricky and I got some professional design help both to design it and to get the margins and bleeds exactly as Lulu wanted them, but the result was way better than I expected.

I haven't tried the other professional tools mentioned in this article so I can't really compare quality or ease, but might be worth a look if anyone is looking for something in between "do it all yourself" and "pay for fancy tools". (I have a lifetime LeanPub license from back when they still offered them but the monthly subscription fees are a lot lower than some of the tools mentioned here and you can easily get a printing done in a single month).

Re: Laying Out a Print Book with CSS

#85
post #65

This article completely misses the point. Proper typesetting is about achieving a consistent appearance starting from ligatures and kerning, then word spacing and hyphenation, up to entire paragraphs and pages. Each character has to be typeset considering what character came before, how many words are in the same line and other lines in the same paragraph. The choice of font is also questionable, but not the main iss…

> This example from the article says it all: https://iangmcdowell.com/blog/book_breaks.png What does it say? I read lots of book and... it looks like every other book. What am I missing?

See the RHS of the page, see the column of space after "detected gunfire" and "counterinsurgents".

In fact, the spaces are all over the place.

Re: Laying Out a Print Book with CSS

#86
post #65

Earlier quoted context omitted.

> This example from the article says it all: https://iangmcdowell.com/blog/book_breaks.png What does it say? I read lots of book and... it looks like every other book. What am I missing?

So properly justifying text for a print layout is hard. For example on the right page, the sentence that starts with “Marcos wondered”. You start to see how in the first line it’s fairly widely spaced but the second line starts to look like the line was crammed in to fit the line. It’s subtle but those are the kinds of things that proper print layout tools help with. It’s weird looking at one page in a vacuum you won…

Those are just like (almost) all books. "Proper" typesetting like LaTeX does seems to only be a thing in a very small subset.

Re: Laying Out a Print Book with CSS

#87
post #42

Earlier quoted context omitted.

It’s crazy, and that’s why hyphenation doesn’t really work that way. Both TeX and web browsers use Liang’s algorithm to split words. [1] It uses so-called patterns, which are short substrings of words in which numbers indicate how to divide the word. For example, the pattern “s1h” indicates that in the word “fishing”, a divider can be inserted between “s” and “h”. Patterns compete and can override each other, and the…

> The splitting algorithm in CSS is worse than the one in TeX, because it has to work in real time and because (good) splitting patterns are often missing. Surely that's only the case for real-time renderers like web browsers. If you're creating a layout engine for printed media that uses CSS as the way for authors/setters to specify style, couldn't it implement a better, slower splitting algorithm? Using an internal…

You could and that's basically what TeX does, just without the CSS. There are even typesetting systems similar to (La)TeX, that can take XML as input, see Context [1] or Sile [2]. They’re just a step away from using HTML + CSS. Why isn’t there such system? I do not know.

[1]: https://wiki.contextgarden.net/XML

[2]: https://sile-typesetter.org/

Re: Laying Out a Print Book with CSS

#88
post #53

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.

Does CSS support baseline grids? Since pagination isn't really a thing in CSS in guessing not?

Pagination really is a thing in CSS, it’s just a part of the spec that’s not well supported by browsers right now. Use pagedjs to polyfill the missing spec features and you can control how content is split up between pages, add content to page margins, add blank pages and solve all sorts of print-related problems with CSS only.

Re: Laying Out a Print Book with CSS

#89
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 — but it's an amazing and remarkably painless system. If you are producing "incredibly inelegant bloat code" with it, I'd hazard that something other than LaTeX itself is responsible.

Re: Laying Out a Print Book with CSS

#90
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/

If I wanted to write a book, how does this translate to the publisher's standards when it comes time to hand in the design? Do publishers accept css files? How does that whole publishing pipeline work with this css framework?

If you're self publishing (like I was), your publisher is probably Amazon, and they take a PDF, which is the output of weasyprint.

I haven't looked at wider distribution, but I believe most of the print on demand publishers accept a PDF file. I think some (all?) also take InDesign, which is Adobe's thing.

Post reply on HN