Fonts
Added
I learned a nifty little trick today. I have always though it would be a good idea to have the fonts local. I kind of hate third party calls on the web. Somewhere in the back of my head I think that everything pertaining to a webpage, like stylesheets, scripts, images, etc, should be on the local device. You know, under the hood. A car doesn't need to send out for a carburetor after all. If it did the car might be kind of on the slow side. I might be wrong but I think this will speed up a page and maybe keep from pounding the internet so hard. If that makes any sense.
Anyway, the font for this page was found at Font Library. Yesterday, I noticed at the top right of the page that there was a download link for the fonts. Ok COOL! Now what?!
I ventured over to our beloved StackOverflow and found this little gem.
Basically, all I did was:
- 1. Download the zip file.
- 2. Created a "fonts" directory in the directory where my website lives
- 3. Unzip the downloaded file into the fonts directory
- 4. Added these lines to my CSS file (NOTE: the names and folder locations are specific to my
setup and fonts, probably not yours):
@font-face { font-family: "GlacialIndifference"; src: url('../fonts/GlacialIndifference/WEB/GlacialIndifference-Regular.woff2'); }
@font-face { font-family: GlacialIndifference; font-weight: bold; src: url('../fonts/GlacialIndifference/WEB/GlacialIndifference-Bold.woff2'); } - 5. Commented out the link in the header of my HTML file that allows the browser to go pick up the font online.
After that, for grins and giggles I turned off the internet and checked to see if it worked. IT DID!
I have seen the "@something" tag in a couple of CSS files that I have perused but I didn't know what it was for. Now I have a whole nuther rabbit hole to plumb.
Post Script: Not sure why but the font reverts to TimesNewRoman on the Fastmail site. I might move this over to github and see what it does there.
Home