Hacker News new | past | comments | ask | show | jobs | submit login
Twitter's new font, Chirp, is apparently giving some users headaches (cnet.com)
225 points by dmitryminkovsky on Aug 12, 2021 | hide | past | favorite | 252 comments



I was really pleased when Stack Overflow switched to system fonts [0] and hoped this would be a trend. With system fonts there is less cognitive load going from app to app. The font stays out of your way and serves its purpose best: presenting textual information.

Here we have the opposite: Twitter decided that tweet bodies should perform a marketing function. They sacrificed utility for brand cohesiveness. I understand the motivation, but there's a middle ground that serves both purposes: use your own custom font for the UI and use a system font for user-generated content. Gmail does this: the UI is Roboto, while the default font is "Arial, Helvetica".

I'm sure I'll get used to it, but eh.

[0] https://news.ycombinator.com/item?id=27063991


The 'brand' needs to differentiate, though. And if Facebook's empire does it, so must Twitter.

It seems like when you're VC-backed and get to a certain size, one of the items on the checklist is "design custom font that looks like every other VC-backed platform's custom font, but is slightly different."

Didn't Dropbox also make their own font?


You are correct. They did make their own font. Which seemed like a very strange expense to me. Even though I use Dropbox heavily, I'll almost never see their font. Dropbox is used mostly through the OS's file manager.


Middle management becomes a bit of a circle jerk in large companies. They have to find reasons to justify their existence so you get branding initiatives like this to pump up the annual reviews.


Firefox's "Don't allow websites to use custom fonts" option makes the Web feel much more cohesive and polished.


I will plug my Firefox addon here which builds on this Firefox’s feature. Basically the add-on remembers the websites for which the user wants to enforce/unenforce browser fonts.

https://addons.mozilla.org/en-US/firefox/addon/enforce-brows...


I used to have an addon like that, that died in the WebExtensions apocalypse. It's great to have a replacement!


What does that do for fontawesome-style fonts (icons in the private area) that websites love to use instead of SVGs and text labels?

I personally block fonts via uBlock Origin, which lets me allow them for the subset of websites I visit regularly enough that I'm okay with allowing fontawesome-style fonts.


Firefox is smart enough to not block fonts that are used to render PUA characters.

It doesn't help with icon fonts based on ligatures instead of PUA characters (Google's Material Design framework seems to do this) but we can't have everything.


blocking remote fonts in uBlock Origin has zero effect on Twitter, just tried, unless you mean something else, in that case please enlighten me how to have back left column with same font as before


https://i.postimg.cc/5Nk9tczJ/sw-appy-20210813-193919.png

https://i.postimg.cc/Gm8L8MPy/sw-appy-20210813-193924.png

In case that website blocks hotlinking: https://postimg.cc/gallery/RVSBXh7

The first image shows https://twitter.com/newsycombinator with devtools on the right showing that the computed `font-family` for that one span has "TwitterChirp", and the uBO logger at the bottom showing that chirp-*.woff fonts were blocked by my uBO rules.

The second image is the Fonts tab of the dev tools showing that the font that the browser is using is Roboto, which I have available locally.

As for how I do it, see https://news.ycombinator.com/item?id=26284124 . If you don't want to go that far, you can still create a rule just for twitter.com that blocks just the chirp*.woff URLs.


would this help? (disclaimer: i wrote the addon)

https://news.ycombinator.com/item?id=28165179


As I said, I already do it with uBO. I don't need another addon.


    *:not([class*='icon' i]):not(i):not([style*='icon' i]):not([aria-hidden='true']):not([aria-label]):not([class*='fa-']) {
        font-family: "Operator Pro" !important;
    }


When it comes down to it I find it rare that a custom font sparks any joy in me. I love typography and I started my career in design, so I don’t think I’m some old man yelling at clouds here.

They often seem to be the result of inexperienced design or design by committee. An unnecessary and distracting effort at differentiation or branding. In the worst cases you might even see a FOUT or have to endure downloading 5mb of zillions of characters of some fonts your browser will never draw.

I know there are cases where it’s tasteful and well executed. I love that. It just isn’t common in my experience.

On my team at work we created a sort of pros and cons list and for our use case (instantdomainsearch.com) it made virtually no sense to incorporate a custom font into our design. When it was all laid out and considered it really drove home for me how unnecessary it is.

The designs looked really nice and it seemed compelling, but in real life on the internet I just want things to 1) load very quickly 2) draw and become interactive very quickly 3) look and feel familiar in the right ways such that I can I intuitively use the software. Custom fonts put a stick in the spokes of each of those points.


For me, it was the opposite with Stack Overflow. I use the Consolas font literally everywhere throughout my Windows machine. It's the default and most common monospace font on Windows, and I'm used to reading code like that. Yet Stack Overflow started using Cascadia Code instead, which I'm not used to, and it feels like all the code there is bold, and some letters have strange proportions.

Maybe website owners could just use "monospace" in CSS and let users configure the browsers as they wish. But I guess it's too late for that now as users aren't used to do this.


Design team needs to earn their keep.


The ‘custom’ font has been identified¹ as Grilli Type GT America² with minor spacing change and a Twitter logo in the PUA.

¹ https://twitter.com/jeffjose/status/1425626162219286529

² https://www.grillitype.com/typeface/gt-america


Interestingly that means Twitter text is no longer fully portable. If you copy some text from Twitter, you specifically need Chirp to render it properly or else characters like their special logo character will be broken for all other fonts 

Because they're using the "Private Use Area" of the font improperly...

Maybe I'm paranoid but I'm feeling like this is an intentional decision in order to push other fonts/foundries to start adding the Twitter logo as a standard Unicode character. Basically bypassing the need for consensus by just forcing the matter and cementing their logo in typography standards.


This seems a little paranoid, yes. :) What text do you envision copying from Twitter that's going to specifically include their special logo character? It's not going to be in anybody's tweet text.

> Because they're using the "Private Use Area" of the font improperly...

Uh, isn't putting your own characters in Unicode's private use area specifically what that area is for? Isn't that where fonts that have dingbats unique to them, for instance, would put them?


