Fonts have a significant impact on a website's overall aesthetic appeal. The right message will be communicated to the visitors and trademark consistency will be established with the help of a carefully chosen typeface. A excellent online font should be clear and safe for the web, which means that it should display properly on a variety of devices, web browsers, and operating systems.
On the other hand, selecting the right typeface is not always easy. There are many fonts that look stunning but aren't suitable for use on the web. For the record, the typefaces that are pre-installed on the majority of operating systems are considered web-safe. This ensures that the fonts display correctly on all platforms and web browsers.
For example, Arial, Times New Roman, and Helvetica are some of the most popular web-safe typefaces.
What's wrong with Google Fonts, exactly?
Google Fonts (formerly known as Google WebFonts before June 2013) is a computer font and web font service owned by Google. This includes free and open source font families, an interactive web directory for browsing the library, and APIs for using the fonts via CSS and Android.
Popular google Fonts include Roboto, Open Sans, Lato, Oswald, Montserrat, Source Sans Pro, and Raleway. As of February 2023, Google Fonts had 1,482 font families, including 288 variable font families.
According to trends.builtwith.com, Google Fonts is used by more than 60 millions websites.
BUT
In January 2022, a German court ruled that a website using Google Fonts violated the European Union General Data Protection Regulation (GDPR) by passing personally identifiable information (IP address) to Google without the user's consent or a legitimate interest in doing so.
A 100€ fine was imposed on the website. The Munich court was obviously trying to lead by example. They even mentioned that if the website operator doesn't comply, the subsequent penalties will be 250.000 euros.
If you didn't know, Google Fonts are used by millions of websites, and the organization that runs the well-known search engine uses this free tool to gather user data without their permission. That is what we refer to as a dark pattern.
By using Google Fonts, the Terms of Service that specifically applies is for the Google API because you usually embed the fonts with <link> or @import into your CSS one of these URLs: fonts.googleapis.com or fonts.gstatic.com.
The APIs are designed to help you enhance your websites and applications (“API Client(s)”). YOU AGREE THAT GOOGLE MAY MONITOR USE OF THE APIS TO ENSURE QUALITY, IMPROVE GOOGLE PRODUCTS AND SERVICES, AND VERIFY YOUR COMPLIANCE WITH THE TERMS. This monitoring may include Google accessing and using your API Client, for example to identify security issues that could affect Google or its users.
Google APIs Terms of Service
This could not be a big deal, depending on your project or the requirements of your client. Or your personal beliefs or the people you trust. Instead, consider your internet and privacy policies.
Yet I am certain that we must be aware of this. And, if you are not already aware of this dark pattern when using web fonts, keep on read this article.
What are the options to be GDPR compliant?
If your Joomla site is using Google Fonts, you have 3 options:
Host the fonts locally: Download your fonts from Google Fonts website directly and host the files locally.
Keep using Google Fonts and ask your users for consent: You must obtain your users' permission before transferring their data to Google. Create a Data Processing Services (DPS) Consent Banner that includes Google Fonts as one of the DPS. Additionally, you need to get your user's consent before using the Google Font service. Typeface files should never be delayed.
Loading fonts from external sources might be against privacy regulations in some countries. Loading fonts from a local folder might have a performance impact on your site.
Use a GDPR compliant fonts service: Perhaps you are unaware that there are more than 25 Google Fonts alternatives, including websites and apps for different operating systems including Android, iPhone, Android Tablet, and iPad. Services like Font Squirrel, Font Library, dafont.com, Adobe Fonts, and Fonts.com are undoubtedly already familiar to you.
Just consider whether the ease of Google Fonts outweighs the cost of protecting your data and your privacy.
How to add a GDPR compliant font in a Joomla template?
Great, you've decided to stop using Google Fonts!
If you're not a developer and you don't know how to change some lines of code in the files of your Joomla template, we've wrote this tutorial to show you how to add a GDPR compliant font to Joomla.
And you'll see, it's incredibly easy.
Now, it's time to talk about a kind bunny: bunny.net.
Bunny.net is a Slovenian company launched in 2014 with a simple idea: helping developers deliver content without breaking the bank. From there, the idea of influencing the internet took on a far grander scope. Numerous web services are provided by Bunny, like CDN, hosting, and... fonts. Naturally, all of these fonts are completely GDPR compliant and free.
In this tutorial, we gonna replace the famous Roboto with Open Sans which is a very similar option. Note in that case, Bunny uses the Google API but without any tracking.
Pick your style and select font weights and styles that best fit your website design, layout, and branding by clicking "Add variant" buttons
Generate the CSS by clicking the "Font +" button on the top of the page to generate the CSS @import or HTML <link> tag.
Open your Joomla backend, navigate to System > Site Templates and select your template.
Open your user.css or your custom.css file located in the CSS folder of your Joomla template and paste the code generated below. Finaly, we add some rules to apply the new font to the body and to the titles of the website:
Save and close your user.css or your custom.css file.
Before closing your Joomla backend, control that your Joomla template doesn't loading any external fonts.
Congrats, you're done!
Wrapping up
Utilizing an HTML web font ensure that your site looks the same on all devices. Additionally, depending on the font used, it will add to the website's official, elegant, or professional appeal. Keep in mind that each typeface has its own personality, so select one that is both legible and indicative of your business.
In this tutorial, you've learnt why using Google Fonts on your Joomla website could be an issue, some useful tips to protect your users's privacy and you read about how to add a GDPR compliant font to your Joomla template.
At templatejoomla, we hope that Joomla and template developpers will drop down the Google Fonts service because the users's privacy is really important and because there are reliable free GDPR compliant options available.
Fonts have a significant impact on a website's overall aesthetic appeal. The right message will be communicated to the visitors and trademark consistency will be established with the help of a carefully chosen typeface. A excellent online font should be clear and safe for the web, which means that it should display properly on a variety of devices, web browsers, and operating systems.
On the other hand, selecting the right typeface is not always easy. There are many fonts that look stunning but aren't suitable for use on the web. For the record, the typefaces that are pre-installed on the majority of operating systems are considered web-safe. This ensures that the fonts display correctly on all platforms and web browsers.
For example, Arial, Times New Roman, and Helvetica are some of the most popular web-safe typefaces.
What's wrong with Google Fonts, exactly?
Google Fonts (formerly known as Google WebFonts before June 2013) is a computer font and web font service owned by Google. This includes free and open source font families, an interactive web directory for browsing the library, and APIs for using the fonts via CSS and Android.
Popular google Fonts include Roboto, Open Sans, Lato, Oswald, Montserrat, Source Sans Pro, and Raleway. As of February 2023, Google Fonts had 1,482 font families, including 288 variable font families.
According to trends.builtwith.com, Google Fonts is used by more than 60 millions websites.
BUT
In January 2022, a German court ruled that a website using Google Fonts violated the European Union General Data Protection Regulation (GDPR) by passing personally identifiable information (IP address) to Google without the user's consent or a legitimate interest in doing so.
A 100€ fine was imposed on the website. The Munich court was obviously trying to lead by example. They even mentioned that if the website operator doesn't comply, the subsequent penalties will be 250.000 euros.
If you didn't know, Google Fonts are used by millions of websites, and the organization that runs the well-known search engine uses this free tool to gather user data without their permission. That is what we refer to as a dark pattern.
By using Google Fonts, the Terms of Service that specifically applies is for the Google API because you usually embed the fonts with <link> or @import into your CSS one of these URLs: fonts.googleapis.com or fonts.gstatic.com.
The APIs are designed to help you enhance your websites and applications (“API Client(s)”). YOU AGREE THAT GOOGLE MAY MONITOR USE OF THE APIS TO ENSURE QUALITY, IMPROVE GOOGLE PRODUCTS AND SERVICES, AND VERIFY YOUR COMPLIANCE WITH THE TERMS. This monitoring may include Google accessing and using your API Client, for example to identify security issues that could affect Google or its users.
Google APIs Terms of Service
This could not be a big deal, depending on your project or the requirements of your client. Or your personal beliefs or the people you trust. Instead, consider your internet and privacy policies.
Yet I am certain that we must be aware of this. And, if you are not already aware of this dark pattern when using web fonts, keep on read this article.
What are the options to be GDPR compliant?
If your Joomla site is using Google Fonts, you have 3 options:
Host the fonts locally: Download your fonts from Google Fonts website directly and host the files locally.
Keep using Google Fonts and ask your users for consent: You must obtain your users' permission before transferring their data to Google. Create a Data Processing Services (DPS) Consent Banner that includes Google Fonts as one of the DPS. Additionally, you need to get your user's consent before using the Google Font service. Typeface files should never be delayed.
Loading fonts from external sources might be against privacy regulations in some countries. Loading fonts from a local folder might have a performance impact on your site.
Use a GDPR compliant fonts service: Perhaps you are unaware that there are more than 25 Google Fonts alternatives, including websites and apps for different operating systems including Android, iPhone, Android Tablet, and iPad. Services like Font Squirrel, Font Library, dafont.com, Adobe Fonts, and Fonts.com are undoubtedly already familiar to you.
Just consider whether the ease of Google Fonts outweighs the cost of protecting your data and your privacy.
How to add a GDPR compliant font in a Joomla template?
Great, you've decided to stop using Google Fonts!
If you're not a developer and you don't know how to change some lines of code in the files of your Joomla template, we've wrote this tutorial to show you how to add a GDPR compliant font to Joomla.
And you'll see, it's incredibly easy.
Now, it's time to talk about a kind bunny: bunny.net.
Bunny.net is a Slovenian company launched in 2014 with a simple idea: helping developers deliver content without breaking the bank. From there, the idea of influencing the internet took on a far grander scope. Numerous web services are provided by Bunny, like CDN, hosting, and... fonts. Naturally, all of these fonts are completely GDPR compliant and free.
In this tutorial, we gonna replace the famous Roboto with Open Sans which is a very similar option. Note in that case, Bunny uses the Google API but without any tracking.
Pick your style and select font weights and styles that best fit your website design, layout, and branding by clicking "Add variant" buttons
Generate the CSS by clicking the "Font +" button on the top of the page to generate the CSS @import or HTML <link> tag.
Open your Joomla backend, navigate to System > Site Templates and select your template.
Open your user.css or your custom.css file located in the CSS folder of your Joomla template and paste the code generated below. Finaly, we add some rules to apply the new font to the body and to the titles of the website:
Save and close your user.css or your custom.css file.
Before closing your Joomla backend, control that your Joomla template doesn't loading any external fonts.
Congrats, you're done!
Wrapping up
Utilizing an HTML web font ensure that your site looks the same on all devices. Additionally, depending on the font used, it will add to the website's official, elegant, or professional appeal. Keep in mind that each typeface has its own personality, so select one that is both legible and indicative of your business.
In this tutorial, you've learnt why using Google Fonts on your Joomla website could be an issue, some useful tips to protect your users's privacy and you read about how to add a GDPR compliant font to your Joomla template.
At templatejoomla, we hope that Joomla and template developpers will drop down the Google Fonts service because the users's privacy is really important and because there are reliable free GDPR compliant options available.
