In a similar vein, LocalCDN is an extension to serve the most common javascript libraries from your browser instead of going to 3rd party servers, while there are edge cases when you use a local copy, I've rarely had an issue.
Removes integrity and crossorigin tags from embedded script and style elements to replace even more frameworks
Font Awesome
Google Material Icons
jQuery
Bootstrap CSS
Bootstrap JavaScript
AngularJS, AngularJS-Animate, AngularJS-Sanitize, AngularJS-Cookies and AngularJS-Touch
React, Vue.js, Chart.js and many other frameworks/libraries
MathJax (minimal)
TinyMCE (without plugins)
Prepared rules for uBlock Origin, uMatrix, AdGuard and NoScript
More complete lists can be found in the source code, there are a lot of them:
LocalCDN provides no meaningful privacy gains over enabling Total Cookie Protection (i.e. dynamic FPI, already enabled by default in modern versions of Firefox) and disabling cross-site referers, which you should do anyways.
Tried this when it was actively developed and it done nothing but spew a load of errors in my browser console. Not sure if that was intended, but it made me cry looking at all the errors. It also broke many sites, where the proper jQuery version wasn't served, and a bunch of CSP errors in my console too. On top of this, it increases the fingerprintability of the browser, so this was an easy uninstall.
With caches now partitioned in all browsers, and CDN-hosting your code now strictly a worse option overall, it's becoming rarer and rarer for this extension to activate in my browser. I'm likely to uninstall it soon, which is a good thing.
This will do nothing for websites that are built with bundlers, since the site-specific code will be in the same file making it unique. Probably still catches a good few though.
I thought the whole point is to avoid sending HTTP requests to third party sites. At least for privacy. So in a way who cares if this sites give you all the content instead of just part of the content?
Firefox has this setting built-in, gfx.downloadable_fonts.enabled and browser.display.use_document_fonts, but AFAIK it's not configurable via GUI by default.
Chrome hides it even deeper in a command-line option, --disable-remote-fonts
browser.display.use_document_fonts is Settings → Fonts → Advanced → Allow pages to choose their own fonts, instead of your selections above. Note that that’s distinct from disabling web fonts: it will cause your chosen fonts to be used (so `font-face: some-web-font, Arial, sans-serif` will resolve to sans-serif), but still allow loading of web fonts for the Private Use Area, so that all mainstream icon fonts except for Google’s misbegotten Material Icons (which uses ligation of ASCII code points, which is a technique that was a horribly misguided idea from the start and makes accessibility worse far, far more often than it makes it better, and the precious few cases it makes better could readily be made betterer by other techniques) will still work.
One thing I don’t see mentioned here is the possibility of additional profiling by disabling web fonts. Doesn’t this make you more more unique as a user since very few people disable web fonts?
I suppose you could argue that many users can be uniquely identified either way but it’s no doubt a strong additional piece of info.
The point is not to access third party tracking hosts (including web fonts and JS library servers) at all. The number of sites that implement first party server-side tracking to exchange data with other systems (like Imgur) is much lower than the number of sites that “simply added” fonts, libraries or counters from popular delivery networks.
Unless, of course, we talk about any site that uses Cloudflare, which is a first party tracking service built into into the web server itself.
The absence of info can’t be “additional” info. It’s a differentiating factor, but at best it’s on par with any other single info you would have sent through the font fetching request.
Arguably that single boolean characteristic (“fonts disabled”) is way less info than the dozens of characteristics you expose when fetching a font.
Disallowing font loading would be trivially used in fingerprinting. The non-boolean cascade of font fallbacks is too, but knowing that a user has a browsing context which should trigger one or more of those fallbacks, but doesn’t, is far more information than knowing that their browser behaves as expected.
The server where the font is being loaded from would have no record of your activity. That's the but that improves privacy. I think there's an expectation that if you're concerned to this extent you'd have JS disabled as well, which would make it hard to detect whether you're displaying the font. Probably not impossible with CSS though.
The best middle-ground would be to spoof the most common set of fonts (probably Windows X default fonts?) as that would surely increase the number of probablistic matches over custom fonts / no fonts I can't imagine a large percentage of users (probably no browsers) completely disable web fonts and web font fingerprinting.
Is it possible to spoof information like that in a browser without reprecussions though? I don't think I've seen any extensions to spoof things like this, just settings to block the gathering of data in the first place.
I have been doing this since years but many sites become unusable with FontAwesome blocked. For the time being, I manually unblock fonts on absolutely necessary websites. Any hints on how I can unblock only fonts from FontAwesome, preferably from ublock origin?
>Additionally, most of the time web fonts are downloaded from a third-party delivery network such as Google Web Fonts or Adobe Fonts. One of the advantages of using these systems is that the likelihood that a visitor’s browser already has a font cached locally from a previous visit to any other site using the same font is relatively high.
That likelihood is relatively low (though not as low as JS CDNs). Modern browsers explicitly forbid sharing cache entries across websites; so the likelihood is zero now.
>There are some privacy concerns when your browser makes the link to the font network’s domain. While they deny the practice, these services have the ability of profiling your browser (using browser fingerprinting with your IP address and HTTP referer header) to track what sites you visit, building a valuable profile about you that they could sell to marketers.
Also, if you're in the EU, this constitutes an illegal GDPR data export if the company running the CDN has any amount of American ownership.
My personal opinion is that instead of blocking Google Web Fonts, we should have an extension with the entire Google Web Fonts library preloaded in it, that transparently redirects every font lookup to its local cache. This neatly fixes the privacy problems and makes all CDN fonts load super fast.
I think the idea of web fonts is so that new fonts could be added and a user doesn't have to do something local to the browser.
And this feature costs privacy. If people really understood the implications of loss of privacy, they would not want it. However, most people don't, and would gladly swap privacy for features (and then in the future complain about it when the implications becomes real or affects them).
Yes, but if you install the entire font library locally then you have all those fonts in your system font picker, which you may or may not want. You also have to continue checking for new fonts or have sites that use them break. Having an extension do this for you is easier.
Also, there's no particular reason why webfonts need to cost privacy. The only reason to ever hotlink Google Fonts was to either...
- Accelerate load times (which is dubious)
- Be slightly easier to implement for lazy developers
Google Fonts are all freely licensed and specifically allow you to rehost them. All you have to do is download the TTFs and link to them in a @font-face declaration.
Adobe Fonts are the ones you can't self-host, because the actual CDN is a vehicle for calculating and charging a licensing fee. The privacy risk is deliberate, in this case - font owners need to know how many pageviews sites are getting so they can be charged the correct amount. Even then, this is something that could be done by having each site report their own usage statistics... except then the font vendors have to trust you, and they don't want to do that.
> That likelihood is relatively low (though not as low as JS CDNs). Modern browsers explicitly forbid sharing cache entries across websites; so the likelihood is zero now.
Even a decade ago when this was common practice, it was absolutely pointless because Google Fonts used to (still does?) set a cache time of only 2hrs.
> >the likelihood that a visitor’s browser already has a font cached locally from a previous visit to any other site using the same font is relatively high.
>That likelihood is relatively low
That likelihood was never high, and obviously so, I have no idea why it gets parroted so much. And even if it was true, I could have shown up to your website with jQuery and bootstrap cached, but oops it was a different free cdn so cache miss.
The only thing you had a high likelihood of is customers noticing your website was slow without knowing its just your poorly chosen free cdn being temporarily over capacity.
This will not work for web fonts that are required license. For example, the commercial font served by MyFonts by Monotype. The license term clearly stated that every time when the font is loaded, the counting system increase and incurred a cost to the owner.
This is a very shortsighted view from developer who forget a web page is not only a bunch of text. Designer also play an important role to provide the subtle design element that developers don't value.
By blocking all web fonts and fallback to only system font, you may still be able to read the text, but will completely missed the design.
I have never felt a page read better with custom fonts instead of local system fonts. I suppose the reason is because most local system fonts prioritize readability to a fault, while custom fonts are chosen for aesthetics (and aesthetics don't necessarily relate to readability).
A webpage is a bunch of text, if your webpage can't be read with something like "font-family: Verdana, Arial, sans-serif;" then you are doing it wrong.
A good design should have good fallback. Yes. A random example will be bbc.com, where BBC Reith fallback to Arial, Helvetica Free Sans and San serif.
With modern web "application", the chances you see a bunch of text would either be the T&C page, documentation you read, or news website.
These days we shop online as much as we do physically, so I pick two random clothing brand, Uniqlo and Levis. To create the same experience you shop online as you do offline. These two websites employ their font instead of system font, Uniqlo Pro and Helvetica Now.
From a function point of view, blocking those font does not stop you from buying their clothes. But part of the user experience will be lost.
Disclaimer, I am engineer in the media industry and has no association with the two example websites.
I’ve been blocking webfonts for a long time, and not being subjected to the design is mostly a feature. The only time it’s not is when instead of glyphs you get weird alt text like UP_ARROW.
Most developers suck at design but most designers suck at development.
If your designer can't make your website work well with one of the hundreds of fonts preloaded on my machine, I don't know what to tell you. If your website looks like crap because your designer couldn't come up with a good fallback font that's still on the designer.
It's like "web colours" all over again. Web designers should work within the constraints of the user agent or they shouldn't design for the web, and one of those constraints is that the font doesn't always look exactly like the designer wants it to look. It's called a user agent for a reason, these days more and more because the source it's rendering is as anti-user as can be.
I have web fonts turned off because I'm sick of text shifting because the particular Arial-but-not-really font a website insists on got loaded in. I've also occasionally had to use reader mode because the "design" was very fancy but practically unreadable.
Font readability is the function of familiarity with the given font. So if the user clicks that checkbox to disable thirdparty fonts in the browser and use a familiar font everywhere, I think the user is right. :)
That's why I disable thirdparty fonts by default and bug our designers when some text overflows in our app, due to some fixed width assumption in CSS, because system native font they did not design for is wider.
Let me explain how it actually works. I visit the website, see horrible text (because designer expected everyone to use high DPI screen or specific rasterization/hinting back-end), click on the icon to disable fonts, and then, yes, I am able to read the text. Which is the only reason I am on this page. Not even the slightest thought about page design appears in my head, just temporary irritation from the obstruction.
But you do realise that you’re part of a very small, albeit vocal, minority here? Most people actually do value a coherent visual design, which can be and repeatedly has been proven in studies and A/B testing. This holds true, whether you like it or not.
True, but I believe the point is that the author is willing to sacrifice this for speed and privacy. Many who are privacy-conscious generally don't care about design and are prioritized on functionality and data safety. That's not to say design isn't important. I love apps and sites that follow fluid and modern UX, I just see it as second underneath privacy.
Some of the most memorable things I've read over the past year have been on Gemini which falls back to the system font or one picked by the user. I'm not saying that there's no place for design, but if your choice of webfont is a single point of failure within it you have no business calling yourself a designer.
they do have the advantage of being easy to recolor even as an external resource. I personally don't use them and instead use SVGs and there's always the decision of whether to add a bunch of inline svgs, which you can do cool effects and even transitions on for hover effects or light/dark mode, or using external images, which are nicer in terms of separation of concerns, re-use without having to update multiple places and not having graphics buried in the source code somewhere. It would be cool if we could even just have a simple CSS filter that replaces all non transparent parts of an externally embedded image with a single color.
of course there's other benefits like just having to load one file for all your icons, although the tradeoff is also that fonts are messier to update if you're doing custom stuff and not just fontawesome
It's a normal user modifiable choice in the browser. You're just making your webapp much less usable for users who have made that choice. And for no reason, because SVG icons work just fine and are even more flexible. Font icons are basically a hack. They have terrible fallback behavior.
https://codeberg.org/nobody/LocalCDN/
More complete lists can be found in the source code, there are a lot of them:https://codeberg.org/nobody/LocalCDN/src/branch/main/core/ma...
https://codeberg.org/nobody/LocalCDN/src/branch/main/core/re...
Firefox has this setting built-in, gfx.downloadable_fonts.enabled and browser.display.use_document_fonts, but AFAIK it's not configurable via GUI by default.
Chrome hides it even deeper in a command-line option, --disable-remote-fonts
Deleted Comment
I suppose you could argue that many users can be uniquely identified either way but it’s no doubt a strong additional piece of info.
Unless, of course, we talk about any site that uses Cloudflare, which is a first party tracking service built into into the web server itself.
Arguably that single boolean characteristic (“fonts disabled”) is way less info than the dozens of characteristics you expose when fetching a font.
Is it possible to spoof information like that in a browser without reprecussions though? I don't think I've seen any extensions to spoof things like this, just settings to block the gathering of data in the first place.
Also, title likely needs a "(2016)"
https://www.localcdn.org/test/fontawesome
https://github.blog/2016-02-22-delivering-octicons-with-svg/
That likelihood is relatively low (though not as low as JS CDNs). Modern browsers explicitly forbid sharing cache entries across websites; so the likelihood is zero now.
>There are some privacy concerns when your browser makes the link to the font network’s domain. While they deny the practice, these services have the ability of profiling your browser (using browser fingerprinting with your IP address and HTTP referer header) to track what sites you visit, building a valuable profile about you that they could sell to marketers.
Also, if you're in the EU, this constitutes an illegal GDPR data export if the company running the CDN has any amount of American ownership.
My personal opinion is that instead of blocking Google Web Fonts, we should have an extension with the entire Google Web Fonts library preloaded in it, that transparently redirects every font lookup to its local cache. This neatly fixes the privacy problems and makes all CDN fonts load super fast.
so that's just called installing fonts!
I think the idea of web fonts is so that new fonts could be added and a user doesn't have to do something local to the browser.
And this feature costs privacy. If people really understood the implications of loss of privacy, they would not want it. However, most people don't, and would gladly swap privacy for features (and then in the future complain about it when the implications becomes real or affects them).
Also, there's no particular reason why webfonts need to cost privacy. The only reason to ever hotlink Google Fonts was to either...
- Accelerate load times (which is dubious)
- Be slightly easier to implement for lazy developers
Google Fonts are all freely licensed and specifically allow you to rehost them. All you have to do is download the TTFs and link to them in a @font-face declaration.
Adobe Fonts are the ones you can't self-host, because the actual CDN is a vehicle for calculating and charging a licensing fee. The privacy risk is deliberate, in this case - font owners need to know how many pageviews sites are getting so they can be charged the correct amount. Even then, this is something that could be done by having each site report their own usage statistics... except then the font vendors have to trust you, and they don't want to do that.
Even a decade ago when this was common practice, it was absolutely pointless because Google Fonts used to (still does?) set a cache time of only 2hrs.
>That likelihood is relatively low
That likelihood was never high, and obviously so, I have no idea why it gets parroted so much. And even if it was true, I could have shown up to your website with jQuery and bootstrap cached, but oops it was a different free cdn so cache miss.
The only thing you had a high likelihood of is customers noticing your website was slow without knowing its just your poorly chosen free cdn being temporarily over capacity.
https://www.myfonts.com/collections/neue-helvetica-font-lino...
By blocking all web fonts and fallback to only system font, you may still be able to read the text, but will completely missed the design.
A webpage is a bunch of text, if your webpage can't be read with something like "font-family: Verdana, Arial, sans-serif;" then you are doing it wrong.
With modern web "application", the chances you see a bunch of text would either be the T&C page, documentation you read, or news website.
These days we shop online as much as we do physically, so I pick two random clothing brand, Uniqlo and Levis. To create the same experience you shop online as you do offline. These two websites employ their font instead of system font, Uniqlo Pro and Helvetica Now.
From a function point of view, blocking those font does not stop you from buying their clothes. But part of the user experience will be lost.
Disclaimer, I am engineer in the media industry and has no association with the two example websites.
If your designer can't make your website work well with one of the hundreds of fonts preloaded on my machine, I don't know what to tell you. If your website looks like crap because your designer couldn't come up with a good fallback font that's still on the designer.
It's like "web colours" all over again. Web designers should work within the constraints of the user agent or they shouldn't design for the web, and one of those constraints is that the font doesn't always look exactly like the designer wants it to look. It's called a user agent for a reason, these days more and more because the source it's rendering is as anti-user as can be.
I have web fonts turned off because I'm sick of text shifting because the particular Arial-but-not-really font a website insists on got loaded in. I've also occasionally had to use reader mode because the "design" was very fancy but practically unreadable.
Does anybody apart from designers actually care?
That's why I disable thirdparty fonts by default and bug our designers when some text overflows in our app, due to some fixed width assumption in CSS, because system native font they did not design for is wider.
Deleted Comment
this has always been the case html provides __suggestions__ css and what not let me interpret those suggestions as I will.
If you want to curate your design experience put it in a pdf for your fanbase and leave my day to day browsing out of it.
So you'll keep everything that matters and throw out the stuff that doesn't. Got it!
My browser, my connection, my rules.
Sample post: https://alokgovil.com/understanding-self-reliance/
It's using just Arial and Times New Roman.
Dead Comment
"I see no reason for fonts, so they must serve no real purpose."
of course there's other benefits like just having to load one file for all your icons, although the tradeoff is also that fonts are messier to update if you're doing custom stuff and not just fontawesome
https://0x0.st/oOUq.png (nullprogram.com)
https://0x0.st/oOUb.png (https://developer.android.com/training/basics/firstapp)
As someone has already pointed out, unlike web fonts, SVGs can be used as inline resources.
It's not just icon fonts though, using web fonts themselves can lead to bad design practices.
https://microblog.ayushnix.com/font-weight-insanity/
It's a normal user modifiable choice in the browser. You're just making your webapp much less usable for users who have made that choice. And for no reason, because SVG icons work just fine and are even more flexible. Font icons are basically a hack. They have terrible fallback behavior.