Why do we even need to deal with webfonts and its various formats? I have enough pretty, cool fonts!
The issue isn’t about how many awesome fonts you used when you developed your perfect web page but whether all your users have the same fonts. In all likelihood, they don’t (unless the fonts are ubiquitous)! So, the perfect sizing and alignment on your screen may not be what your users see. And that is quite disturbing and unnerving.
That’s where the webfont idea comes in to exactly address that problem. By using webfonts you ensure that all your users are getting the fonts from your server instead of trying to use substitutes from their local devices.
The process works this like: You get/license the fonts you use. Upload them to your server. Create a stylesheet that names and “links” to those fonts and actual font files.
e.g.
<!-- wp:paragraph -->
<p><code>@font-face {<br>font-family: 'abduction3';<br>src: url('abductioniii-webfont.woff2') format('woff2');}</code></p>
<!-- /wp:paragraph -->And in the web page, you link to that stylesheet. e.g.
<link rel="stylesheet" href="mystylesheetexamples.css" type="text/css" charset="utf-8" />and use that font-family in your web page. e.g.
<body style="font-family:'abduction3';">The following texts are using specialized fonts to render them exactly although you most likely do not have them.
The most common format for webfonts in use today are WOFF, WOFF2 (both are web open font format but version 2 can embed licensing information right into the font), although OpenType (OTF) and EOT (embedded OpenType) fonts are also popular. The fonts shown above are OTF, WOFF, and WOFF2.
For gaming, and other applications, most development environments will allow you to you embed the font directly into the application so the users will have the custom font(s) along with the application.
Hope you found this blog interesting.
Interested in creating programmable, cool electronic gadgets? Give my newest book “Hello Arduino!” a try: https://www.amazon.com/Tony-Rahman/e/B09BY6SW2P
