Google Fonts
Checks that fonts are not loaded from Google's servers.
Google Fonts is a free service that Google provides to developers. It is a very convenient source of web fonts that can be quickly added to a webpage to customize the typography. Google suggests that you install the fonts by copy and pasting a few link tags into the <head> section of your webpage. The fonts will be loaded directly from Google's servers and will be available to use in your CSS.
This is great for development and testing, but it comes with two drawbacks when used in production.
- Google sees all of your visitors, which has privacy implications for your users.
- The browser must do extra DNS queries to fetch the fonts, which makes it a little slower.
Once you move to production, you should be self hosting your web fonts. This makes your fonts load faster, and it prevents Google from eavesdropping on your visitors. This is fairly easy to implement. Here are the simple instructions, but we encourage you to research this because there are opportunities to optimize the fonts based on the character set that you require.
- Download the fonts to your computer. These will be in the TrueType format (.ttf).
- Convert these to the .woff and .woff2 file formats using any number of applications or online converters.
- Upload these files to your server.
- Add a @font-face declaration to your CSS file that points to your new self-hosted fonts.
For a more in-depth report on why and how to self-host fonts, please read our article, Why You Should Self Host Web Fonts.
Ready to validate your website for this test and 100+ others?