I bought The Elements of Typographic Style over 20 years ago. I got about an hour in and never picked it up again. It isn't that the book is bad but typography isn't a topic that I want to self study. I think I could enjoy the topic in a classroom or study group setting but my mind just wonders to other things sitting in a chair reading about it.
Web designers should get good training in typography (2006)
81–90 of 103 posts
Re: Web designers should get good training in typography (2006)
#82Font selection should be left up to the browser vendor, and ultimately, the user, and not be overwritten or otherwise dictated by the website.
Re: Web designers should get good training in typography (2006)
#83I admire all the work the typographers do to make amazing-looking websites, and yet I prefer to read sites (like mathpages, or Dan Luu's site) which have next to no styling. They're just easier for me to read. I'm definitely not hating, but I feel like it's good to keep in mind where the point of diminishing returns is.
> next to no styling
MathPages (which I just looked up) has styling, but its styling is the _browser default_. And that default has mostly not changed for a quarter century. It is simple, and familiar, though I think a few tweaks like bigger margins against the window edges would make it more readable. One example: https://gist.github.com/JoeyBurzynski/617fb6201335779f8424ad...
May I spruik my own site? I have a very simple site, with no Javascript, that embodies what I believe are good typographical principles. It has a particular focus on typographical layout reproducing century-old-style (remembering a hundred years ago is still a modern, post-WW1 design era!) https://daveon.design/about-dave-on-design.html#typography-&...
Re: Web designers should get good training in typography (2006)
#84I admire all the work the typographers do to make amazing-looking websites, and yet I prefer to read sites (like mathpages, or Dan Luu's site) which have next to no styling. They're just easier for me to read. I'm definitely not hating, but I feel like it's good to keep in mind where the point of diminishing returns is.
> next to no styling
Remember that "no styling" is just the default CSS styling for typography, which somebody painstakingly created so that it sort of works. Pretty much all you need to do to make perfectly readable text on the web is make the column narrower. You can certainly improve it, make it more beautiful and readable, but it's acceptable as is. The real problems arise when people override those default styles with worse ones. So, we can either force people to use their browser's proprietary typography—which is not the spirit of the web—or teach 'em to do it better, which should really take about an hour.
Re: Web designers should get good training in typography (2006)
#85I admire all the work the typographers do to make amazing-looking websites, and yet I prefer to read sites (like mathpages, or Dan Luu's site) which have next to no styling. They're just easier for me to read. I'm definitely not hating, but I feel like it's good to keep in mind where the point of diminishing returns is.
> next to no styling MathPages (which I just looked up) has styling, but its styling is the _browser default_. And that default has mostly not changed for a quarter century. It is simple, and familiar, though I think a few tweaks like bigger margins against the window edges would make it more readable. One example: https://gist.github.com/JoeyBurzynski/617fb6201335779f8424ad... May I spruik my own site? I have a very…
What is an example of a page with no styling, then, if not one that uses the defaults? :)
Re: Web designers should get good training in typography (2006)
#86Earlier quoted context omitted.
what percentage of users would you estimate are interested in choosing or writing a user style sheet?
A surprising amount, actually. Mobile phones rezoom and reflow text and content automatically, and if you click reader mode, take over presentation entirely. I don't agree with the idea that all CSS should be banned, but the pixel-perfect designs, that seem to come from Photoshop, are definitely annoying because they have rarely been tested on anything but what the designer had lying around. Have a device with a diff…
Except that the mobile browser does all that reflowing and resizing at the direction of CSS (its own fallback CSS in the absence of supplied applicable CSS).
Restricting CSS to any degree is in no way a solution here. What you really want is for people producing websites to bother understanding CSS and how to properly direct the design in a device-independent manner. Because CSS is fully capable of doing so at this point.
Re: Web designers should get good training in typography (2006)
#87Typography should be left to the user agent and user style sheet. Attempts to make sites "pixel perfect" is the worst habit from the print-world that designers brought online with them.
The second sentence is true.
The first sentence is completely unsupported.
Re: Web designers should get good training in typography (2006)
#88Earlier quoted context omitted.
> next to no styling MathPages (which I just looked up) has styling, but its styling is the _browser default_. And that default has mostly not changed for a quarter century. It is simple, and familiar, though I think a few tweaks like bigger margins against the window edges would make it more readable. One example: https://gist.github.com/JoeyBurzynski/617fb6201335779f8424ad... May I spruik my own site? I have a very…
What is an example of a page with no styling, then, if not one that uses the defaults? :)
I get your point: there are no CSS stylesheets or style elements on MathPages at all. Thus, no styles...
The thing is, there are no pages that use no styling! Defaults are styling: they are just choices the browser manufacturer made. Resetting those has its own cottage CSS industry: https://meyerweb.com/eric/tools/css/reset/
I used to view default browser styles as not really styles. Then recently I started trying to use old HTML elements, like 'align', as a way to see if they behaved differently (solved problems with) CSS styling. It turned out that in Safari, Chrome and Firefox, the attributes behaved the same as setting CSS styles -- which makes sense from an underlying architecture point of view (why have two ways to set, say, left alignment?) but shows that the engines are CSS-based, that there is no such thing as not using styles, even using non-CSS, old-fashioned pre-CSS HTML.
Re: Web designers should get good training in typography (2006)
#89This site, and many other typography-adjacent sites, have comically large text on my desktop computer. What's up with that? (Maybe I've just misconfigured my browser.)
He explained this once, but it's been years and years and I don't have a source link. His argument for using the large fonts hinges on the fact that you keep your desktop monitor farther from your eyes than you do printed materials like books and magazines. Accounting for these distances, a 16-pixel or 18-pixel font size on screen is similar to an 11-point or 12-point font on printed material. Somewhere on his site,…
This argument is unsound: CSS already takes that into account. All of the units (px, pt, mm, in, &c.) are, for screens, defined in terms of a reference pixel, which is the visual angle of one pixel on a device with a device pixel density of 96dpi and a distance from the reader of an arm’s length. https://www.w3.org/TR/css-values-4/#absolute-lengths has some more explanation and diagrams that demonstrate what’s going on.
No, the reason why it’s customary to boost the font-size a little on larger screens is because otherwise things start to look silly because you’re using such a tiny part of the space available to you, and you have a larger viewport, so you can increase the size a bit without losing too much from the screen at any time. But if you take it too far, it starts to look silly for different reasons, because it’s unreasonably large (and more importantly, inconsistent with common practice).
(Also: 16px = 12pt.)
Re: Web designers should get good training in typography (2006)
#90This site, and many other typography-adjacent sites, have comically large text on my desktop computer. What's up with that? (Maybe I've just misconfigured my browser.)
The cause is you got used to comically small text. That site is fine readable size (unlike the interface we are exchanging opinions on). Though it is still readable on 80% zoom, slightly eye straining on 70%, but it is far from oversized.
I consider the reasonable range of body text font-sizes to be 16–20px, but I recommend 16–18px. (On small screens, you should exclusively use 16px; the larger values are for larger screens where it can be warranted and I would almost always recommend it.) This is what just about everything is calibrated against, so you cause trouble by going much out of this range.
HN uses 12px. At 25% below the range, this is significantly undersized, and 120% scaling is about the minimum I can tolerate (though I don’t find myself going up to 133% for some reason, which I might have thought I would do, but I decided I didn’t like it).
The site in question uses 25.3px. At 26.5% above my proposed range (and 40% above my recommendation), this is significantly oversized.
If your eyes are straining at 70%, which reduces it to 17.71px, something’s wrong, probably in your setup—because that’s generally still at least 10% larger than all the rest of the text in your OS! (Linux/Sway: Firefox UI seems to be largely 14.667px with a little 15.4px, and this 14.667px seems visually to match other apps.)
No, creata is correct. This site’s text is very unreasonably and troublesomely large, and even shrinking it to 80% leaves it very mildly oversized.
(The lead paragraph is 32.2px, which does reach the point I would happily describe as comically large. The quote a couple later is 21.85px.)