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

Perfect Edition: A lightweight, responsive web e-book template

github.com

Post reply on HN
Print view View original

51–60 of 71 posts

Re: Perfect Edition: A lightweight, responsive web e-book template

#51

Post by IggleSniggle »

greatgib wrote: post #10

The work is nicely done. But each time I see a website presenting a book content or catalog in pages like that, like if it was a real book, it really pisses me off. It is a design move that goes against ergonomy. Harder/slower to browser, harder/slower to seek, you have to do a mental break while pages are changing with effect that does not get the same efficiency feeling than a real book.

Hard disagree when it comes to reading a novel, at least in the context I generally read these days: on a mobile phone.

Tap/swipe/arrows to turn really switches my brain. And the fact that the goal of this library is to allow native support for everything else for the entire book (like find, etc) really makes this feel like using the Kindle app or the Apple Books app. It's the first time I thought to myself, "no, I wouldn't need to download the ePub and put it on Dropbox so that I can easily import it to my favorite eBook app. The html version is great."

What I didn't notice is if your page number is captured in the url or not (again, because I'm on mobile). That seems like an important feature.

Re: Perfect Edition: A lightweight, responsive web e-book template

#52

Post by harshreality »

vngzs wrote: post #16

If you open most books on the shelf you will notice that text is not left-aligned, but is in fact justified to create a consistent vertical margin on the right-hand side[0]. It's the big thing I always miss when I try reading on the web. One way to do this is with JavaScript implementations of the LaTeX hyphenation/justification algorithm. Check out [1] and [2] for examples. [0]: https://i.imgur.com/65ICUVW.png [1]:…

Justified text looks pretty, but why does that matter? Most books are bought to be read, not to sit there admiring the right edge justification.

There's even a plausible theory that justified text is bad for readability (perhaps because the brain loses that hint of which line is which). I haven't seen a lot of studies[1] replicating it, but I don't see any studies taking the other side. There's also the problem that it alters the inter-word spacing, which might also reduce readability since the brain can't rely on consistent word spacing.

I sympathize if you're conditioned to be annoyed every time you see an unjustified right column, but that's not a reason to recommend justified text.