Not likely perhaps, but could this be one way to retain more copyright over tweets in the future?

Most companies based on user generated content try to claim ownership over it by way of agreements. That has always been murky legal territory and it's not easy to know what value they have.

If the proper rendering of content was made dependent on proprietary fonts, that could be one way to exercise control over where that content can be used.

It's not impossible that making users pick proprietary emoticons could have economic value. Remember where you heard it first...


Have you ever seen nerd fonts? This is not a new idea at all:

* https://www.nerdfonts.com/

* https://fontawesome.com/

I don't think this will push fonts/foundaries to add the twitter logo any more than I feel pushed to use the twitter logo in handwriting. Fonts are very nice in that the user still enjoys a high level of choice in the matter. Heck, even the twitter nonsense could be fixed with a stylus/tampermoney script of one or two lines.


So, the same as literally every other font that uses PUA (which is the majority of icon fonts).


To complement srfvtgb's point, even official unicode characters are not guaranteed to be included in all fonts. Having the glyph disappear on other platforms will probably be accepted as a fact of life, especially as it's a corporate logo.


Apple has been doing this for a while and it hasn't had much effect outside devices which run their software: 


Not a lawyer, but if the Unicode Consortium even tried to add their logo to the specification, wouldn't Twitter have to actively sue to stop them or risk having their trademark genericized?

Gut check: are there currently any trademarked symbols in Unicode? I can't think of any offhand, and it I find it difficult to imagine it happening for precisely that reason.


The well-known laundry symbols are trademarked apparently, and while there is a proposal to include them into Unicode, this might in fact be blocking it…

These are trademarked for other reasons than a company logo though, and I don't really see the point in including company logos (which might change or disappear tomorrow if they go bankrupt or are taken over by another company—and then what with the company logo in Unicode?).


It looks like they've put a picture of an apple in the Private Use Area as well at U+F8FF. Weird; there's no need for the PUA there; just pick (heh) U+1F34E (red apple) or U+1F34F (green apple).


It's for compatibility with the Apple logo that is displayed on iOS devices when that codepoint is rendered.


I enjoy the pettiness of not using apple’s actual logo.


That’s a holdover from MacRoman.[1] If you’re on a Macintosh, Option Shift K at least on the standard US layout. Still comes up in Apple docs and user forums.

[1] http://www.alanwood.net/demos/macroman.html


Yes, welcome to Corporate Typograhism™ where big corp takes an already existing (copyrighted) font -- change it a little -- then release it as their own.

Some Copyright is more Copyright than others...


The implication that this is a practice being used to skirt copyright is wrong. In almost all cases the font foundry is commissioned by a company to produce a distinct (or not so distinct as the case may be) variant of a typeface/family, licensed to them for their use - as an alternative to having the foundry create an entirely new typeface from scratch.


The point I'm making is that you can simply modify an already existing font "just enough" for it to be considered a new work.

This is essentially what happened with Arial w/ Helvetica; and companies have been doing this ever since to create new licenses that they can control.

We are drowning in Grotesk/Sans-Serif/Helvetica type fonts! Do we really need another "Big Tech Sans"? Or rather, why can't Twitter just use X? xD


At least there is no copyright on the alphabet.


Yet.


Ironically making it not even that unique amongst "social networks", since Depop adopted GT America as their brand typeface back in 2017. Whilst Depop is technically a shopping app, it's one with a heavy skew towards social networking functionality.

Though to be fair, Depop uses GT America Extended and Expanded, rather than Standard.


Ah, another serif-less, proportionally spaced font. Quite hard to notice the differences.


It's very similar to Roboto. Noticeable differences side by side, but very similar.


This looks very much as if the font renderer is aggressively hinting to the pixel grid vertically, but not horizontally. That’s a known trick for getting a decent compromise between crisp text (along the baselines and tops of letters) with subpixel horizontal kerning.

I doubt the Android renderer is really broken and no-one has noticed until now, so I’d guess the font either has bad hinting, or more likely it’s just being displayed at an awkward size and vertical positions are being rounded in an awkward way. You can see the slight deviations from the baseline in the iOS screenshots, it’s just much more subtle as it isn’t being hinted.

(Source: I contributed a little bit to font rendering in Urho3D, to fix some similar text aliasing glitches: https://github.com/urho3d/Urho3D/issues/1953)


> I doubt the Android renderer is really broken and no-one has noticed until now, so I’d guess the font either has bad hinting, or more likely it’s just being displayed at an awkward size and vertical positions are being rounded in an awkward way. You can see the slight deviations from the baseline in the iOS screenshots, it’s just much more subtle as it isn’t being hinted.

Having developed for Android off and on over the years, I would absolutely not rule out the possibility that there's been a really basic problem with font rendering, reported in 2008 and repeatedly closed as stale on each version release then re-opened, with the most recent "any progress?" post dated 3 weeks ago, that everyone's just been quietly working around.


Explanation and comparison between platforms: https://mobile.twitter.com/mcclure111/status/142590242262759...


https://mobile.twitter.com/mcclure111/status/142554526675777... is the tweet with a screen grab of the very fucked-up way it renders on Android, in case Twitter decides to hide that part of the thread for you like it does for me. It’s really astoundingly nasty-looking.


Thanks, that’s a great investigation!

So broken hinting it is. Embarrassing that they didn’t pick it up in testing.


Probably a case of a monoculture of designers and/or developers on Retina Displays and Apple's renderer getting the benefit of extra pixels per inch of the usual font sizes?

This seems really common with tech companies that the fonts they like for "crisp" and "light" look great on Retina Displays and no one thinks to check any other display or OS font renderer. I feel it's also why the designers at so many companies right now often accidentally favor (display) fonts with hints and weight tuned for headlines, high DPI printing, and/or large uses (banners) for places where body fonts with thicker weights and better hints for smaller font sizes on less pixel dense displays would be much better for everyone involved.

(Though some of that belief that it is such a widespread problem comes from my bias from ugly personal experience of getting designs handed to me from the only macOS users in an entire enterprise and having to point out their font choices were entirely inappropriate on anyone else's displays in the company, and being the only one to point it out and easily ignored because I wasn't a designer and what did I know.)


It may indeed be a problem with hinting. Certainly two o's render very differently on my screen. I first tried to show what I saw by doing a screen grab, but then realized that the image apparently looks different on my screen vs others.

Now I realize that for others to see it, a good zoomed photo with my phone will go a long way:

https://imgur.com/a/Wpw97He

Step back ten feet and you'll notice that the o In "Notice" looks roundish and the o in "Today" is squared off.

Screen grab that I used: https://imgur.com/a/0LcqKej


I just realized that this must not be the chirp font at all, based on looking at the g. This must be some fall-back font. oops. Still it looks terrible.


A tweet showing the actual difference as screenshot:

https://twitter.com/Tempo_Storm/status/1425549066377777156

Appears to be a standard-res Windows rendering. (Obviously a Retina Mac/iOS rendering will be totally different.)


Personally i wouldn't be able to tell they re different without a hint

Not sure what the fuss is about


Personally I wouldn’t be able to crisply render the font on a low-DPI screen without a hint


Apparently some font renderers are bugging out on this new font making some letters render in a way that looks misaligned, which is very taxing on the eyes.


Some fonts are only subtly different, but this doesn't strike me as one of them. Those lower case gs are about as different as the letter g can look.


The lowercase g is so bad. The lower loop seems to sit a bit higher than other lowercase letters bottom out and the serifs are odd...



I don't know if it's the quality of the screenshot, but the left image (old) looks way more blurry to me then the new one.


The screenshots are horrible quality, it's effectively a meaningless comparison. (And even if they weren't, comparing two fonts using Windows' font rendering is an exercise in pointlessness since the heavy hinting destroys small differences anyway.)


It's the screenshot. The left screenshot appears to have been resized so it's markedly more blurry than it should be.


Twitter is not letting me view these images in full without logging in. Is that new behavior from twitter?


Those images seem to have the same font (might be the resolution/compression) but I just went to twitter.com and I saw immediately the difference.

And I'm not even a big user, I visit like once a week for 10 min. I guess it's even more obvious for people who use it all day long.

I wouldn't say it's better or worst, it's probably just a matter to get used to it.


> Those images seem to have the same font (might be the resolution/compression)

Check the g, the size of the upper section of the B, the width of the o, the comma...

The fonts are completely different.


Not every thing on the Internet needs its own font.

(I say as the former head of a type foundry.)


I forget when this has been discussed before but a lot of major digital companies (Apple, Microsoft, Adobe, etc.) end up creating their own fonts for legitimate business reasons that are totally unrelated to design/usability. I can't seem to find the reference, but I think it had to do with licensing/commercial reasons.


A lot of font foundries switched from one-time lump-sum payments to pay-per-use, thinking they’d make a whole bunch of money from the scale of big digital companies, and not realizing this would just cause these companies to design their own fonts instead. Really short-sighted IMO.


From your description it looks to me like the foundry industry moved from one-time lump-sum for everyone, to one-time lump-sum (font designing cost) for some rich companies, and pay-per-use for everyone else.

Was it effectively a bad move ?


Adobe is kind of an outlier there since some of their earliest commercial products were fonts.


The number of fonts we have says more about the copyright industry than anything else.


Well, no wonder you are former head of a type foundry. Gotta push ya product harder :-P


I have stories. Believe you.. me.


I was just a bit of tongue in cheek. But who can refuse a good story if you wish to share :-)


Yeah but the gumshoe designers and marketing droids getting hired say they do!


Nope, but major brands benefit from their own typeface in numerous ways, so Twitter may need their own typeface.


How so?


Branding! And licensing costs, design, UI consistency, obvious reasons covered by Apple and Google when they updated their platforms to use them.


Primarily, any license fees your don't have to pay for billions of per-use occurrences is money saved. In Twitter's case: that's a lot of money.

But there's of course also the whole "Your honor, as the evidence makes plain, this content/communication is claimed to have originated on Twitter, but does not use our official typeface. We move to dismiss this case/be awarded damages based on the fact that we were not part of this particular incident", paired with "Your honor, as the evidence makes plain, this content uses our proprietary font, but did not originate at twitter. We move to dismiss this case because we were not involved/be awarded damages on the basis us defamation and will be filing a counter-suit for impersonation".


That or brand managers want branding.

Do you have real-world examples of the hypothetical you invented?


There was that incident a while back where a bunch of government leaks were outed as fake because they were printed with a (default MS Word) font that was not available or in use when the document was purportedly created


Then Pakistani Prime Minister Nawaz Sharif tried to cover up a scandal that was revealed in the Panama papers back in 2014. He forged a document purportedly from 2006 using Microsoft's not-yet-released font Calibri as an attempted cover story.

https://arstechnica.com/tech-policy/2017/07/not-for-the-firs...


I'm sure you know this, but for others: This is a cost-saving move.

It's always more economical for a company of Twitter's size to develop their own font because 1) Then they don't have to pay per-use licensing fees, which are huge at the billion user scale, and 2) a peculiarity of copyright law means that the actual shapes of the letters aren't actually protectable by copyright -- you can copy an existing font virtually 100%, tweak a thing or two, and legally call it your own.


I don't think this is accurate.

If they're just specifying a font (e.g. 'Helvetica') in their CSS, it's loaded from the users' machine and doesn't cost anything.

Otherwise every site on the internet would be paying fees for fonts.

I could be wrong. Please inform me if I am.


That's obviously true for system-provided fonts but fonts like Helvetica Neue aren't typically available on any platform by default and has to be loaded in...


They were using built in system fonts on each platform before.


I would very much like to return to this sunshine state of mind.


> a peculiarity of copyright law means that the actual shapes of the letters aren't actually protectable by copyright -- you can copy an existing font virtually 100%, tweak a thing or two, and legally call it your own.

IANAL but this is only true in some jurisdictions, primarily the US and Japan.

Also, I don’t think it’s quite that simple either. The actual type face may not be eligible for copyright, but the computer code describing the particular curves and hinting rules and etc. is. So I think you can’t just trivially copy a font and modify it and call it your own.


