Patrick's CMS

Fonts and font styles

To display text consistently in all browsers anywhere in the world superMicro CMS uses Google Fonts. It means the system does not normally use fonts installed on visitors' own computers, tablets, mobile phones or anything else. Instead they are downloaded along with the pages.

The fonts are:

(1) Open Sans Latin font-weight: 400 (regular and italic) and font-weight: 600 (regular and italic). Open Sans is used in all previous versions. It's an excellent all-round font in my opinion and displays well at all sizes.

(2) Ubuntu Latin font-weight: 500 (regular only). Ubuntu is used only for page headings.

Version 3.11 includes a font folder containing the required font files in woff and woff2 format. These are 'self-hosted', do not rely on downloading anything from Google Fonts and should be suitable for all modern browsers.

However, there is an option in 'Setup' to switch from self-hosted to Google Fonts itself. Either way, they are downloaded but one may be faster than the other. You can switch from one to the other at any time, depending on which seems fastest. In my experience there isn't much difference except that if you have installed the system on localhost and are not online, then use 'self-hosted'.

The fonts are specified by the system in the stylesheet files /css/common-h.css (self-hosted) and /css/common-g.css (direct from Google Fonts). The 'switch' simply switches the active file.

To change the fonts entirely (not recommended) you will need to edit those two files manually and upload them again – and probably edit some of the font size rules in the other stylesheets, experimenting to get it right (that's why it isn't recommended).

You can test a different font by adding @import url('font URL'); to extra.css in admin and overriding the default styles with, for example:

body {
  font-family: "Selected Font", sans-serif;
}

Get the desired 'font URL' from Google Fonts.

Other considerations

With the Google Fonts Open Sans Latin option, several more font files are provided than with the self-hosted option. As well as Latin they include Cyrillic, Greek and Vietnamese variants and each one includes the 'extended' version, making 28 files in total.

The Open Sans hosted option has only four, but fonts from Google's content delivery networks (CDNs) are more likely to be already cached (stored) in a visitor's browser so do not need downloading again, plus unless a font variant is specified for a page it won't actually be downloaded. It's swings and roundabouts depending on the circumstances.

There are potential privacy and security implications by using external resources you don't control (eg: Google Fonts) but that's just in principle – the actual risk may be low. For more information it's worth reading this article by Anna Monus.

Information

Page last modified: 06 December, 2022