From the course: Choosing and Using Web Fonts
Unlock the full course today
Join today to access over 22,400 courses taught by industry experts or purchase this course individually.
Using Font Squirrel to create an @font-face kit
From the course: Choosing and Using Web Fonts
Using Font Squirrel to create an @font-face kit
So now that we've downloaded the three free Web fonts from Fontspring, let's open them up and take a look at them. In my Downloads folder, I can see that my zipped files have already opened and let's look at Museo Sans 500. Inside I have the license for the font and the OpenType format file. In a folder called web fonts, I have the @font-face license and a file on how to use these fonts. Then I have this other folder. In this folder, I have a demo and I have four different Web font files. I have the EOT, which is for Internet Explorer 9 and earlier; the SVG, which is for early versions of iPhones and iPads; the TTF, which is a raw TrueType file that most of the other browsers use; and last, we have the WOFF, which is a Web-Only Font Format. It's the emerging standard for the last year or so, so many of the newest browsers use WOFF. There's also a folder for the specimen files and these support the demo up here. Now let's go ahead and open up that demo. I always open up the demo file…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
-
-
-
-
-
-
-
-
Identifying a Geometric Sans Serif font2m 51s
-
Choosing a Geometric Sans Serif font4m 33s
-
Downloading a free font licensed for use on the web3m 53s
-
Using Font Squirrel to create an @font-face kit5m 12s
-
Adding the @font-face syntax to the CSS2m 57s
-
Implementing the font family in the CSS5m 29s
-
Changing styling as necessary to improve the readability of the text3m 56s
-
Looking at how using a Geometric Sans Serif font affects the look and feel of a web page2m 32s
-
-
-
-
-
-
-
-
-