178 comments

[ 2.9 ms ] story [ 228 ms ] thread
Add this to the list of falsehoods programmers believe about fonts.
Anything more complicated than ASCII text in a single monospace font is literally impossible to implement and nobody should ever attempt it.
Amazing to see people doing such important work. As an engineer I should really step aside and let these guys run the internet.
This site turned to a techdouche entrapanubro haven.
Google Fonts is still unlawful in Germany because it violates the DSGVO by leaking the IP to Google without user consent.
That sounds like the entire internet is unlawful. How would a German access any content outside of Germany without going through the tens-hundreds of intermediate routers? There's nothing stopping those routers from logging IPs going through them.
I'm not saying that I agree with the current situation, but as of now it's risk for the developer to use Google Fonts. To answer your question more specifically, I guess you could argue that it's a layer problem. Lower layers can't prevent "leaking" your ip with the current state of the internet, upper layers can and should.
>... as of now it's risk for the developer to use Google Fonts.

Couldn't the developer download and host the font locally instead of calling back to Google's servers to load the font?

Yes.

The person claiming Google Fonts would be "illegal" in Germany is misinformed.

It is simply considered best practice to self-host Google Fonts now and you are absolutely safe doing so.

The basics of privacy law is basically don't violate the privacy of your users for no good reason. There is no technical justification to use a Google's third party service for fonts, especially as that potentially allows Google to track users. (You could still use Google's hosting if you were to get prior user consent though. Just have a fallback font. That wouldn't be worth it though.)

So yes, you can use third party services and CDNs on your website but it needs to be either technically necessary or you need for user consent beforehand.

Just to make sure, I didn't say illegal, just unlawful. I agree with everything else you said.
To further contextualise the judgement: This was a trial before a medium level district court (Landgericht). So there has not yet been any landmark court decisions on this specific issue in Germany.
Is caring about performance a good enough justification? Chances are most popular Google Fonts are already cached in your browser.
Cross-site caching doesn’t exist in any modern browser (IIRC each site gets it’s own separate cache) because it enables all sorts of tracking and leaks browsing history.
Shared CDNs (Google Fonts, jsdelivr, etc.) provide absolutely no advantage in modern browsers due to privacy concerns. The developer should be self-hosting the font instead of using Google's servers irrespective of German law.
Is that actually the test? That still sounds like it would make every third-party CDN (Cloudflare, Akami, etc) illegal - a CDN isn’t “necessary” and logs IP addresses all over the place. I can’t help but feel that the situation is much more complicated and nuanced than the original comment in this thread is making it sound.
No, that's actually what the law says: https://rewis.io/urteile/urteil/lhm-20-01-2022-3-o-1749320/

So far, the courts have only selectively enforced it against Google, but any website which is controlled by an American entity, hosted by an American entity, or which embeds content controlled by or hosted in the US is de jure illegal under GDPR because it means an American court could theoretically get a warrant for EU citizens' IP addresses.

