I teach user interface design, with a bit about typography but I'm not a typographer myself. But I feel like a lot of the advice there is taken from graphic design (based on the original EoTS book), and not that practical for web designers where text is slightly more fluid.<p>Namely, much of the book is about making choices that depend on the exact placement of individual characters on the screen. Like the entire section about hyphenation. This doesn't make sense if the glyphs show up slightly different on different screens. Like Mac/PC/Android might render the same glyph for a font just a pixel different (maybe even just due to the way it rounds a number), bumping a glyph on to the next line. It's really hard to control the exact placement of each glyph, and not worth fretting about for the web. So I think the principles in the book that are focused on exact placement of individual glyphs (characters) is incompatible with the more general principles of responsive layouts or using a native font stack.<p>Some of the advice is automatically taken care of by defaults on the browser/OS, like kerning or letterspacing are often not that relevant to the web designer. It might be relevant to the people working on rendering at the browser level. And the other advice is stylistic and depends on the content (like indentation and casing).<p>I think the most practical advice from this book is fairly straightforward: choose some appropriate sizings for various headers and body text, check that you have about 70 characters per line, and choose a comfortable line-height for the body text.
The web is not print and that site looks unusable to me (it might be old).<p>It kinda looks broken on a big screen and it took me a while to figure out what to do next. Call to actions were not clear.<p>Keep things simple, the web is fluid and make sure your text is legible and ensure good contrast. Also think about load performance and ideally stick to fonts that are generally already installed on devices by default.<p>Or follow this handy guide:<p><a href="https://betterwebtype.com/articles/2021/06/07/all-you-need-is-5-fonts/" rel="nofollow">https://betterwebtype.com/articles/2021/06/07/all-you-need-i...</a><p><a href="https://betterwebtype.com/" rel="nofollow">https://betterwebtype.com/</a> (free web typography course)
"HTML and CSS 2 do not have any provision for automatic hyphenation and current Web browsers support, even for manual hyphenation, is poor.<p>So don’t justify text on the web."<p>I've been waiting for this to be fixed since 1997. I suspect it is a very difficult problem to get right. My Kindle accidentally hyphenates things like "Walde-r" and "Lannister-s" (yes, I'm reading GoT again).
I do a lot of work with print lately and manual kerning has been a revelation to me.<p>I use to go through hundreds of typefaces like going through hundreds of photos on Tinder and think ‘they all suck’ but then I started adjusting the letter spacing and now I ‘love the one I’m with’.<p>I recently developed an unofficial corporate identity for my workplace (improving signage) that uses serif fonts. All the other signs use sans-serif which is half because it fits the modernist building and half because people don’t know how to do the manual kerning it takes to make serif fonts pop.<p>That said I have felt no need to kern for the web and have no desire since it will certainly go bad if the user isn’t seeing the typeface I want them to see.
I thought a general rule was to use sans-serif fonts on electronic devices and serif fonts in print, because they are repsectively easier on the eye?<p>This site - and other similar "web typography" sites - seems to immediately fall foul of that by using serif fonts. In my opinion this makes them less comfortable to read.
I am surprised that they chose a font that's designed by used on cheap shitty paper. The whole point of the web is that you didnt need to use a font thats designed to overcome crap ink and crap paper.
What does typography have to do with the web? There seems to be nothing here of value that is based on evidence about the readability of text. Especially in today's era where the medium is not fixed, it makes zero sense to treat the web as
a PDF.