By “copy a font” they likely mean recreating it. If one is working from a printed specimen in the US, such activity is legal.


> a peculiarity of copyright law means that the actual shapes of the letters aren't actually protectable by copyright

Warning: offer not applicable in UK and most countries in EEA. They have the concept of protecting designs there. Japan excludes most designs of fonts because of its utilitarian use BUT if the font (technically typeface) is distinctive and used in a way that can be defended as an artistic choice, it's protected under copyright.


Why not try, though? First and foremost, I think it's a good thing that designers are getting work. I also think huge "for fun" webapps are in a particularly advantageous place when it comes to pushing the boundaries of design, mostly because they have people on hand who can do it and who probably want to do it. Next, it's really a low risk preposition.

Maybe Office 365 needs to be conservative with fonts. Twitter can push boundaries, though. I wish they'd push boundaries more, ala Bertone or Memphis Group, but I guess the risks are larger the more you push the boundaries.


> "Maybe Office 365 needs to be conservative with fonts. Twitter can push boundaries, though."

What's the difference between Office and Twitter here? Both are apps that should just get out of the way of the content.

Most software should just have native UI that follows the platform guidelines. Unfortunately software companies hire graphic designers who know nothing about interaction design, and generalist programmers who want to do one-size-fits-all UIs. And that's how you get unreadable fonts in slow Electron apps.


Why not try? Because the cognitive dissonance when people's eyes and brains run into a large variety web-based and app-based screen fonts. Web based font performance is still terrible. So.. because: the brain doesn't like it.

Different presentation fonts in web pages, desktops, etc. can start to have the experiential impact of (gui) skins, or non-standard dotfiles.

Please note the things I'm leaving out of this... print, books, static things, etc.


Twitter's chirp webfont is almost 100k. On optimized sites, that can easily be larger then all of the HTML/CSS combined.


But tens to even hundreds of times smaller than any single tweet that has an image in it, so not really a useful metric.


That attitude is why web pages have gotten so bloated.

https://twitter.com/Twitter is 1.6mb. (200k+ of fonts, 500k+ of JS)


And heaven forbid browser caches frequently used sites, which would make that complaint an equally meaningless metric.


Actually webbloatscore.com says 2,062 kB and 88 requests.


Would have liked some picture examples... This is like somebody typing out what a color looks like.


If you don't have twitter on your phone, you can go to twitter.com and the new font is active.


Yes but we want a comparison. I check Twitter election to election. There is no way for me remember the old font. Let alone compare it to this new one.


This is what user stylesheets were intended to solve. Too bad the majority browsers have gone down the path of attempting to remove all customisation.


I don't blame the browsers, really.

Look at the source code of Twitter or Facebook. It's intentionally obfuscated and mangled, probably in part to fuck with ad blockers.

I have a few user stylesheets (even a little custom Firefox extension to block one user's comments on a site I frequent), but the sites I'd really like to use them on largely don't make it possible to do so.

Look at a Facebook ad in your browser's web inspector, for example. The "Sponsored" tag is made up of 31 different randomly named span tags. https://imgur.com/a/AHZL8ko


> Look at a Facebook ad in your browser's web inspector, for example. The "Sponsored" tag is made up of 31 different randomly named span tags. https://imgur.com/a/AHZL8ko

Tangential, but I love the image of a frustrated PM at Facebook hearing the news that "hey, you still have to make this label readable to screenreaders," necessitating an `aria-label` with the plain-text content "Sponsored", which makes all their span-chopping junk completely irrelevant to adblocker rules that can now just look for that string as an anchor :)


* { font-family: 'Verdana, sans-serif !important' }


It took a while to setup, but fixing the problem in the font rendering layer has worked really well. Several years ago - after being annoyed by blurry/bad fonts, extremely bad hinting, and other font problems - I spent a few weeks investigating the way fonts are rendered and a few more weeks comparing many different fonts and various permutations of rendering/hinting methods. The result of all that work included a set of fontconfig files with long lists like this;

    <fontconfig>
      <alias>
        <family>Arial</family>
        <prefer><family>Ubuntu</family></prefer>
      </alias>
      <alias>
        <family>Helvetica</family>
        <prefer><family>Ubuntu</family></prefer>
      </alias>
      <!-- Many more aliases that -->
      <!-- force fonts to Ubuntu. -->
      <alias>
        <family>sans-serif</family>
        <prefer><family>Ubuntu</family></prefer>
      </alias>
    </fontconfig>
This way, my font overrides happen in any software that uses fontconfig (i.e. most X11 software that uses TrueType fonts).

    $ fc-match Helvetica
    Ubuntu-R.ttf: "Ubuntu" "Regular"
[1] https://en.wikipedia.org/wiki/Ubuntu_%28typeface%29


Sure, and I can do that, at least in Firefox.

https://superuser.com/questions/318912/how-can-i-override-th...


I assume any problem or slowness I have with a website on Safari in MacOS or iOS using a content blocker is due to the website wanting to track me or otherwise for advertisement purposes.


You don't need to use website font's. You can configure the browser to use your chosen fonts. It's a normal accessibility option on the browser config page.

The only problem is devs who use fonts for icons, which is as stupid as it sounds.

https://megous.com/dl/tmp/0199107a482b8f75.png