Do you have a source that backs up your interpretation of the situation? IP addresses are "leaked" (I think that's a really shitty term in this context tbh) to every single thing you communicate with, or via, on the Internet, and most of those things are operated by third parties.

If "necessary" or "unavoidable" is the test, then it gets really murky — is it really necessary for your ISP to buy wholesale IP transit from another ISP when they could build out their own infra instead? It's entirely avoidable for them to peer at IXes for more economical / efficient routing — and those IXes have switches and routers operated by third parties which can see your traffic — so is it illegal for them to offload your traffic there as well?

(comment deleted)
The point is: Do not use CDNs
Caching does not even work like it used to with a cdn so self hosting things like fonts is preferable in general.
What has changed?
Domains can't share the browser cache of a an external resource. It was a privacy risk, because it could be used to track users across the web.
It still is used to track users across the web.
The issue isn't the existence of intermediary routing, it's the export of data outside the EU by an EU site.

A German resident that wants to access Google or any other US site is fine. The packets are allowed to exit the EU because that's what they asked for.

Using Google Fonts means that your EU users have to access Google, a US company, in order to read your site. Most browsers are configured to do this automatically and opting-out of that would be time-consuming and break the whole web. And using Google Fonts gives Google the unprecedented ability to snoop on third-party sites. Yes, they have promised not to do this, but their host government has also promised to break Google's promise for them.

Taking that same logic and applying it to intermediary routing, the only time in which you'd have a GDPR export case is if you tried to access an EU website and your traffic was rerouted into the US or China. Which actually happens way more often than it should.

>using Google Fonts gives Google the unprecedented ability to snoop on third-party sites

What 'snooping' is happening during a CSS import?

Hosting a subresource of another website gives you `Referer`, at the very least. And the set of fonts requested is fingerprintable even if your browser didn't send that header. You can also fingerprint the browser further to tie that information into your ad profiles.

Google promises explicitly to not do this, and I believe them. However, they can still be compelled by law enforcement to break their own promise, and that's what the EU is reasonably angry about.

Irrespective of cross-origin caching, `Referer` should have been neutered long ago to always specify the base URL of the site hosting the resource (or killed entirely).

Also Browsers should send exactly the same headers when in image and page contexts - if I want to view an image it means I want to view an image on its own and there should be nothing the site can do about it.

If we lived in an alternate universe where the same-origin policy applied to all subresources from the get-go, then I would agree with you. But we don't. And in this universe - the one where every website can include subresources from any other by default - you absolutely need an opt-out to say, "no, I really don't want to host this one image for the entire WWW, just my own domain". Referer is that opt-out.
User privacy should always override website concerns - we are talking about what user agents should do here. If there is sufficient reason to believe that users would benefit from restrictions on cross origin embedding then we can always define a new header like was done for X-Frame-Options (which of course user agents are free to ignore if the user wants that).
You can still use the fonts if you host them on your own site instead of making the browser load them from Google.
This. Just don't pull them directly from Google but instead host them yourself.
Why don't you download and self-host the Google fonts?
For the longest time I thought that was not allowed, and I'm more worried about copyright violations (civil suit) than GDPR violations (criminal law, but I can't imagine a persecutor takes the time to look at my tiny websites. Here there is a saying "where there is no plaintiff there is no judge").
There is no problem with self-hosting Google Fonts, the license allows that.

I have don't so for multiple bigger customers, the law departments were fine with that.

Yeah but that is really debateable. What most people do is just put really broad terms in their data protection declaration. I think there have been a couple "Abmahnungen" but this was never really tested in court, right?

Personally, I think hotlinking should not be considered leaking of PII. Setting a link should not imply endorsement, and embedding an image or an iframe should not create a derived work. The website just gives instructions to the user's browser. I could change the font myself or open another window with the embedded image next to the website, it is merely a convenience. But lawmakers try to put everything in the mold of yesterdays technologies, which is why we cannot have nice things.

Now, how to deal with the fact that Google does get your IP and/or can identify you with cookies? Just ban profiling. It's not so hard.

Using the hosted Google Fonts is, downloading and hosting yourself isn't.
Only the arabic ones look decent. The latin ones remind me of word cliparts.
They really do look like WordArt and ClipArt from 2003, maybe it's the color choices?
To me it's is not necessarily just the colors, but that with the Arabic script the new features are applied in a more tasteful, subtle way. Whereas the latin examples seem more like showing off what you could do, but probably shouldn't.
The emoji ones also seem to work quite well
I've posted this link before (as a ShowHN) - this is my attempt to "replicate" color fonts using my JS canvas library. Getting the effects to be both responsive and amenable to user accessibility choices, while also including ways for developers to adapt the effects via CSS and/or HTML data- attributes ... it's frustrating work. But at least they look pretty. https://scrawl-v8.rikweb.org.uk/demo/snippets-006.html
Design is highly contextual, so I think it'll depend a lot on how they're used. These fonts seem a lot more polished than what you would find in old-school clip art packs. I can imagine some interesting use cases for these.

And even if these fonts don't hit, people will make more!

On a vaguely related note, I recall that classic Macintosh, sometime in the 1990s, had (possibly unofficial and/or hackish) operating system support for colour bitmap fonts. But I can't find any reference to this on Wikipedia or Google searches.

I wonder if anyone else remembers this; perhaps there's an opportunity to document/archive something about typography which might otherwise get forgotten.

