What is a Web Font? The Difference between a Web Font and Desktop Font

A web font can be defined as a font which web designers employ on their websites as primary content font and indicate through CSS the defined parameters so that web browsers can use these instructions to download the same web font files from an origin, remote web hosting server or nearby CDN, to display (render) text on any web page of the website. Examples of web fonts include Lato, Montserrat, IBM Plex Sans and Poppins.

Web Fonts working group defines web fonts in these words:

“Web fonts are fonts which are referenced from a stylesheet, automatically downloaded on demand by the browser, used to render a web page, but are not installed on a system.” [RD]

What is a Web Font? The Difference between a Web Font and Desktop Font

In website building platforms – Wix, GoDaddy, Squarespace – designers are not required to declare CSS stacks, rather they simply select their primary font from the list and all technical work is handled by the platform.

Fonts which are pre-installed on operating systems (computers, mobile phone devices), are technically not called web fonts, rather these are called system fonts or installed user interface fonts. System fonts which are commonly available on MOST devices are also called web safe fonts.

Some system fonts are also available to web designers to be used as primary web fonts such as Roboto and Arial. To explain, suppose your website primary content font is Arial, when an end user/viewer, open your website on Windows or iOS device, browser does not download Arial and use instead installed Arial font. However, when a user opens your website on an Android device, browser have to download Arial font from your website hosting server. For example, Squarespace and GoDaddy provide you Arial, and Roboto fonts for your website. On the other hand, many system fonts such as Segoe UI are not available for web designers to be used as primary web font.

We have defined a web font but what is a font?

A font consists of characters (glyphs), which have mutual design similarity and consistency, to render a text on screen and characters include alphabets, numbers, punctuation marks, symbols and emojis. A single font may contain glyphs to support one or more scripts.

An IBM document explains web font in following words. [RD]

“Web font information may include fonts that are not installed on a user's computing device.”

Explore more articles about Fonts, or visit Home Page of Dozro website.

Irfan Hayat

As the Founder and CEO of DOZRO and various other ventures, I bring a wealth of diverse life experiences to the forefront. At heart, I am a passionate tech enthusiast. Feel free to explore our range of Pro Services, such as website and graphics design, SEO, and video editing, with confidence.

https://www.dozro.com/irfan-hayat
Previous
Previous

Web Fonts – Pros and Cons

Next
Next

Best FONT for writing RTL languages – Arabic, Urdu, Persian, Sindhi, Pashto – in Canva, Windows 10, MS Word and Google Docs