(It would be nice to also have minimum font weight setting, not just minimum size, because some designers just can't be helped and use <=200. Then most of the issues with typography on the web would be solved.)


I cannot even install fonts on Android.


User stylesheets are a relic of Web 1.0, when the web was a series of hyperlinked documents.

The transformation from web page to web application was not compatible with things like user stylesheets.


The business model where you need to stop your users from hiding ads was not compatible with things like user stylesheets. If CSS compilation didn't obfuscate class names and such, it'd be quite compatible.


Oh yeah I don’t mean there’s a technological reason it’s not possible, it’s just at odds with the new controlling faction of the web.

Time was the web was for everyone, and enthusiasts were the main stakeholders.

Now the web is just another marketplace run by corporations.


Yeah, most stylesheets nowadays look like they are generated by a compiler. Certainly not human-readable.


Tangentially related:

If you use Firefox’s feature that allows one to turn off website fonts, I wrote an addon which builds on this feature.

Firefox’s stock feature is all-or-nothing. The add-on remembers the websites for which the user wants to enforce/unenforce browser fonts.

https://addons.mozilla.org/en-US/firefox/addon/enforce-brows...


More tweet-based journalism. Isn't there a better article somewhere that actually shows the font?


As you said, it is tweet-based. About a font on Twitter. The Tweets in the article show the font.


I have no way of knowing if this was rolled out to 100% of users, or if they updated their embedded tweets to use the font.

But more importantly I just want to see a side-by-side comparison.


Not only that, but when they inevitably change the font again, it would be nice to be able to read a then-old article to see what the font looked like when it was announced.


Must depend on your device as the tweets are using Proxima Nova for me.

edit: although if I click into the tweets and view them on Twitter, it then uses Chirp.



I wonder how many lapsed twitter users started using again after reading this, BECAUSE of this.


To anyone saying "Users will complain about anything", I'm on a Windows desktop and this is honestly the most unpleasant reading experience I've had on any big website in recent memory.

There seems to be an issue with the OS antialiasing that is rendering characters slightly blurry to feel it's not focused, further straining my eyes.

Seems to have only been tested on Bay Area Apple devices.


I have the newest most expensive (well, not the most expensive, but close) M1 MacBook and it's the same.

It's weird how unpleasant it is. The new font seems rather nice, and I would not even notice it looks different, but... it really hurts to look at.


Agreed. You can't blame this on testing only on Macs, because it's bad on my Mac too.


It's bad on Mac, it's bad on Windows. What the hell did they use to develop and test this where it looked good?


looks fine to me on linux, surprisingly. though i doubt that the designers tested on a linux box with a tweaked fontconfig

edit: here's a comparison with helvetica https://i.imgur.com/BJlHQhf.gif


CSS is seeing this stack on FF for me: "TwitterChirp", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif

I'm getting Roboto on Linux which (a) looks great and (b) is very similar to the new font


Are you actually getting Chirp? Seems some Linux users are not. I'm on Chrome on Ubuntu 20 and I do get Chirp, and it looks quite bad IMO.


yup TwitterChirp is the computed font according to firefox


Has to be a BeBox.


I'm on a Mac, and I'm not getting any issues. Perhaps its machine or OS version dependent? Or browser dependent?


Looking good on iOS.


Looks good on my S10.


HN is reliably the worst reading experience I have on the internet, exclusively because of the lack of line-wrapping.


No, no no no, atleast the font is crisp and the contrast is good on HN.

The line wrapping I can quasi-forgive as this being a place for discussion rather than dumping <pre> code blocks.


I don't like the way they've made everything white but I think the font is fine and even makes the site look fresh.


i find the new font absolutely HORRIBLE on desktop. but it's quite pleasant on mobile (more specifically, on a galaxy s21).


O, no... the o's render square and then round and then square again on xubuntu/chrome... what's up!?!...

https://imgur.com/a/0LcqKej

Many things seem to change because people need to change things to rationalize their job title. Is that what's going on here?


The o's look bad, but wtf is up with the e's in that picture?


Funny, all the e's look about the same to me. Do you just not like the style? That's not my complaint about the o's. I'm complaining that some are square and some are round. Specifically the o In "Notice" looks roundish and the O in "Today" is squared off.


This screenshot looks perfectly normal on my computer, or maybe I just can't see the difference. All of the o's look the same to me. Anybody else...?


Look very closely at the o in "Notice" and the o in "Today"... I see that if I zoom in to the image it looks better than when I zoom out, so there is clearly some interaction going on with the video driver on my screen at 100% zoom that makes it more obvious for me. But the two o's are not the same, the o in Today is narrower, and ends up looking squared off on my screen, and the o in "Notice" looks rounder and more open.

Now I realize that for you to see it, a good zoomed photo with my phone will go a long way:

Here's where twitter's font goes oh-so wrong: https://imgur.com/a/Wpw97He


I think this is just horizontal antialiasing kicking in.

The o in “Notice” happens to start slightly to the left of a pixel boundary, so it has a narrow strip of very light pixels on its left side (pixels with maybe 10-20% coverage). That makes the boundary look fuzzier and rounder.

The o in “Today” is probably more or less flush with the pixel boundary, so its left side has dark-coloured pixels (80-90% coverage).

It’s likely also the case that it isn’t scaling the luminance to account for sRGB properly. If a pixel is say 20% covered by black-on-white text, you multiply 255 by 20% to give a linear brightness of 51; but for onscreen display this should be converted to sRGB, which is around 124 (gamma ~2.2). If you don’t correct the gamma, the left edge of that o is much darker than it should be, so it looks square rather than rounded off.

Opinions differ as to whether text should be gamma-corrected! If you don’t correct the gamma, it looks darker and sharper, which many people prefer. But it’s actually sharper because it’s more aliased, which exacerbates the kind of moire glitches you’re seeing.

I personally prefer text with no hinting and correct gamma, as I think macOS and iOS do it, but it does look much fuzzier on low-res screens that way so some people dislike it.


Same on my M1 and iPhone.


I like it. It is hard to read and easy to skip over, which is just about perfect for tweets.


The way marketing teams talk about asinine changes like this as if they are making deep, meaningful improvements to everyone's lives is just nauseating. It's a fucking font and no one was asking for it.

There are a million ways twitter UX could improve and this is almost the stupidest one I can think of.


If they would just spend time to fix the copy/paste bug instead, for example…


> Regardless of whether you’re pro or anti Helvetica, I think we can all agree that it’s not up for the job.

… we can?

(From https://twitter.com/DerritDeRouen/status/1354548649561186306)


Helvetica definitely was not designed with screens in mind—Apple replaced it with San Francisco for both a legibility and a brand cohesiveness purpose.

That said, this feels like a weird argument given that Twitter didn’t use Helvetica on any modern platform when it used system fonts. SF Pro, Segoe UI, and Roboto are all designed for screens unlike Helvetica.


Personally, I find Helvetica to be extremely sufficient for reading text on screen. Maybe it isn’t the best possible font, but I think their statement is kind of non-sensical, it makes it sound like it would’ve been a problem to use Helvetica… I doubt it.


There was one version of macOS where the system UI font was Helvetica and it was horrible.


It was Helvetica Neue, not regular Helvetica, in MacOS 10.10 Yosemite. In theory that variant had adjustments to make it more suitable for on screen use and I don’t recall it being particularly bad.


And iOS, no? I don’t recall that being a huge problem.


Yeah, that tweet was a definite WTF moment for me. Having to explain what cargo culting is to tech folks, is becoming more rare for me. Yet we continue to try to summon those gods.


I'm usually terrible at noticing typefaces (especially when developing to a design). But now this has been pointed out to me, I can't not see it. It's tricky to focus on and I can see why people are finding it troublesome...



An easy way to customize a websites appearance is to add a stylesheet via a bookmarklet. For example to set the font to Arial, this works:

javascript:document.body.insertAdjacentHTML('beforeend','<style>*{font-family: arial !important;}</style>')

Using "mono" instead of "arial" also makes for an interesting Twitter experience.


> All Western-language text now aligns left, making it easier to read as you scroll. Non-Western languages remain unchanged.

I'm sorry, this is a change HOW?


Simple flush to the left margin versus justified text, which was how Twitter aligns text.


Every UI change forces a cost on your users. It forces them to relearn the language of what your buttons mean (the Follow button semantics here are atrocious now, and give almost no affordances to users about what is going on).

Changes to UI reduce familiarity, and if they are fond of your product, that is usually a really bad thing. Having a good friend change personality is disturbing and unpleasant!

What is gained from these changes from Twitter, other than some employees are able to say they influenced the product? They may have tested with some users, but was the testing representative of reality? What risk was taken here for what amount of potential gain?


I wish this post was carved in stone in every consumer tech office. It is crazy to me how often companies produce negative value by redesigning their UI just for the sake of it. It's one thing if functionality has changed and you need to make a UI change to accomodate it, but reworking the UI for the exact same functionality is the equivalent of saying, "Our previous design was so bad we needed to burn a bunch of our and our customer's resources to recreate it. But trust us, this time we've got a good feeling about it".


I feel like Basecamp is the only company that gets this right. Want to radically redo your UI? Ship a new version and let your existing users continue to use the old version.


I routinely override web fonts in Firefox by deselecting "Allow pages to choose their own fonts, instead of your selections above". This would solve the desktop web interface. I use Verdana a lot for this purpose. Chromium browsers don't seem to have this override font option. Now you have found a new reason to love Firefox, you're welcome!

For mobile devices, you will have to use a third party app.

Sometimes, the corporately-chosen font is just empirically bad.


No screenshot of what new fonts look like, I don't have Twitter so cannot see it on twitter.com. It wants me to sign up.


View any random account. Here's one: https://twitter.com/twitter


I stared it for a good minute thinking maybe I wasn't being served the new font, but no, it's just so similar to Helvetica (Roman) that I have to deliberately look for the differences to tell. I compared Chirp and Helvetica side by side and the only significant differences in the characters themselves are in the upper case J, Q, and R, then lower case g and the numeral 2.

Am I missing something or is it just that I go to twitter so seldom that I assumed it was always Helvetica?

Edit: it seems it's not the font itself, but rather something going on with the rendering making it blurrier for some people than the previous typeface.


It shows Segoe UI for me


Twitter takes like full two minutes to load in recent years, is that normal?


There's something really strange that happened to me for over a year, and it's stopped. I can't remember what it was or why. I think using https://twitter.com (without the www), forcing https, and using Safari. Some combo of those things made the site almost never load properly. Try adding in a WWW or a different browser if you're interested.


is it actually objective qualities of the font that are giving people headaches, or is it just because it looks different from what the user expects, and twitter users are used to looking at twitter many times a day, so it throws their brain for a loop?


It seems to have broken hinting on some platforms. Not all users are seeing the same rendering. Here’s what the broken rendering looks like for some: https://twitter.com/_Soilleir_/status/1425542928970170376

Differently broken hinting on some versions of Android: https://twitter.com/mcclure111/status/1425545266757779463


Wow, that second link is really bad. I would find it enraging.


While it's hard to prove that this (or anything) directly causes headaches, Chirp has an unusually small x-height (stem width to x-height ratios would normally be around 1:6 for a legible font – Chirp's ratio is 1:4, very small) and an extreme x-height to body height ratio (the capitals are MUCH taller than the non-capitals).

The net effect is that even at the same "font size" you have to squint more to read anything, because non-capital text is very very small and tight relative to the rather large capitals.


I find handles and other bolded text are objectively difficult to read. Take a look at a bolded 'e' for a prime example; there is not enough whitespace, and the horizontal line is too thin, making it all but disappear in the middle of the bold curve.


They should count themselves lucky. Just headaches and not seizures? https://www.psychologytoday.com/gb/blog/its-catching/202007/...


> is it actually objective qualities of the font that are giving people headaches

The typeface pulls your left and right eyes toward each other, making you look at it cross eyed. It's incredibly nauseating, like the feeling you have right after stepping off a poorly-designed amusement park ride.


I don't use twitter that much. I find the font uncomfortable to look at on my windows desktop but not my macbook. Especially the left hand navigation bar. so, for me, it's not about the change but about the font in specific rendering environments.


Windows' font rendering just plain sucks compared to macOS, to a point I'm actually getting headaches. I know, subjective anecdata and all of that, but I haven't been able to pinpoint why exactly...


Or that the standard response of a large subset of the loudest Twitter users is everything they don't like is "literal violence."


Twitter's designers did this because it helps them get promoted and earn more money.


That's insane. I had crazy headaches yesterday (very unusual for me) and this could very well be the reason. I guess this is a good motivation to cut down on Twitter (now I just need HN to switch to this font as well).


I solved this by adding this rule to uBlock:

    ||http://abs.twimg.com/fonts/*.woff


Your filter didn't work for me with uBlock Origin, also I'm not sure that many people still use Twitter over unencrypted HTTP.

This filter seems to work (tested with uBlock Origin 1.37.2):

    ||abs.twimg.com/fonts/chirp-*.woff$font


Oh, right, mea culpa. I just copy&pasted this from a tweet and didn't notice the added ://.


just tried in My filters, left column looks still same (much thinner font than before), what am I doing wrong? W10 Pro (customs caling size 110) + Edge (Chromium)


It's not meant to undo all design changes on Twitter. It just disables the webfont and lets your browser use its default font instead.


Since most of the comments are negative, I will say I noticed the new font yesterday and loved it on my Windows computer in Chrome.

I switch between Mac for work and Windows for pleasure and Windows font rendering can be hit and miss.

I notice fonts on websites a lot and get frustrated when they're bad but this was one of the most pleasant ones I've experienced, to the point I went and looked it up. I didn't realize it was a modified Grilli Type, I've always enjoyed their fonts so not much surprise I liked it.


Can I ask for your resolution + monitor size?

I'm on Windows, and in Chrome and Firefox this new font is a pain to read.

( 1080p / 24" here )


13" Surface Laptop 3.

2256x1504 (recommended) at 150% scale (recommended)

On Windows 11 too, if that has any consequence.


Maybe I'm being a curmudgeon, but I miss bitmapped fonts.

I use terminus wherever I can. It's exactly 12 pixels high (there are larger sizes, but they're not really useful). It's crisp, and clear, and easy to read, and looks excellent in Emacs.

There's no fancy font hinting or subpixel rendering. The font specifies exactly the pixels that it occupies, and that's it. If Emacs tries to render it at 11 or 13 pixels high, it doesn't -- it renders at exactly 12.

Some years back, firefox removed support for bitmapped fonts. So I had to set it to use terminus-ttf instead. This works fine in many places; the comments here in hacker news are being rendered at 12px so it looks pretty similar to the bitmapped font except with the addition of some subpixel rendering. It makes the edges of the letters soft and fuzzy but I would really prefer nice crisp, clean pixels. It's not too bad, though.

But in this comment box, firefox wants to render the text at 13.33px high, so it tries to upscale it a little bit and it looks muddy and terrible.

I guess things are different on a high-DPI display, but if you want to optimize the legibility of characters while minimizing their size, you really can't beat a bitmapped font where someone actually went and manually placed each and every pixel by hand.


I don't get it. This news is cristal clear to me, at least on my one plus 8 pro.

I don't see any blur. I don't get fatigue. I find it quite neutral, but easy to read.

Weird.


I was about to dismiss these as complete fabrication and go on with my life. However, after looking at the font screenshot, I instantly felt a small pinch behind my eyes and at the back of my head. Coincidence ? Maybe, but it happened also with my SO and some members of the family (without warning them first).

So there might be a problem with this font indeed!

Note: we saw the screenshot on my iphone 12.


Same. I genuinely have no idea how something as big as twitter could botch this so bad. Is buying one of every majorly used device and handing them to a bunch of testers really not worth the effort?


Disabling web fonts works. It speeds up page load, and let's you pick fonts that you find readable. https://chrome.google.com/webstore/detail/disable-web-fonts/...


Noticed it yesterday and thought the stylesheet had glitched on my browser as the font was soo bad but then later on it was trending so realised Twitter had just been stupid.

Was getting a headache from it.

This change can be undone for now using this JS: document.cookie="ab_decider=responsive_web_chirp_font_enabled=false&responsive_web_nav_visual_refresh_enabled=false"


I remember when Chirp was the Twitter Developer Conference. Those were very different days.


I really dislike the new font. Part of the problem is the spacing between characters.


Yes! The inconsistent character spacing and the width of the downstrokes seem to be at least parts of the problem.


I like it on desktop, not so much on iOS. The spacing is more of an issue for me on mobile.


I agree, that's what bothering me too. It looks like an unfinished font.


On MacBook (built-in retina display), it has very similar antialiasing to the default UI font SF.

However, the x-height is smaller and that bothers me a bit. If I increase the font-size in tweets to 15.5px, it matches old size and looks good again.


If you don't like the new font or Follow/Following buttons, my browser extension/user script for Twitter can now get rid of them, screenshots in the release notes here (the latest Chrome version is still pending review at the time of typing):

https://github.com/insin/tweak-new-twitter/releases

I tried turning Chirp back on after a full day of coding at work and it's even worse when your eyes are starting to get tired, genuinely unpleasant to look at (on Windows, at least).


Yeah the follow buttons confused me for quite a while. I thought I was following a bunch of folks at first glance. Then I realized they've flipped the sense of outlined/solid buttons!


Emblematic of my general disdain for the entire field of Web Design/UX/UI, whatever we're calling it these days.

Just let the damn user decide for themselves. It's ridiculous and stupid that we can't do this.


I’m a visually impaired individual with moderate disability — I can use tools like custom typefaces and zooming to manage most of my needs but I rarely use screen readers as well.

Personally, the main difficulty I have with the typeface is the kerning — the minimum space between two letters. I don’t know how these things are measured, if it really is as tight as it looks, but subjectively it feels like surprisingly little space. It’s much harder for me to read than Neue Helvetica.


I'm not the only one!

I thought it's something with antialiasing or whatever on Mac, figured out I will solve it later with some setting or whatever.

It literally physically hurts to read it.


I don't know about Twitter, but HN font (or colours, or spacing, I don't know) has always given me headaches. And I almost never have headaches otherwise.


