Typography in websites is arguably more important than other design elements since type is the one thing that is consistently rendered across different browsers.

Google Fonts

In general typography in Helix Ultimate templates is mainly based on Google Fonts collection (850+ fonts). With so many unique fonts to use, you're bound to find something you like! This settings area allows you to easily choose font(s) from the Google Font Directory to your Joomla! template.

The Google Fonts  is compatible with popular (and updated) browsers. They works reliably on the vast majority of modern mobile operating systems, including Android browsers and iOS 4.2+ (iPhone, iPad, iPod). Support for earlier iOS versions is limited.

You can also assign the Google Fonts to specific CSS elements (class) only.

All available Google Fonts are released under open source licenses. You can use them in any non-commercial or commercial project.

Only some of the fonts in the Google Font Directory support full range of subset - multiple scripts (like Latin, Latin Ext, Cyrillic, and Greek for example). Notice, not all fonts are fully support your native language diacritical marks (signs). Check it before complains.

GDPR/EU-DSGVO/Privacy Policy and Google Fonts

By new law is not allowed, to collect private data from your website visitors without permission.

Google Fonts is a service provided by Google Inc. from USA. There is no doubt that Google Fonts relies on the generic Google Privacy Policy. The Google Fonts API (used inside Helix Ultimate) is designed to limit the collection, storage, and use of end-user data to what is needed to serve fonts efficiently. Use of Google Fonts is unauthenticated. No cookies are sent by website visitors to the Google Fonts API. Requests to the Google Fonts API are made to resource-specific domains, such as fonts.googleapis.com or fonts.gstatic.com, so that your requests for fonts are separate from and do not contain any credentials you send to google.com while using other Google services that are authenticated, such as Gmail. The use of Google Web Fonts follows from interest in a uniform and appealing online presentation of services. This represents a legitimate interest within the scope of Article 6 (1) 1 lit. f GDPR. With regard to the transfer of personal data to the US, Google has submitted to the EU-US Privacy Shield, https://www.privacyshield.gov/EU-US-Framework. More information about Google Fonts and privacy can be found here: https://developers.google.com/fonts/faq#what_does_using_the_google_fonts_api_mean_for_the_privacy_of_my_users.

In general Google claims GDPR compliance. But if you feel that Google's explanations are not enough for law regulation in your country - anytime you can decide to:

1. Not use Google Fonts on your site, disable them from Typography settings, and use classic fonts (tip below).
2. Replace Google Fonts loaded from google servers to loaded from your server (tip about it you will find in FAQ section). Use google-webfonts-helper service which makes it easy to self-host any font from Google Fonts. If you embed them from your own server, everything in legal way would be OK again.

Arial, Verdana, Georgia..

Beside Google Fonts you can choose widely-supported cross-platform fonts: Arial, Tahoma, Verdana, Helvetica, Times New Roman, Trebuchet MS and Georgia. “Web Safe” fonts mean that they will look perfect no matter the browser you are viewing them from. Also, these fonts are very popular and pre-installed on operating system: Windows, iOS or Linux. They are not loaded during loading a website, no delays because of that. You can save bandwidth and keep fast loading pages.

Default Font

If none of Typography option will be enabled, the default fonts are used from Bootstrap 4. Helix Ultimate use “native font stack” for optimum text rendering on every device and OS. Default Font Family:

  // Safari for OS X and iOS (San Francisco)
  -apple-system,
  // Chrome < 56 for OS X (San Francisco)
  BlinkMacSystemFont,
  // Windows
  "Segoe UI",
  // Android
  "Roboto",
  // Basic web fallback
  "Helvetica Neue", Arial, sans-serif,
  // Emoji fonts
  "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !default;

This font-family is applied to the <body> and automatically inherited globally throughout Bootstrap 4.

Body

Enable or Disable using  Fonts integration. Which gives you the ability to assign default System Font (Arial, Tahoma, Helvetica, Georgia etc.) or the Google font to whole Body of your website. Choose Font Size, Font Weight, Style and Subset (for Google Fonts only).

Headings (h1-h6)

Enable or Disable using Fonts integration. Which gives you the ability to assign default System Font (Arial, Tahoma, Helvetica, Georgia etc.) or the Google fonts to specific Headings (h1-h6) used inside your website content. Choose Font Size, Font Weight, Style and Subset (for Google Fonts only).

Navigation

Enable or Disable using  Fonts integration. Which gives you the ability to assign default System Font or the Google font to main navigation of your website. Choose Font Size, Font Weight, Style and Subset (for Google Fonts only)

Custom

From here you can choose default System Font (Arial, Tahoma, Verdana, Georgia etc.) or Google Font for custom CSS Selectors (class, ID, element). A CSS selector can contain more than one simple selector. Just enable option, choose font settings and in  field below insert name(s) separated by comma.

Update Font List

This feature allows you to refresh the list of available Google fonts. So if there are any new ones, this button allows you to quickly update fonts with just one click, and they will be automatically added in to Helix Framework database. Which allows you to use them after update.

Since Google Fonts has implemented a recent usage restriction, you need to use your own Google Fonts API Key for uninterrupted operations. With Helix Ultimate v1.0.5 update, we’ve added a dedicated Google Fonts API Key insertion field to Helix Ultimate, so you can use the huge font collection more smoothly.