Substitute Web Fonts with StopTheMadness
underpassapp.com
underpassapp.com
If you really want to do the world some good, substitute by something that
a) isn't boring and overused
b) isn't almost indistinguishable from what you're substituting
c) isn't non-free with onerous licensing terms especially when used in the web
d) isn't worse and unoptimized for screen, non-print purposes
Now queue the font snobs' complaints ;)
Google fonts is full of usable stuff. Just have the courage to pick something that isn't mainstream yawn-inducing boredom. The other points are almost automatically satisified. For GDPR reasons, copy the font file to your webserver (caching won't work anyways in modern browsers).
But if you really really want something safe, easy, no-thinking-required that works for almost everything, on most devices, is readable on screens, looks modern but sufficiently boring and inoffensive, has big unicode coverage: use Roboto.
I just dislike looking at the weak copy of Helvetica that Microsoft calls Arial, so I will replace it with some neo-grotesque that is close to the designer's intent. Helvetica is an easy choice.
(Note that Arial itself was intended as a replacement for Helvetica when Helvetica is not available. Now that design in Arial is more common, it hardly feels wrong to replace Arial with the original -- and more-pleasing -- Helvetica. Personal preference yes, but what higher motivation is there?)
Don't get me started on Verdana.
But they did a pretty good job with Tahoma at least.
a, b: The point is to correct what amounts to a a slight, unsightly, visual error. What you are suggesting is repainting the room in a new color, because there was a spot missed when applying the first layer of paint.
c: I already have a license for that font and I am not forcing it on anyone else. This is like saying "Don't boot your mac into MacOS - it's non-free!" I know, I paid for it.
d: I have a retina display. My pixel density is big enough that I don't need to bend the font to fit into the grid.
It’s actually not about font snobbery, but about mocking Apple about their design standards.
It’s a joke, not sure why people are taking it so seriously.
But my vote for the print (and PDF) typeface that has I would be very happy to never see again (at least in anything that isn't a mathematical formula) goes to Knuth/TeX's abominable Computer Modern.
Using Helvetica in a font stack with Linux has issues because many desktop distributions use the Ghostscript Helvetica equivalent font which has vertical alignment issues. Other fonts are often times substituted with different fonts which both change the look and metrics of a web page.
The reason why compatible metrics is important is that elements using lettering have the exact same size on a web page, so there aren’t issues with a font overflowing or otherwise looking wrong when it looks fine with Arial. Substituting Arial with Helvetica might break how things look in a web page which assumes Arial metrics.
Personally, I wish every computer out there (or at least every browser in widespread use) came with Noto Sans, Noto Serif, and Noto Sans Mono so that something like “font face: Noto Serif” would look and act the same way everywhere, but Arial is as close as we get to that.
Arial is designed with the same metrics as Helvetica because Arial is a copy of Helvetica.
Replacing Arial with Helvetica is just restoring things to the original-not-encumbered-by-licensing-decisions standard.
Some people may prefer Arial due to familiarity etc (a distaste for quirky capital Rs?). Some people may not care. But Helvetica is the original.
Mostly true, as per https://wiki.archlinux.org/title/Metric-compatible_fonts but Arimo is designed to have the exact same metrics as Arial, which is important for situations where one is testing a web page/app and can only avoid testing a different font if it’s guaranteed to act in the very same manner. I don’t think Apple guarantees that their Helvetica is compatible with Arial to that degree. Using Helvetica in a font stack on a web page[1] isn’t practical unless one discards that 1-2% of Linux desktop users out there, since they will often get Nimbus Sans which has a different vertical alignment.
In terms of the power users with custom CSS which replaces all instances of Arial with Apple’s Helvetica, they are probably clued enough to understand it might screw up the alignment of an element tied to a font’s exact metrics on a web page. I agree it’s unlikely, but I also remember when clients insisted on “pixel perfect” HTML/CSS renderings of their Photoshop-generated layout template.
[1] If they have a Helvetica implementation as a .woff/.woff2 web font, this doesn’t apply. I’m assuming that this is a web page which doesn’t have any downloaded fonts.
Pixel perfect is tough, but a quick lookaround suggests that the two fonts should match glyph widths at least. There are other metrics to consider though, for sure!
Second, you are overstating the importance of metric compatibility on the Web. Web pages aren’t built with pixel-perfect character placement (unlike PDFs or some GUI frameworks) - text is flowed by the browser, and the web developer cannot specify nor depend on the precise appearance of it, as the appearance of text may differ depending on the browser engine, underlying OS, system scaling, user zoom, accessibility settings etc.
"Hello" in 10px Arial takes up 29x10 px on a Windows 11 PC (in Paint), but it might take up a little more or little less 32 px on Linux, or macOS, a different Windows program, or a 150% scale display, due to antialiasing/hinting/rendering technique differences. On a webpage, you wouldn’t make a button containing the word "Hello" precisely 29x10 px — the button would have more breathing space anyway, or it might just have a margin/padding instead of width/height set, and the layout will work even with tiny rendering differences.
Also, while a handful of very-badly-designed pages may break if you replace Arial with Helvetica for aesthetic reasons, the bigger crime they simultaneously commit is that they won’t work if you replace Arial with OpenDyslexic for accessibility reasons.
That’s may be true for Firefox on Android, which has, as per caniuse.com, a 0.28% global usage share. Chrome for Android, which has a 40.28% usage share (well over 100 times the users as Firefox/Android) shows things without serif.
There’s also a number of uniwidth typefaces which do not get wider in their bold form, for GUI elements which need to stay the same size (a use case which we should not completely dismiss as bad design), but those need to be downloaded as .woff/.woff2 fonts.
Large is relative; the 116,472 bytes my font stack needs has five fonts: Roman, bold, italic, sans serif bold, and sans serif bold small caps. Mind you, this only supports English and Spanish, but it does have smart quotes, an em dash, and other typographic characters: “”‘’— etc.
Then again, 116,472 bytes is a drop in the bucket in an era when people by and large consume video content online.
The glee with which the authors express this sentiment is a strange glimpse into a poisonous part of the web that I'm glad I don't frequent. Instead of being helpful, they emphasize gatekeeping and snobbery. This and the original linked, ate not a good quality post.
Or is that the poisonous part?
I wasn't making fun of Gruber, I was just exaggerating for comedic effect. Gruber himself seemed to like the post. I guess some people didn't find it funny, which is fine, but the OP seems to have gone overboard.
It’s not coercion, it’s fair game.
Thankfully there's no font snobbery here, and we've all universally agreed that Courier New is the best coding/console font.
Wait, have we?
Yeah, it’s not a masterpiece. That’s fine, people are allowed to have fun and not everything needs to be perfect.
Author here. It was a joke. I personally don't even notice fonts that much. I had no thought at all of a font substitution feature until Gruber requested it.
Please chill out.
> a poisonous part of the web that I'm glad I don't frequent.
Blogs?
> Instead of being helpful, they emphasize gatekeeping and snobbery.
How was it not helpful? I explained how people could substitute fonts on the web if they want.
This is a classic example of what the HN guidelines tell you not to do: "Please don't pick the most provocative thing in an article or post to complain about in the thread. Find something interesting to respond to instead." It was mostly a technical article explaining how to use @font-face rules.
Grant me the comfortable self-righteousness of people who don't realise their personal aesthetic preferences are not objective statements of fact.
The web really isn't one of them. But they exist. In those worlds, Arial would be the equivalent of bringing the wrong tools to the job, in front of clients. No one is going to get hurt, but there is reputational damage to consider.
With that said, of course in 99% of applications "firing offense" is a joke of overstated self-importance. And "firing squad" is the same, 110% of the time. Obviously.
They're also not wrong. The aesthetic of a typeface is a complicated thing. You have history and precedent to consider, for example.
There are objectively incorrect choices, sometimes.
The irony here is that Arial has always been the substitute because the real thing wasn't available. (i.e. Microsoft didn't want to pay to license Helvetica, whereas Apple did).
So the reaction you're having to the idea of someone substituting the original for the replacement is a bit odd, I think. Maybe you're reacting to the idea of caring. You don't have to care what others care about.
For people who are only reading these comments and not the article, this is not a quote by the developer of StopTheMadness.
This quote is by John Gruber of Daring Fireball, who is required by internet law to take strong positions on literally everything regardless of its relative importance. It should not deter macOS users from checking out the excellent StopTheMadness.
EDIT: To whoever's downvoting, I like John Gruber. He has a sense of humor and would laugh at this characterization.
StopTheMadness – Take back your web browser - https://news.ycombinator.com/item?id=31625804 - June 2022 (50 comments)
Having said that, there are plenty of sites that could do with a better font choice, and if you still want to leave most designers their creative freedom (i.e. don't turn off site fonts), this looks like a decent way to add that minor
I don't consider them nearly interesting enough to load them from some remote server.
Is there data to show that fonts improve anything objectively?
Many, or even most, websites already do this by using custom fonts.
Typography is valuable in the sense that the color palette used on a website is also valuable.
It's a reasonable choice, but there are pros (privacy, efficiency) and cons (layout mostly) to doing so.
Design and typography are two top things for that syndrome where most unimportant details get maximal attention. For me sites with “cool design” usually correlate with “I read it thoroughly and still have no fucking idea what it is about, ctrl-w”. Maybe you should have prioritized texts over fonts.
Of course there are. The primary motivation is aesthetics though. This is of course part of "anything", but it's a bit subjective.
Fonts (typefaces) make people so upset. You care, or you care not. Having strong opinions about what other people care about is a path to madness.
My shortest serious answer: If you're asking, the answer for you is "mostly nothing".
A slightly longer serious answer: Typography is a core dimension of a design's "voice", and so people who care about that tend to care a lot about typography. Examples to help visualize this: https://www.fastsigns.com/blog/miscellaneous-trending/colors...
A less-serious answer: Change your coding/console font to Ariel for a week.
Actually I think that's the perfect answer!
Someone will say "but that's different.". But it is not.
So it matters only to designers’ tastes. Reminds physiognomy, when ears and nose can tell you a life story. People mostly don’t care about your voice notes or ear tips, unless it is the whole point of your performance or they are retarded.
Change your coding/console font to Ariel for a week
Variable width jokes aside, let’s compare our coding fonts and try to explain why one of that many should be considered the “main” one.
I checked, my emacs is using Sans Mono but despite its name it has serifs.