I'm zoomed in 140%, it helps


I have a userscript running for HN that bumps up don’t size and line height


I personally can’t stand reading Twitter, but I do like posting jokes and comments for my small group of friends. I built this to delegate posting to Twitter via GitHub actions from markdown files in the repo. https://github.com/reidjs/markdown-tweet-scheduler


Why markdown? Does Twitter support rich text?


Apparently there are problems with the font hinting which is why it looks bad on Windows. Folks are still figuring it out, but see e.g. https://twitter.com/mcclure111/status/1425892769550245888


In three months this will all be forgotten.


Huh. I looked at a side by side comparison and I could barely tell the difference. And everything on twitter.com seems legible. I guess I'm not typeface sophisticated enough!

Now the PayPal and Dropbox fonts... those I noticed. And those I loathe entirely.


This change appears to only affect posts in western languages, and users with multilingual content end up with a mix of fonts in their timeline, which doesn't look all that great.

But at least Twitter did not mix fonts within the same post, I guess.


Even their announcements on design and font updates never show screenshots and interactions from the actual site: it's all marketing shots and videos.

I wouldn't be surprised if this change was never tested outside Figma/Sketch mockups.


You never know when something is going to crop up that causes you a headache. Personally, I can't use a phone with curved screen edges or a curved monitor without incurring a piercing headache after fifteen minutes or so.


