Ask HN: Best Fonts to Use on Websites?

I like sites to be readable, quickly, and without leaking too much information to third parties. 'Beautiful' Web fonts tilt against all of those metrics.

I understand there's an ongoing debate about using web fonts versus system fonts due to privacy concerns. I've experimented with disabling web fonts while browsing, but found that many sites become almost unusable without them.

    body {
        font-family: sans-serif;
        font-size:  16pt;
        line-height:  1.6;
    }

    h1, h2, h3, h4, h5, h6 {
        font-family:  serif;
    }

That's readable, thus a minimum standard for beauty.

Use of colour, spacing, case, image then become important for making powerful prioritisation, focus, structuring absorption/presentation of your message. A specific font may or may not be part of this, and advantage of system fonts is not just their speed, but their familiarity - this can also be a disadvantage if intentionally seeking to disjoint a user or place them in a context associated with the font.

I like this showcase: https://beautifulwebtype.com/

It’s a system font on many devices but Roboto is a nice default.

https://fonts.google.com/specimen/Roboto

I also like IBM Plex Sans.

https://www.ibm.com/plex/

I adore this font for everything, especially eBooks, but I haven't tested it against a responsive web UI.

https://www.dafont.com/apple-garamond.font

I assume it's an Apple knockoff, or maybe even an original.

I recommend it highly, especially for eBooks.

I far prefer fonts that are accessible to the most people. Anti-dyslexia fonts might be too odd at first, so I avoid using those for now. I've read that sans-serif is best for text on screens, and serif for text on paper. The font should err on the side of larger rather than smaller. Functional is beautiful.