I think you're thinking of the Amiga, which had support for ColorFonts – the Kara collection was made famous by Deluxe Paint
In this instance I'm definitely talking about Macintosh.
Even there, colorfont support was not part of the OS until 2.0 (or maybe 2.1, can’t remember). In the 1.x days you had to load the ColorFont wedge before you could use them
I love the retro vibe of their isometric "Nabla" font :D
Will this be abused like the <marquee> tag and animated gifs.
I'm surprised at how fun this article is, and how gorgeous fonts can look. And, it makes me, at least for a few seconds, want to switch back to Chrome from Firefox.
It works perfectly on Firefox :) https://fonts.google.com/specimen/Nabla
Also working perfectly for me on Firefox, once I remembered to turn off LocalCDN.
Only on that specific page because it uses a custom renderer. Try to place the font on another web page and view it in Firefox.
For some reason Google Fonts rendering is just awful on my (Windows) machines. I tried to investigate, but got nowhere. They seem extremely jaggy and with uneven strokes, like they were only tested on 4K displays. I don't have the budget to go beyond 1080 at the moment.

This has made me extremely averse to them, to the point where I simply avoid sites using them.

And now they add color...

These are all vector fonts, I wonder if they'll work better for you
The maximum size at which 1080p (2K) works is 23".

The maximum size at which 1440p works is 30".

The maximum size at which 2160p (4K) works is 40".

If you’re using a larger size than the ones given above for a given resolution, you will have less than 96dpi, leading to fonts that break or become too thin, and icons that will be less recognizable.

________________________

P.S.: The same can be said for colors. While any CRT in the 90s but even early LCDs like the Fujitsu SIEMENS P17-2 from 2004 (now 30€ on eBay) gets 100% sRGB, full 8-bit colors at exactly 96dpi, many gaming monitors don’t even manage this today. There are still gaming monitors, 1080p at 30" or even 32" using 6-bit panels with FRC that barely hit 70% sRGB on sale today.

Can you send me some screenshots? Very possibly you have some ClearType parameters set wrong on your system. We absolutely do test on 1080p (though I admit my work machines are all retina/4k at this point).
Next up is sound and interactivity in emojis, including a custom emoji scripting language and emoji platform, and then the inevitable "DOOM ported to emoji" projects.

And of course, web browsers and text rendering become increasingly more complex and expensive to build/maintain because Google single-handedly decided it.

Emojis have had colors for over 20 years so this is a terrible strawman you've fabricated
Did you read the post? This is a new spec called COLRv1 which adds a bunch of complex rendering features to do what is effectively word art.

Why does this need to be a new spec? Nobody is going to use it for body text. If someone wants those ugly 3D titles, they could use SVG or Canvas.

One of the examples in the OP was colored arabic text for education. That’s an extremely narrow use case which could be entirely supported with custom rendering via SVG, Canvas, WebGL, etc.

This isn’t the end of the world or anything, but it’s annoying and frustrating to see as someone who thinks there should be more browsers and operating systems than the ones Google makes.

> they could use SVG or Canvas

They could but then it would be less accessible for screen readers or bots that want to scrape text from a web page for indexing or anything else. Your user agent can also determine if rendering those "ugly 3D titles" is the right thing to do or not, so you could have a plugin that stops them from being rendered.

> there should be more browsers and operating systems than the ones Google makes

These fonts work fine in Firefox.

> They could but then it would be less accessible for screen readers or bots that want to scrape text from a web page for indexing or anything else.

Screen readers can read SVG, and ARIA exists for adding accessibility to things like Canvas or WebGL (see: https://developer.mozilla.org/en-US/docs/Web/Accessibility/A...).

> These fonts work fine in Firefox.

They in fact do not work at all in Firefox (or any other browser besides Chrome/Edge). If you go to fonts.google.com, they work because that page uses a custom renderer for them.

See the duck demo here (need to scroll down): https://developers.googleblog.com/2022/09/updates-to-emoji-n...

The duck is invisible on Safari on my iPhone and in Firefox (104.0.1) on my desktop

> They in fact do not work at all in Firefox

as noted by jfk13 below, you have to enable `gfx.font_rendering.colr_v1.enabled` in about:config

This is just an extension of the ISO Open Font Format (Opentype). I think it's great because it's so far the only standard way to specify color needed to render emojis.
After seeing the beautiful new Arabic fonts in this post, I can't go back to being happy with just simple text for the web. We're still so far from the beauty of calligraphy and even old metal typefaces, with their ligatures and all. We have to dream bigger.
Browsers are already at the level of complexity of operating systems.
True Type fonts have been Turing complete for a while. You‘d need to implement a small TT OS first, of course.
While the parenrt is an ironic comment, color fonts were a staple of computer graphics design during 90s and palettized graphics like VGA 320x200x256 mode. The art was lost with TrueType and now it is coming back. People who have used Deluxe Paint Animator remember this.
What's up with svg fonts? I suppose this is a binary format, and presumably smaller and faster to parse than compressed SVG fonts, but I admit I'm a bit surprised that this isn't an improvement to an existing SVG font ecosystem and is instead it's own thing.

It seems that if this was legitimately useful (instead of just one more thing competitors are obligated to spend money on implementing) we'd have seen SVG fonts used for it already.

SVG fonts are OpenType fonts, and my understanding is that new-ish support for SVG tables in OpenType fonts is what enables this.

https://color.typekit.com/

https://docs.microsoft.com/en-us/typography/opentype/spec/sv...

https://helpx.adobe.com/fonts/using/ot-svg-color-fonts.html

"OpenType-SVG is a font format in which an OpenType font has all or just some of its glyphs represented as SVG (scalable vector graphics) artwork. This allows the display of multiple colors and gradients in a single glyph. Because of these features, we also refer to OpenType-SVG fonts as “color fonts”.

OpenType-SVG fonts allow text to be shown with these graphic qualities, while still allowing it to be edited, indexed, or searched. They may also contain OpenType features that allow glyph substitution or alternate glyph styles."

SVG Fonts have never had good support in web browsers. SVG-in-OpenType fonts has some support, for instance in Firefox.

Google Chrome teams refuses to implement SVG-in-OT. Instead, they wanted to implemented their COLRv1. https://bugs.chromium.org/p/chromium/issues/detail?id=306078...

the Mozilla position on COLRv1 is "Provides comparable design capabilities to OpenType-SVG, but in a more compact and lightweight form that integrates better into font rendering pipelines. Has the potential to supersede OpenType-SVG fonts in web use."

So this seems like a good thing overall. Note that Firefox doesn't support it at this time.

> the Mozilla position on...

Where does Mozilla's revenue come from? Are they an impartial 3rd party?

There's support in Firefox Nightly, actually, if you enable the setting 'gfx.font_rendering.colr_v1.enabled' in about:config.
Nobody wants to be responsible for introducing the security/performance nightmare that is SVG fonts into their codebase. SVG is too big and too unwieldy and does too much to make a good performant font rendering impl. Crucially, OpenType fonts already have their own custom vector format that authoring tools and renderers are used to working with, so this is a form of colored font support that builds on existing font principles instead of stapling an entire SVG renderer inside of it.
I can imagine the only people excited about this are G O o g L E
The gradient should look amazing for Chinese/Japanese/Korean stroke-based scripts. I can't wait to see them being developed.

The Arabic scripts look amazing! Gradient support is bigger than color support imo

Seeing the Arabic script and knowing the technology behind it that makes it possible to render is one of those rare "wow" moments for me.
I quite disliked the Latin fonts at first sight, but I like the Arabic ones just as much as I dislike the former. An occasion to contemplate that what may be not that great in the context of Western culture may be still a great thing and useful for another one.
The Arabic scripts are breathtaking but I had some difficulty discerning the Reem Kufi examples. It might be just me, but I've never seen the right+left connected ع drawn that way in Kufi scripts. It seems both alien and a poor match for the rest of the characters in the Reem Kufi fonts - I first thought it was a ligature error!
Reem Kufi designer here, that is the original form of ع in Arabic and the only form used in manuscript Kufi. Kufi-inspired typefaces often use the more familiar form from later calligraphic styles. Reem Kufi has an alternate form as well, but it is not the default.
Thanks for the explanation, Khaled! I have some reading to do! Beautiful work, thanks for releasing these fonts and for sharing this info.
Reminds me WordArt from MS Office
Arab calligraphy is really pretty.
Wordart in 2022.
A nice example, not currently available on Google fonts AFAICT, is 'Gilbert': https://www.typewithpride.com
That is a beautiful font. Is it distributed in the same format as what's discussed in the material.io post (COLRv1)? It's still a good example of what's possible; I'm just curious.
There is also a Hangul adaptation of Gilbert called Gilbeot [1]. It also has an interesting feature that censors words that discriminate LGBT people (akin to Sans Bullshit Sans). I do have a feeling that they are clearly decorative and yet still being overused for non-heading text, maybe this is a major problem with many color fonts.

[1] https://rainbowfoundation.co.kr/gilbeot

How is it "nice"? It's almost unreadable.
It's clearly a title font. If someone uses that as a body font, it's hopefully a shitpost.
In fact, its design choice is questionable even as a title font. Normally the text color will be chosen so that it has enough contrast compared to the background. With color fonts you can't always change the text color, but you can still change the background. Gilbert however contains all hues in a single glyph, so some part of each glyph is always going to be hard to distinguish from the background without much care.
Looks extremely unreadable and ugly. Guess that's what happens when you're tasked with creating a font based on the "rainbow flag".
There are a few nice color fonts I have used in the past. One of my favorite is Raleway Color Semibold by Vidhunnan Murugan: https://typewithraleway.firebaseapp.com
Sad, all I see on that page is:

  3E A DESIGNER!
  E YOUR DESKTOP/LAPTO
Seems pretty misguided.
Unfortunately this webpage is completely broken on iPhone.
Funny that the site forces to be view on a desktop.
Never thought I'd see WordArt coming back 20 years later but here we are.
I thought you were going to say 30 years later. Amiga had color fonts
I'm honestly kinda surprised it took this long
In the future, there are no fonts. We will just send and receive streams of strokes.

And then people who need it will use OCR to translate into text. Which won't always work very well.

What are you talking about? There's an example right here of how you would use it: https://developer.chrome.com/blog/colrv1-fonts/

More specifically:

    <div class="spicy" contenteditable spellcheck="false">hackernews</div>
The text is right there. It's still HTML.
I'm painting the progression of where this is going. I'm not trying to describe this effort. I'm legit worried that Unicode will eventually fail, and we'll all just be sending streaming SVG to each other.
What’s your basis for believing this will happen? If anything the state of accessibility has improved over the past 20 years, not gotten worse.
This makes me feel old. I'm glad that the option is available for people that want and enjoy this kind of design, but for my part I'll probably disable this feature and continue to block custom fonts.

Still, it's interesting to see that there's still room for innovation in the font space, even if I'm not in the target demographic.

With the ability to add parameters to fonts, I wonder how long it will be until we have Turing Complete fonts.
https://litherum.blogspot.com/2019/03/addition-font.html

"So this is pretty cool, but it turns out that the contextual substitution lookup type is really powerful. This is because the table that it references can be itself, which means it can be recursive."

[…]

"So thats a pretty powerful virtual machine. I think the above is sufficient to prove Turing complete-ness."

TrueType already has a Turing-complete bytecode.
Postscript fonts? Fully programmable font glyphs in the 80's. Little used, but very fun. I recall a typewriter font that would vary the glyphs position, weight and edges a bit to simulate coming from a manual typewriter.

One could, if so inclined, build a complete COLRv1 font parser in PostScript.

>> Even if you’ve never heard of “color fonts,” you probably use them everyday

"every day". as in "each day". The word "everyday" is an adjective.

I think it works both ways?
Not really, no. It is clearly wrong, most people wouldn't notice though. It's about the same level of wrongness as "alot".
If people don't notice it's "wrong" then it's correct. Language is defined by its speakers, not language pedantics, and always changes and evolves.
_Most_ people don't notice. There still are rules especially for grammar.

It's not something I would bring up in a forum, absent context or someone asking about it, but I'd definitely correct it in formal writing.

I'd say there are expectations, rather than rules. If you know your audience is likely to care about these sort of things then it's indeed a good idea to correct them, and it's usually best to be conservative in formal writing. But that doesn't really mean there are "rules" which cover any and all usage of the English language.

Joining words to one compound word is pretty much the example of language evolution.

Alot is in the process of joining along and around. No big deal.
> It is clearly wrong, most people wouldn't notice though.

That seems like a contradiction. If it were clearly wrong, most people would notice. The fact that they don't surely implies that it isn't very clear.

The rule here isn't ambiguous, that's the sense of "clearly" I intended.
(comment deleted)
Would it work as "every day"?
Yes, "every day" and "everyday" have not-quite-the-same meaning.
If Google uses it as a noun, it is a noun.
So is this statement linguistic prescriptivism, or descriptivism?
Prescriptivism is "Invalid syntax on line 32, column 14: 'everyday' is an adjective".

Descriptivism is "shush, if people are using it this way then it's correct".