4 ms·
I disagree with much of these stacks. I would scrap at least Avenir Next, Avenir, Helvetica Neue, Helvetica, Ubuntu, Roboto, Noto, Arial, Apple Garamond, Times
by chrismorgan 4y ago
I disagree with much of these stacks. I would scrap at least Avenir Next, Avenir, Helvetica Neue, Helvetica, Ubuntu, Roboto, Noto, Arial, Apple Garamond, Times New Roman, Droid Serif, Times, Source Serif Pro, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Monaco, Liberation Mono and Lucida Console, and probably a couple more, for one of three reasons: that the family is superfluous, for an obsolete platform, or inferior.
—⁂—
But as a consumer of the web, I personally don’t actually need to worry about these things any more, because I have my browser set to use my chosen sans-serif, serif and monospace faces (Equity, Concourse, Triplicate), and you can too! ① Use Firefox. Other browsers may have something similar; dunno; but Firefox is good anyway. ② Settings (about:preferences) → Fonts → Advanced → untick “Allow pages to choose their own fonts, instead of your selections above”.
I started doing this a few months back as a week-long experiment, and found it so significantly improved the web that I’m not going back. (It did feel a little strange for a few days, as Concourse is a somewhat narrower sans-serif than the likes of Arial, but that’s about the specific fonts that I chose. Now it’s just perfectly natural.)
I have experienced a very few icon-font related breakages, about which I wrote yesterday at https://news.ycombinator.com/item?id=31540234 https://news.ycombinator.com/item?id=31540234, but it’s surprisingly few given how popular the technique was for a few years. I also get a fair bit of bonus unintended serif from people that have neglected to add a generic font family fallback, or misspelled it (e.g. sans or "sans-serif" (quoted) instead of sans-serif), so that it falls back to the global default, which I have left as a serif.
- ayushnix 4y ago> ① Use Firefox. Other browsers may have something similar; dunno; but Firefox is good anyway. ② Settings (about:preferences) → Fonts → Advanced → untick “Allow pages to choose their own fonts, instead of your selections above”. I've been doing this for several years now and I love that Firefox can do this and Chromium can't. However, as you've mentioned, icons break on several websites including DuckDuckGo and rust mdbook (the search icon is replaced as "fl"). In addition, several websites assume that their monospace web font will always load and when it doesn't, code blocks are displayed in sans-serif fonts which is a huge turn off. I guess both of these issues happen because people assume everyone's using Chromium web browsers?
- ciupicri 4y agoPerhaps you can fix the broken websites with userContent.css [1][2][3] [1]: https://kb.mozillazine.org/UserContent.css https://kb.mozillazine.org/UserContent.css [2]: https://superuser.com/q/318912 https://superuser.com/q/318912 [3]: https://www.userchrome.org/how-create-userchrome-css.html https://www.userchrome.org/how-create-userchrome-css.html
- chrismorgan 4y agouserContent.css is frightfully inconvenient, since you have to restart the browser for it to take effect. I recommend (and use) the extension Stylus instead, which uses an inferior technique (the injected styles aren’t prioritised correctly as user styles), but can be tweaked more easily and as you go.
- firexcy 4y agoI usually test my preferences with Stylus, and once I found a combination I'm comfortable with, it gets perpetuated in the userContent.css for the technical reason you mentioned.
- chrismorgan 4y agoNah, it’s nothing to do with Chromium. These things can break in any environment, and you can deliberately break these things in any browser, even if Chromium may not have first-class support for the concept; in uBlock Origin, for example, the rule “no-remote-fonts: * true” (or the filter “$font”) kills web fonts, and, well, I guess you can uninstall all your local fonts or something. Icon fonts are pretty much an obsolete technique: they were the pragmatic choice for a few years when SVG support was insufficient (most notably for old versions of IE), but they were known* to have accessibility problems, and so now that SVG support is adequate, the icon font technique should be replaced in all cases. For font-family declarations lacking an appropriate generic fallback family, that’s simple developer error because they don’t know how things are supposed to be done, and that all other families are unreliable—it’s not just people that deliberately disable them like us, but also that not all systems will have a font of a given name, and that web fonts may fail to load because networks are unreliable.