13 ms·
Pagination widows, or, why I'm embarrassed about my eBook (2023)
- gorgoiler 2y agoIn the page model, a heading says it needs only one line of vertical space, so if there’s a tiny bit of space at the bottom of the page it’ll get orphaned. (Vertical box space shown as ! and % for the heading and paragraph, respectively.) Page 1 Page 2 .. Paragraph..% .. ..text. % .. .. .. .. !Heading When instead it should be moved to the top of the next page: Page 1 Page 2 .. Heading ! .. Paragraph.. % .. ..text. % .. .. .. Rather than being honest about needing one line… Heading ! Paragraph.. % ..text. % …the heading could instead claim it needs three lines, which would ensure it would never be orphaned: Heading ! ! ! Paragraph.. % ..text. % But now you have a big gap below the heading. If you could then shift the paragraph up from where it should be in the flow such that the vertical space of the heading and paragraph overlapped… Heading ! Paragraph.. !% ..text. !% …then you’d get a heading that would never be orphaned on one line, but which looked as it if only used one line.
- Izkata 2y agoI don't know if it would fix splitting across pages, but that sounds like negative margins. They've been in CSS forever. The basic idea: .heading { margin-bottom: 30px; } .paragraph { margin-top: -30px; } Also: > the heading could instead claim it needs three lines, which would ensure it would never be orphaned It wouldn't prevent being orphaned at this point in your idea. What if there was room for 3 lines at the end of the first page?
- gorgoiler 2y agoIf the bottom of a page has room for a heading and 3 lines of text (or some number of lines that looks appealing) then that’s enough space for the heading to not be considered orphaned.
- Izkata 2y agoBut without moving the paragraph up, there wouldn't be text there, just a big empty area.
- dotancohen 2y agoAs the author of the fine article states, that is preferable to the orphaned heading.
- Izkata 2y agoThe article says it's better to have blank space instead of the header, not next to the header.
- p4bl0 2y agoI'm not sure the proposed approach would work, in particular on ebook readers. But if if does, I believe margins may not be the right way to do it. Padding might be however, because it is actually inside the box (while margins of elements may be "blended" inside the margins of their parents). h2 { padding-bottom: 3em; } h2 + p { margin-top: -3em; } The problem is CSS doesn't support the lh unit yet so what's 3em here should actually be 3 times the height of a line, taking into account the font-family, the font-size, etc. Except maybe if line-height is explicitly set.
- bryanrasmussen 2y ago>The problem is CSS doesn't support the lh unit yet so the problem is that ebooks css does not support what you expect a slightly out of date browser to support, and almost each ebook renderer has its own problems. Think html email sized problems.
- benmanns 2y agoEmail rendering is a great analogy.
- rolandog 2y agoI wonder if there's some sort of acid tests for eBook readers. There should be some sort of acid test as well for email readers, of course. But, IMO, all of them should be limited to avoid JS use (think of how well some sites are capable of rendering without JS [0]) [0]: https://git-send-email.io/ https://git-send-email.io/
- gorgoiler 2y agoThat worked quite nicely: https://jsfiddle.net/bqjsu98o/ https://jsfiddle.net/bqjsu98o/ However the next problem is how do you tell the print renderer that paragraphs must have a minimum of 4 lines of text? (Edit, hah! https://developer.mozilla.org/en-US/docs/Web/CSS/orphans https://developer.mozilla.org/en-US/docs/Web/CSS/orphans )
- wbl 2y agoDon't they send the copy editor to kill all the widows and orphans anymore?
- fragmede 2y agoPragmatism wins out of waiting for css properties to get implemented, and div display inline block works today in epubs and doesn't need to be backported to iBooks. https://ebooks.stackexchange.com/questions/7014/how-can-i-prevent-a-widowed-orphaned-header https://ebooks.stackexchange.com/questions/7014/how-can-i-pr...
- chrismorgan 2y agoThat's not pragmatism: that's poor judgement. That's a hack that shouldn't work at all; and if it does, it must¹ cause other problems, such as preventing breaks inside the entire first paragraph, or breaking graphically rather than linewise (that is, you could get the top half of one line on one page, and the rest on the next). — ¹ As in, it's unavoidable if you've implemented layout in such a way.
- fragmede 2y agoWhat's the name of this site again?
- justinator 2y agoVC-Influenced-News just doesn't have the same ring to it.
- chrismorgan 2y agoThere are hacks and there are hacks. This is a bad hack, one that might fix a problem, but only by causing a worse problem. On the positive side, on proper clients it will approximately do nothing.
- mjevans 2y agoI thought Div as well, but as a BLOCK element containing the Heading line AND the first paragraph to ensure they're rendered on the same page, or at least start on one and then overflow.
- cratermoon 2y agoMaybe the reason we're still stuck with LaTeX and PDFs because ebook software can't be bothered to implement decent typesetting.
- HKH2 2y agoFor printing, yes.
- pseingatl 2y agoPDF's are size agnostic, by the way. We think of them as being restricted to A4 or letter paper, but you can generate a pdf of almost any size.
- willvarfar 2y agoDo you mean they can be created for any page size, or do you mean they sensibly resize when you change page size?
- lou1306 2y agoHe (probably) means that the geometry of a PDF "page" can be customized. You can even have different sizes within the same document. But most people using LaTeX or even basic plotting utilities which export to PDF know this.
- p_l 2y agoA properly prepared PDF will scale "perfectly" (FSVO - needs all drawings in vector form) as long as you keep the aspect ratio the same. The problem is changes in aspect ratio or wanting to reflow text to have larger font when rendering to small screen. Not sure if it's doable to generate flexible enough rendering commands in PDF. Was doable in PostScript (again, FSVO) but PDF was explicitly made to be decidable and less turing complete.
- pwg 2y agoThe PDF specification is size agnostic. A given, created, PDF, is fixed to whatever size it was created to represent. Acrobat claims to be able to "reflow" some PDF's, but whatever it is doing is more black magic voodoo than anything else, given how text layout is represented inside the PDF format. The text layout becomes (essentially) a stream of instructions to "move current point to 123,456" and "place this text at current point". And the numerical values used are tied directly to the page size and internal "point size" used by the PDF writing software. I.e, the text is simply "physically positioned" on a virtual x,y canvas.
- acabal 2y agoIf you think it's bad that `break-*` isn't supported in Firefox or Chrome, wait till you see what your ebook looks like in Kindle, or worse, ADE-based readers, of which there are still many in use! Kindle, the reading device with by far the largest market share, is basically the IE6 of ereaders - too big to ignore, and at the same time dragging down the entire ebook ecosystem with its crappy renderer. Amazon has shown little interest in improving it for over a decade now, while simultaneously fragmenting its own ecosystem with a variety of different proprietary formats that support different CSS and features. ADE, while less common in new devices, is still very common in much older devices - B&N's eink Nooks were based on ADE at least as late as a few years ago. (Perhaps they still are?) ADE is closer to IE5 in terms of CSS support! At Standard Ebooks we're often hamstrung in our attempts to make beautiful ebooks by these big players refusing to improve their renderers. We're forced to dumb down our CSS and use outdated techniques (like occasionally having to use tables for layout!) because ebook renderers are so bad. iBooks is the top tier renderer, because as far as I can tell it's basically a wrapper for an up-to-date Webkit; next is Kobo - also Webkit-based - along with other Webkit-based indie apps. The rest of the big players are far, far, far distant.
- Uvix 2y agoI don't rate Kobo's renderer very highly. When the user turns on justifying body text, the device ends up justifying everything, including headings, and it just looks awkward.
- omnimus 2y agoYou are not rating the renderer but ux decisions made by the Kobo reader devs.
- lidavidm 2y agoNeat, I didn't realize Kobo was WebKit-based, but given they offer a full browser (experimentally) on their readers, that makes sense. They also support some 'nice' ePub 3 features: fixed layouts so that comic books and manga work properly; right-to-left pagination for Japanese books, and vertical layout (also for Japanese books). Though, I feel like their page numbering gets mixed up with vertical layout (sometimes opening and reopening the book changes the # of pages, and I lose my spot...)
- userbinator 2y agoThe fact that it's a book about typography may mean the requirements are a little different, because I personally (and likely many others) don't really pay attention to such things.
- philk10 2y agoFirst half of my career was at a company writing pagination systems for books/magazines and so I can now never not notice such things as widows, orphans, kerning...
- justsomehnguy 2y agoGive a man a fish and you feed him for a day; teach a man to notice an improper keming and he would curse you for the eternity.
- nextIt 2y agoI see what you did there...
- Al-Khwarizmi 2y agoYou might be paying more attention than you think. When I wrote my PhD thesis, I made some effort to follow good typography practices (I thought that since I had devoted so many hours to the work, it would make sense to devote some time to make it look as good as possible... and I guess it was also a way of procrastinating from writing content) :) Various people who "don't pay attention" told me that it caught their attention for being really nice visually, even if they couldn't pinpoint the concrete differences that led to that.
- Daz1 2y ago[flagged]
- jll29 2y agoNot to mention the ugly/unusable rendering of mathematical formulate in ebooks on my Kindle, which is gatherig dust. Layouting is an art and a craft, and the fact that it's automated by people who lack the specialized knowledge, or for whom it is not a priority (quarter century old bug reports, really?) suggests that in 2025, you should still avoid ebooks if you care about quality and aesthetics. This is a shame because e-ink is just becoming usable. Anyhow, long live the paper book!
- WalterBright 2y agoYou could include the formulae as jpg's, not html.
- tagawa 2y agoThe downside of that is screenreaders can't read them out.
- pohuing 2y agoAlt texts are a thing on epubs. I would hope Amazon's format can do them as well.
- WalterBright 2y agoProblem solved!
- _Algernon_ 2y agoDoesn't work well with theming.
- Skeime 2y agoI have not once seen a formulae-as-images solution that I would consider acceptable, aesthetically. Common problems are: - It almost impossible to align the baseline of the formula to the baseline of the surrounding text. - Often, images are only used for "complex" formulae, while simple ones are implemented using normal typesetting. This resolves the baseline issue for simple formulae, but now the fonts between simple and complex formulae don't match. (This requires extra concentration for the reader, as in other contexts, different font styles are frequently used meaningfully.) - The images often have sub-par resolution.
- WalterBright 2y agoIf I was designing an ebook reader, the display would look like a book's display. None of the ereaders I know of do this. 1. Have a background image that looks like paper. No, a solid white or tan background doesn't look like paper. Paper has imperfections in it, dirt, a grain, and you can faintly see the other side of the page. Except for the latter, this is easy to achieve. Simply scan a bunch of blank pages, and use the scan for backgrounds! 2. No, having a background with a fake coffee stain ring doesn't work, because it's the same on every page. You need a few dozen pages, each with a different stain. 3. A printed page is imperfect. The letters can be uneven and blotchy. No, don't have a blotchy font. Have maybe 20 slightly different versions of the same font, and randomly select a glyph from one of them. 4. Books open to two pages. Not one. Two. The ereader should show two pages side by side, like a book. 5. Book fonts tend to look better than ereader fonts, though I cannot explain why. But most of all, the sterile perfection of the ereader is like a drummer who is too perfect. Introduce error in it, it makes the music easier on the ears, and the books more pleasant to read.
- OscarCunningham 2y agoDo all of that using a PRNG seeded for the book and the reader's ID. So your copy of the book is the same every time, but different from everybody else's.
- hydrolox 2y agoTo be honest I don't know what ereader you've looked at or what books you read. The way eink works, if you look closely there is a slight grain very reminiscent of paper. Similarly, the font/letters can have small imperfections as well, and it all looks just like a new book might.
- WalterBright 2y agoI have probably 8 or so Amazon ereaders over the years, of different models. I also use the Apple ipad, and the pdf readers on many other devices. I've bought a couple ereaders from other companies, but they didn't "take" with me. My current favorite ereader is the retina ipad, though its battery life is short. Modern paper books have much more precise printing than books printed 20, 40, 60 years ago. I find the irregularity of the older ones rather charming, the new ones are also sterile - being too perfect. I suppose it is like my indifference to autotuned singers. Too perfect. Doesn't sound human. P.S. have you ever visited a medieval village in Europe? I find them wonderful, as there are no straight lines anywhere. It's all pleasingly crooked. I considered building my house slightly crooked, but that turned out to be far too expensive as everything would have to be custom made.
- elric 2y agoI wouldn't be embarrassed about that particular ebook, it's probably the best looking one out there. The other 99% of ebooks however are atrocious. I get that this isn't an easy problem to solve, with many different screen sizes, resolutions, and zoom levels. But the status quo is awful. I refuse to buy tech books in ebook format. Anything with any kind of diagrams (let alone actual pictures) is an automatic no because I know it'll suck. My Kobo is pretty good for reading sci-fi tomes. Fantasy isn't as fun, as they often come with maps and the maps always render poorly.
- nephanth 2y agoInterestingly, this related bug had very recent activity: https://bugzilla.mozilla.org/show_bug.cgi?id=775617 https://bugzilla.mozilla.org/show_bug.cgi?id=775617
- benmanns 2y agoMost eBooks are produced by creating a new InDesign ebook document from the existing InDesign print document. Then you fiddle with a bunch of stuff to make it look right (removing the forced line breaks and such you did to get the print document looking how you want it, etc). That's then exported to ePub, which is a zip of some HTML, CSS, images, and fonts. The code outputted is absolutely terrible, as one used to get creating webpages with WYSIWYG Dreamweaver et al. and causes a lot of issues that have to be fiddled with in InDesign, manually corrected in the unzipped export, or frequently just left in the final book. There really should be a better eBook specific authoring system. Ideally with importing from the print document, as that's the canonical version. It's just a website, after all, and we have great tools for building those.
- grecy 2y agoI use pandoc to covert the source latex into an epub, then massage the result a little to tweak a few things. It’s all scripted and works extremely well. details here: http://theroadchoseme.com/how-i-self-published-a-professional-paperback-and-ebook-using-latex-and-pandoc http://theroadchoseme.com/how-i-self-published-a-professiona...
- zargon 2y agoAnother frustrating thing with ebooks is that you can't get them in PDF format any more. So much time is spent making a nicely fomatted hardcopy edition, then the ebook is only available as a terribly auto-converted epub that throws away all the layout and style. Particularly cookbooks, as well as anything technical, I just can't stand how lazy, ugly, and difficult to read the epubs are. All the tooling already exists to produce PDFs identical to the print version, but no, we can't have those.
- jiehong 2y agoI think it's a great point! Perhaps authors could also produce PDFs designed for common tablets as well, and therefore get the exact expected format. I do agree with the author that paged format are difficult with browsers to this day, and I also hope this can improve.
- Tepix 2y agoFor me, it's the opposite. Whenever i have the choice, i want EPUB, not PDF. The problem with PDFs is that you don't have a device that is the same size as the original page size in most cases.
- Ma8ee 2y agoIt depends on what kind of book it is. Fiction EPUB all day. Technical books with figures, tables or code listings, PDF!
- eleveriven 2y agoExactly! EPUBs are great for novels or anything you just want to read line-by-line
- lxgr 2y agoThey're really great for anything I want to read on my phone, including technical books. I'll take a slightly-less-great ePub over a PDF I have to scroll around or use terrible reflow heuristics via some reader any day.
- benrutter 2y agoEbooks where such an exciting prospect when they came out, but whether it's because of anti consumer monopolies, focus on DRM protection instead of features, or just plain old inertia, they haven't really advanced at all passed their first ever implementation. I sometimes read interactive fiction, and even a format as intentionally simple as Twine supports variables so content can be dynamic. There's no reason ebooks couldn't do things like that, but they are so far behind that they haven't even caught up with where print publishing was 50 years ago yet.
- atoav 2y agoAs someone who learned layouting from a grumpy old typographer who still had experience in cutting letters by hand I have to say epub layouts are often quite horrible — especially when figures and tables are involved.
- warpspin 2y agoWhile everyone here seems to talk about the epub angle to the story, there's also simply the deeper story here, that "the web's" handling of paged media and the CSS paged media specs (to which his epub problem is related) is a never ending shitshow. Not only for epubs, for everybody who actually wants to print to real paper, too, ideally with a working cross browser solution. Mistake is largely not in the specs, but in the lack of support for them. Page breaking controls, weirdly breaking tables, lack of access to area outside the page box to influence headers/footers without weird hacks etc. etc. For printing, the 1990ies never ended. This leads to the bizarre situation where basically everyone who has semi complex printing needs in web applications will create PDF and then print that - and for creating those PDFs, often HTML to PDF conversion is used, just with actually implemented CSS for paged media. Which again proves that the spec is at least 99% there, if somebody would just kindly implement it in a browser, too. Won't be more complex than having the latest WebGL whatever thing in your browser engine ;-)
- wakeupcall 2y agoSome months ago I wanted to format/print some documents, and given the existing tooling I had I decided to try the html->pdf route. I fully agree is a shitshow. The way things break across pages is hard to fix even when hand-tuning the html itself (not just by working it around with css) to avoid content being cut across margins and pages no matter what. I've found chrome to be "less bad", but still unusable. Column handling is even a bigger joke. In the end I exported the document to libreoffice, and got something way more usable in a few hours just by editing the styles than whatever I was able to do in days of fiddling with html+browser. iBooks on apple might get a pass as it doesn't need to paginate, but truth be told it seems that epub/ebooks and ereaders in general are being targeted at novels and romance, where form factor, typesetting and formatting doesn't matter that much. I have access to ebooks through my local library and there's no way I would use, let alone buy, any technical ebook. Not to mention, I've seen a steady average decline in the quality of printed media in general over the last ~15 years. A lot less attention is put in the typesetting and layout. Even the print quality itself is lower, which I think is due to the smaller and cheaper print runs being done now also for more popular titles.
- vintagedave 2y agoAnother Safari CSS failure for typography is drop-cap support, which is where the first letter of a paragraph is drawn larger and in capitals. It's a year since I looked at this, but the comments explaining the weird CSS say: > This was actually remarkably difficult to get right: the trick is setting line-height and height to < 1em. If they were, eg, 7rem to match the font size then FireFox and Safari render very differently, with Safari showing a much taller gap in the text that the dropcap was centered in. The same CSS (https://daveon.design/manuscript-vintagedave.css https://daveon.design/manuscript-vintagedave.css) applies typographical sentence spacing to sentences within a paragraph, which you can see on any article, eg: https://daveon.design/what-are-you-optimising-for.html https://daveon.design/what-are-you-optimising-for.html I would love to see more CSS support for _typography_: not letter spacing, but actual typographical layout. The article is dead-on accurate when it says we still can't reach what was normal in layout for six centuries.
- NoMoreNicksLeft 2y agoMy personal gripe is "non-linear". These are pages you shouldn't be able to see just by flipping page-to-page... ideal for "choose your own adventure" type books. Apple Books doesn't treat these like pages that display only after you tap/click a link though. They render them as a sort of popup above the regular page, styled differently and even with a different page width, as some sort of endnote-not-at-the-end functionality. If that non-linear page also has a link to tap/click on, too bad. Nothing in the spec even slightly suggests their interpretation of it, and the longer they make it the norm, the more impossible it will become to implement the correct functionality because other book titles will have become dependent on it.
- __mharrison__ 2y agoWhen I published my first book, I had to learn all about ebook best practices and ended up writing a book about the state of the art in 2012. Sad to see how little we've moved on in twelve years. On a semi-related note, Typst had similar issues but the devs are actively working on fixing issues like this.
- lxgr 2y ago> I set myself some pretty stiff criteria for the ebook – it needed to replicate the design of print edition as far as possible [...] My hot(?) take as a reader: I want none of this. Just give me proper semantics and let my reader (while respecting my personal preferences) figure out presentation. I'm quite tired of publishers thinking that they somehow need to "preserve the unique aesthetics" of a paper-based medium, despite that usually working out quite poorly. Fonts that look great on paper don't necessarily on my eInk, LCD, or OLED display I'm reading the book on, for one thing. Margings/padding are usually a world of pain, and one of the first things I end up doing when opening a new ePub is often to disable all publisher formatting. While I love the idea of an open format and really don't like the idea of being stuck in Amazon's walled garden, at least they figured that part out in their Kindle ecosystem from the beginning. With ePub, it's been hit and miss.