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? Maybe not quite. Dy­ing? For sure.” Nope. Not dying in the slightest. If anything they’ve been making a comeback as people come to their senses and realise that æsthetics aren’t the only thing to worry about. (You know what has really beautiful æsthetics? A pure white screen.)

Now in this particular case, I don’t feel the chapter headings should be underlined—because I don’t feel they should be links. As it stands they don’t even look like links, just like underlined headings. If you want to provide a link to this heading, do it otherwise: probably as a character outside the left margin of the heading or after the text of the heading, commonly using # or ¶ or U+1F517 LINK SYMBOL, potentially only visible on hover (not many people want to interact with those things, after all, so it’s fairly OK to conceal them).

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%)) }`.

It's great if you hover, otherwise it isn't obviously a link. It's not a whole lot better than good ol' '90s mystery meat navigation.

It is also considered by some to be part of good web design to not remove underlining from links, because doing so breaks the default visual indicator of links.

That's fair, though one might wonder why it's important to link from headings at all.

Underlining in headings just hearkens back to the WWW of early 1990s.