Hacker News Reader

Comment by pavlov | Hacker News Reader

The tight line spacing has a negative impact on readability. It’s hard to read long paragraphs of dense body text like this. But the tables and other character graphics require this tight leading.

That’s the problem with using the same character grid for both graphics and text. It could be alleviated with a font that has a particularly low x-height (leaving more margin above and below the letters).

View on HN

I thought you meant line width and was confused because it's in the generally accepted range (~70 characters).

The line height, I agree, is too tight. 19.2px at 16px font size is too cramped at only 1.2x. Making it 24px is a big improvement.

To my eye, however, a taller line height doesn't affect the tables and other character graphics. With some tweaks like this I think the monospace style comes across quite well.

* edit - I think I see your point; it does break the author's concept of the fixed grid (set line-height: 24px for p elements and turn on the author's "debug mode" to see the grid.

you could adjust the margins between paragraphs to fix the fixed grid, but then the tables won't adhere to it

turning on the debug mode shows that the text gets misaligned with the grid

I can't stand monospace for reading, so I made a bookmarklet because all reader modes suck leaving font preference even though this site works fine just changing the normal text tags over to sans-serif.

   javascript: (function() {
    (function() {
        const textElements = document.querySelectorAll('p, span, h1, h2, h3, h4, h5, h6, li, td, th');
        textElements.forEach((element) => {
            const textColor = getComputedStyle(element).getPropertyValue('color');
            element.style.fontFamily = 'system-ui, -apple-system, sans-serif';
            element.style.WebkitTextStroke = `0.4px ${textColor}`;
        });
        location.hash = "";
        history.replaceState("", "", location.pathname);
    })();

})();

https://caiorss.github.io/bookmarklet-maker/

Doesn’t work in Netscape Navigator.

Joke. Cheers! ;)

How does it compare to the tightness of comments here in HN?

Looks like HN uses `line-height: normal`, so it would be the same factor of 1.2 times font-size that's used on the Monospace page.

Is it the tight line-height, or just the fact that monospace fonts a more difficult to read than proportional fonts

(due to monospace words have a more similar 'shape' than proportional type words)

IMHO it’s the latter.

Had the same instant turn off.

Reply on news.ycombinator.com