Publishers (and authors, when they're considering text style details) need to understand that ebook publishing isn't the same as publishing print books. For print, decisions about font and styling have to be made, because otherwise there's no text.

For an ebook, unless it's a picture book or textbook with careful design[2] or some other kind of book where layout is the primary concern and readability is secondary, no features of the main style of text should be hardcoded. It needs to be left up to the ebook reader, and whatever defaults plus user customization it has.

[1] e.g. https://doi.org/10.1111/j.1467-8535.1986.tb00491.x

[2] These kinds of books, where publisher-dictated styling makes sense, shouldn't even be published as epubs; it often ends up as a disaster no matter how hard they try. They should publish the books as pdfs only.

Re: Perfect Edition: A lightweight, responsive web e-book template

#53

Post by IggleSniggle »

throwaway413 wrote: post #14

Nice! I recently built something similar, but less longform: https://booklitapp.com (The demo on the homepage is swipeable on mobile and draggable on desktop.) My goal was to be mobile-first. One thing I haven't added yet is a table of contents generator - I like how you have the TOC toggle at the bottom!

This is nice! Since you mentioned you wanted to be mobile first, I should mention a couple issues I ran into on my phone:

The header bar, with Login and Signup on the right, did not fit on my screen (stopped right around the "S" of Signup), and I was not able to horizontal scroll the header to get to that link, even though it look like it would be horizontal scrollable.

It seemed like while I was interacting with the book on the front page, either the book jumped up and down or the vertical scroll jumped up and down (I'm not sure which) as the sell-text was written and removed.

Re: Perfect Edition: A lightweight, responsive web e-book template

#54

Post by chrismorgan »

smichel17 wrote: post #46
chrismorgan wrote: post #30

Earlier quoted context omitted.

I agree with almost all of the content of Practical Typography. But “stop underlining links on the web” is the point I disagree the most violently with. Removing link underlines is user-hostile. There’s a large body of research to that effect: underlined blue text means a link, not-underlined text in a colour different from the surrounding text… might be a link? But many will miss it. “Are un­der­lined links dead? Ma…

How do you feel about underline on hover, as a compromise between aesthetics and functionality? Eg, https://sdproto.gitlab.io/

I say it’s simply a bad technique.

But here’s what I think is a good compromise in this space: a semi-transparent underline, made opaque on hover. I’ve taken to doing this for sites I make in the last couple of years as I find it makes links more pleasant to look at, and it gives a convenient way of indicating when you’re hovering over a link, which I think is also desirable. For example https://chrismorgan.info unvisited links are #03d with text-decoration-color #03d4. (It was #03d6 when I released the site, I reduced it to #03d4 after a while.)

Sadly this currently requires adding a text-decoration-color property beside every link colour declaration, so if you vary your link colours in different contexts it requires a little more work, and if you want to make it themeable by variable you’ll have to use a preprocessor that can modify colours (e.g. scale-color($link-color, $alpha: -75%) in Sass), or use multiple CSS custom properties (--link-color: #03d; --link-underline-color: #03d4). I look forward to being able to just say `:link:not(:hover), :visited:not(:hover) { text-decoration-color: color-mod(currentColor alpha(25%)) }`.

Re: Perfect Edition: A lightweight, responsive web e-book template

#55

Post by michaelmrose »

Several issues from viewing https://robinsloan.github.io/perfect-edition/build/web/

- Having the pages you can't actually read on each side is distracting and wastes a ton of horizontal space.

- Moving the browser window to a different monitor with a different resolution can result in you being stuck half way between pages and needing to scroll to reset positioning. Resizing has the same effect. Anything that changes the window size should probably do a better job of resetting position. Its an interesting question as to where the page should reflow to but it seems like it would be optimal if the newly flowed page started at the same position.

- When scrolling by touch on my touchscreen laptop there is a fair bit of inertia when flicking it hard and not much at all when moving it lightly making it easy to end up not exactly centered. Given that you actually can't read it that way and nobody on planet earth is trying to end up halfway it should be hard to end up in that condition. It ought to snap the rest of the way if you scroll it part of the way to the next page. Where the threshold to end up on the prior page and the threshold to end up on the next is, is another question just don't let it end up halfway!

Re: Perfect Edition: A lightweight, responsive web e-book template

#56

Post by asicsp »

chrisfinazzo wrote: post #47

This is nice, but I'd still like to find a no frills, to-the-point explainer on how to assemble an epub from standard tools. After all, it's really just a zip archive with a couple directories and some specially named files. All of the tutorials I find are either woefully out of date - usually they can't create valid EPUB3 content, require stupid software like Java due to epubcheck, or just punt the whole issue to so…

I use pandoc [1] to generate pdf/epub from GitHub style markdown. I didn't know css, but learned enough to customize a few settings.

[1] https://learnbyexample.github.io/tutorial/ebook-generation/c...

Re: Perfect Edition: A lightweight, responsive web e-book template

#57

Post by asicsp »

young_unixer wrote: post #20

I've given up on reading epubs on my computer. All epub readers are crap: inappropiate fonts, weird spacing, no sheet margins (like the ones pdf readers have), etc. PDFs, on the other hand, look nice 95% of the time, unless someone uses calibre to convert an epub to pdf.

I felt like that too until I found that atril [1] and calibre ebook-viewer [2] work very well with epub.

[1] https://github.com/mate-desktop/atril

[2] https://calibre-ebook.com/

Re: Perfect Edition: A lightweight, responsive web e-book template

#58

Post by tangjurine »

michaelmrose wrote: post #55

Several issues from viewing https://robinsloan.github.io/perfect-edition/build/web/ - Having the pages you can't actually read on each side is distracting and wastes a ton of horizontal space. - Moving the browser window to a different monitor with a different resolution can result in you being stuck half way between pages and needing to scroll to reset positioning. Resizing has the same effect. Anything that changes…

Yeah, I'm on Android (pixel 3a) and it's really hard to scroll only one page at a time for me.

Re: Perfect Edition: A lightweight, responsive web e-book template

#59

Post by Shank »

I really would appreciate more sites trying to copy the Holloway reader (seen in the equity compensation guide here: https://www.holloway.com/g/equity-compensation. The most ideal readers have things like interactive tables of contents, a huge focus on typography, in-line citations and organization. Books on the web should take full advantage of the web without going overboard on javascript -- it's totally possible but this format is almost never used.

Re: Perfect Edition: A lightweight, responsive web e-book template

#60

Post by sah2ed »

Shank wrote: post #59

I really would appreciate more sites trying to copy the Holloway reader (seen in the equity compensation guide here: https://www.holloway.com/g/equity-compensation . The most ideal readers have things like interactive tables of contents, a huge focus on typography, in-line citations and organization. Books on the web should take full advantage of the web without going overboard on javascript -- it's totally possible…

Your holloway link is completely unreadable on mobile. After a few scrolls, it hijacks the viewport with an undismissable modal that forces you to sign in ...
Post reply on HN