Wow I thought something felt weird when I looked at the screen then looked away. I'm not dyslexic or anything but looking at Twitter with that font almost makes my head hurt, not kidding.


I don't know about headaches, but I do find this font decidedly less readable. The letters are too spaced. It does something to my brain that makes me have to slow down while reading.


My guess is the headaches either only happen if you use Twitter while drinking the new Coke Zero, or they only happen if you use Twitter while not drinking the new Coke Zero.


New font looks fine to me. But might be because I don't read Twitter every day. Didn't even know if the new font was active until I checked the Chrome inspector.


The font rendering feels broken on my Windows machine to me. Like the designer only tested it on a Mac and didn't account for how Windows renders fonts differently.


Don’t worry, it looks equally bad on my Mac.


This is one of the reasons I always disable web fonts, in preference to the system fonts, so my browser interface is consistent with my desktop interface.



It's extremely similar to Roboto, which is how it was rendered for me before the change. So it seems almost like nothing happened.


The difference is quite obvious, at least on Windows. Roboto is narrower, better hinted, has fewer embellishments, got a better consistency ("rhythm") and as a result it's much easier on the eyes. Here, side by side - https://i.imgur.com/tXokROR.png - Roboto at the top, Chirp at the bottom.


It also seems that chirp has unusually short ascenders and larger lobes/bowls. For example the 'h' character looks like a child drew it and much closer to an 'n' than one would expect.


