Hacker Newsnew | past | comments | ask | show | jobs | submitlogin
Substitute Web Fonts with StopTheMadness (underpassapp.com)
31 points by alsetmusic on Nov 6, 2022 | hide | past | favorite | 51 comments


Substituting Arial by Helvetica is the ultimate expression of pointless counterproductive font snobbery.

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 ;)


Consider me cued. Not queued, that's something else.

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.


Sure, I'll bite.

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.


I've always disliked Arial. Thanks Microsoft/Monotype for making everything ugly and illegible.

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.


Gruber’s deeper point is that Apple is so particular about design and design standards. Apple has their own typeface. So having this slip through is, jokingly, a fire-able offense.

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.


As I'm forced to use an Apple computer for work from time to time (fortunately rarely), I do not understand how anyone can claim for Apple to have any standards. Especially when it comes to "design". Fonts look blurry and washed out everywhere. I don't care about the usual excuses, it is ugly ugly ugly...


This comment would be more useful if you recommended such a font.


One part of "not boring" is picking one that fits your taste and the style of the site you are using it on. So there cannot be one canonical recommendation.

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.


Use them sure, but don't use Google's CDN and leak your user's data to Google's servers. It's not difficult to self-host the WOFF2 fonts.


The advantage of using Arial/Arimo on web pages is that it is the only font which is installed on pretty much every single desktop computer or mobile phone. If someone wants a font stack which acts the same everywhere without the overhead of downloading a font, Arial is the only choice (While Android phones do have Tinos, it doesn’t have the same metrics as Times New Roman; go figure). Windows users have had it since the 1990s, Apple has licensed all of Microsoft’s core web fonts, and Linux/Android users have the Arimo font with the same metrics — and it’s a single apt-get command to legally install the actual Microsoft Core Web fonts, including Arial, on desktop Linux.

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.


Unless you need Arial's specific font characteristics in your stack, please just fall back to sans-serif. I hate these 'system font stacks' that don't fallback to my system because some schmuck thought it would be a good idea to put Ubuntu and Arial in these stacks instead of actually falling back to to the user agent or OS.


Android phones do not have Arial nor Arimo. I tested a simple page with "font-family: Arial, Arimo, serif" and got a serif font.

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.


Android phones do not have Arial nor Arimo. I tested a simple page with "font-family: Arial, Arimo, serif" and got a serif font.

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.


I re-tested with Chrome, and got Roboto, which is clearly not Arial nor Arimo and is not metric-compatible. And it was triggered by the name Arial.


I have reproduced your results. It looks like Android made the move to using Arimo for Arial to using Roboto fairly recently; the Arial trick worked with my older 2017/2018 Android smart phone. Unfortunate too; there is no longer any universal font stack which preserves metrics. The only option now to preserve metrics is to have users download a fairly large .woff/.woff2 font.

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.


> Substituting Arial with Helvetica might break how things look in a web page which assumes Arial metrics.

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.


>Arial is designed with the same metrics as Helvetica

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.


I think Arial was designed in the 1980's to match Linotype Helvetica (which Apple licensed).

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!


As per the discussion, it looks like Android has moved from using Arimo for “Arial” to using Roboto for “Arial”, which has different metrics. Point being, here in 2022, if one wants a font to preserve metrics across platforms, one needs to provide the fonts as relatively large .woff/.woff2 files. There is no longer a universal font stack out there.


> What you may not know about Gruber, though, is that as much as he despises Arial, he dislikes Courier New even more! If Arial demands firing, then I suppose that Courier New demands… the firing squad?

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.


I thought the article was making fun of Gruber for having such strong feelings against those two fonts.

Or is that the poisonous part?


> I thought the article was making fun of Gruber for having such strong feelings against those two fonts.

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.


> The glee with which the authors express this sentiment

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.


What’s wrong with having an opinion? They did not harass anyone or force their tastes on anybody. Quite the contrary, that’s a hack so that Gruber can be happier on the same web as everyone else. I see snobbery and (a heap of) sarcasm, but not gatekeeping here.

Yeah, it’s not a masterpiece. That’s fine, people are allowed to have fun and not everything needs to be perfect.


Snobbery exists everywhere from coffee aficionados to mechanical keyboard folk. I don’t see it in a way that you do, just people that are into it and they express their distaste or taste for things.

It’s not coercion, it’s fair game.


> Snobbery exists everywhere from coffee aficionados to mechanical keyboard folk.

Thankfully there's no font snobbery here, and we've all universally agreed that Courier New is the best coding/console font.


> we've all universally agreed that Courier New is the best coding/console font

Wait, have we?


Sorry, I thought the sarcasm was clearer! Many software engineers are very passionate (to the point of evangelism) about their favorite coding/console font, whether ligatures in code are the work of the devil, etc., which makes the outrage over Gruber's opinion kind of funny to me.


They revel in it, and Gruber at least isn't just some kid anymore. He's old enough to have learned better.


Curious, isn’t pointing out individuals like this and call-out culture ironically the same thing?


"Arial should be a firing offence"

Grant me the comfortable self-righteousness of people who don't realise their personal aesthetic preferences are not objective statements of fact.


> "Arial should be a firing offence"

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.


There are worlds where typography matters.

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.


The reputational "damage" would be limited to a small set of obnoxious font snobs whose opinions should not be considered at all, in that catering to their perceptions helps nobody in any useful manner.


Sometimes those people are customers, and they matter a lot.

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.


I am amazed at how many people do not recognise over-the-top sarcasm when it hits them in the face. No, he is not advocating for people to be shot, that’s ridiculous. It’s a figure of speech, that’s all.


Related:

StopTheMadness – Take back your web browser - https://news.ycombinator.com/item?id=31625804 - June 2022 (50 comments)


Font nerdery is a bit like the old "Northern Conservative Baptist Great Lakes Region Council of 1912", you can be angry about very minor details. Doesn't even stop at the font, as I'm sure there are people saying that only Stempel Helvetica is the true Helvetica etc. (Approaching a bunch of old-school typophiles and screaming "Garamond!" is a true Rex-Kramer-Danger-Seeker-esque act)

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


Serious question: what is so important about fonts?

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?


> Serious question: what is so important about fonts?

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.


> 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.


Typography is a core dimension of a design's "voice", and so people who care about that tend to care a lot about typography

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 believe that the point of the suggestion of replacing a console or programming font with Arial or Helvetica, in order to become aware of their unsuitability for such a task, was not that they are variable-width typefaces, but that they belong to the group of sans-serif fonts that have exaggerated with the simplification of the characters, so that they have many different characters that cannot be distinguished, creating ambiguities that are intolerable in programming or in console windows.


Interesting point.

I checked, my emacs is using Sans Mono but despite its name it has serifs.


> Is there data to show that fonts improve anything objectively?

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.


But… COMIC SANS!


I hope you don't read any OpenBSD slides... ;)


> don't consider them nearly interesting enough to load them from some remote server.

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.


Tbh, I hate most of these fonts (especially thin ones) and acid, blurry, pastel, dark, bright, washed, monochrome, contrast colors. I wish there was an accessibility standard for sighted fullcolor people so I could use everything without constant irritation.

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.


You can disable this behaviour.

It's a reasonable choice, but there are pros (privacy, efficiency) and cons (layout mostly) to doing so.


I overwrite all fonts with the system default. It is glorious, uniform reading experience.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: