Websites that use text have two main options for displaying it. Use a font that is available on the majority of user devices or use custom web fonts, which are not installed on a user’s device.
Custom web fonts, such as Google Fonts, give web designers more options when it comes to displaying text on websites, but they require visitors to download these fonts when they log in to the site. Caching is typically used to prevent fonts from being downloaded on every page visit.
For Internet users, the use of web fonts has two main disadvantages:
Performance is the most obvious, as a request must be made to the server hosting the font to download it. Although this is generally fast, it still adds to the loading time. Problems with the server can also cause loading issues on the site. Users with a tight bandwidth budget or very slow connections may benefit the most from blocking.
Privacy is the second. Since the requests are made to servers, for example the Google servers that host the company’s fonts, information such as the IP address is automatically submitted. Not all organizations that host web fonts use the information to track users, but it’s always possible that it could happen.
Google, for example, strong points the following in the terms:
APIs are designed to help you improve your websites and applications (“API Client(s)”). YOU AGREE THAT GOOGLE MAY MONITOR USAGE OF THE APIS TO ENSURE QUALITY, IMPROVE GOOGLE PRODUCTS AND SERVICES, AND VERIFY YOUR COMPLIANCE WITH THE TERMS. This monitoring may include Google’s access to and use of your API client, for example to identify security issues that may affect Google or its users.
Because many sites use web fonts, widely used fonts can provide organizations with additional information about a user’s activity on the Internet.
Blocking web fonts can cause display issues on some sites. Sites that rely solely on web fonts, without having fallbacks in place, may not display correctly.
Find out if a site uses web fonts
It’s relatively easy to tell if a site is using web fonts.
- Open the browser’s developer tools with the shortcut Ctrl-Shift-I. You’ll also find it in the main menu, usually under More tools.
- Switch to the Network tab.
- Activate the font filter.
- Load the site in question and watch the list.
How to Block Web Fonts
Web fonts can be blocked in several ways, depending on the browser used.
Firefox users can set the gfx.downloadable_fonts.enabled and gfx.downloadable_fonts.woff2.enabled preferences to false to block downloadable fonts in the browser.
The browser has another setting that may be useful. Introduced in Firefox 41, it allows Firefox to set specific fonts for visited websites.
- Load about:preferences#general in the browser address bar to get started.
- Scroll down to the Fonts section and select the Advanced button.
- Uncheck “Allow pages to choose their own fonts, instead of your selection above”. You may need to scroll down to see the option.
- Select OK.
Users of the uBlock Origin content blocker can add a single custom line to it to block web fonts. Open the settings, go to My filters and add the line *$font,third-party. Select Save and you’re ready to go. The content blocker includes an even stricter option, which blocks all remote fonts. To enable it, select “Block remote fonts” in the extension settings. Sites that display incorrectly can be excluded from blocking.
This blocks the use of web fonts on third-party sites only. Proprietary sites are still allowed to upload them.
Another option is to use a list of predefined anti-fonts, which you will find here. Simply import it into your content blocker of choice to block the majority of web fonts available on third-party sites.
Now you: how do you handle web fonts? Are you concerned about them? (Going through collinbarret)