Ugh yeah, very poor in that screenshot


At one stage there was a thing for applications to have skins or themes and you could make your own.

Why isn't this a thing anymore?


It feels like I'm developing heatstroke, or looking at a particularly unsettling black-and-white prison uniform.


I'm one of those with headache, on my samsung s10e it seems blurred, I have to concentrate to read it well.


Are you sure it's not just Twitter giving them the headache?


is this like the digital tobacco equivalent of getting a sore throat and a cough from not being able to get your usual brand?


additionally, for those that missed it, [CHIRPBIRDICON] in this font is ligature'd into the Twitter logo


... which, at least for me, then gets a nice red underline for being misspelt


Simple solution, just disable use of custom fonts in browser preferences, to force use of configured system fonts.


Note: simple does not imply useful. Plenty of great content out there that strongly benefits from telling the browser not to use the extremely limited "web safe" fonts, or incredibly ugly OS defaults for non-latin content. Let along fonts for typesetting maths, or diagrams, or even smart things like "temporarily showing scribbles instead of real text, until everyone's clicked the "ready to share!" button on their shared page experience".

This is the nuclear option: it's simple, and also ensures a terrible experience of a web with content based on the fact that webfonts are going to work.


"apparently"


Headaches? That's just a side effect of being on twitter I'm afraid.


The text of this article is 50% a repeat of the embedded tweets.

It’s like high schoolers gaming word counts have taken over publishing.


I can't stand this "twitter hates x" trend where articles use a handful of embedded tweets to make their case, but then you look at the engagement on those tweets and they have like 2 likes. Good job, you found a couple of random people on twitter talking to themselves. You can do that for any opinion under the sun.

Maybe people really do hate the font, but use some real numbers to make your case, not this anecdotal vox pop fluff.


Same here. It's like all those sensationalist political / culture war articles that frame some out-there fringe idea as a mainstream agenda (e.g. "Curry considered racist"). Then you actually read past the headline, and it turns out some unknown blogger or tweeter was just looking for attention.

Anyone going purely off of headlines, and taking them at face value, would have an absolutely bizarre worldview by now.


"A few random Twitter users wrote some stuff" is one of my least favorite forms of modern journalism.


Yup. This is a non-story. People always complain when popular apps get UI updates.


Many of these articles could be generated automatically with a script using GPT-3. Simply supply a collection of tweets as a parameter.


Surely that’s exactly what happened.


I don't know about Twitter's new font.

I can offer this; 99.99% of the time I hate font changes, especially from companies that I am used to looking at.

I'm not one of those hate any changes guys. I will admit if it works, don't touch it though. A lot of websites don't just work. HN just works. No need to change anything. It font change that irritates me.

Viacom/Comcast recently changed their font on their lousy viewing guide, and it's irritating.

Why? I think it a combination of, "you shouid get working on your lousy app, and not the font?"

Changing font is easy. Changing an api is better especially when it's needed, along with lowering price from customers who hate your company?


The new Twitter font looks so weird, and at the same time, it looks quite strong on the eyes. They should revert it to the classic one and bring back the fleets.


> bring back the fleets

Did anyone use fleets?


When it was announced fleets were going away... had to look up because had no idea what a twitter fleet


g has an ugly tail, and ? kerning is too small.

cnet's font is kind of ugly, too...


The new font is also destroying Arabic and Farsi text. Does Twitter not have a single Farsi or Arabic speaking employee?

This is an indication that they really don't value diverse employees there. Can't believe no one was like "hey this is destroying readability of these two major languages."


The new font doesn't even have Arabic characters in my browser. It just gets rendered in Segoe UI. Which is fine, for what it's worth.



Wow yeah that's rough :( It's legible for me but this whole font disaster looks like a brower-by-browser minefield




Join us for AI Startup School this June 16-17 in San Francisco!

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

Search: