HTML and CSS Reference
tinue to download the file by clicking the link Download the font families in your Collection
as a zip-file.
When prompted, choose a location on your computer to save the zip file, then find the file
and unzip it. Once unzipped, there'll be two different folders: one for Chelsea Market, and the
other for Lato. In the Chelsea Market folder there's only a single TTF font file, so let's start
We want to take that file and use it to produce three additional font files, and we can do so
using another free service, this one provided by FontSquirrel. It's called the Webfont Gener-
ator, and it's very easy to use.
Go to the Webfont Generator URL and click the button that says Add Fonts.
When we click that button, we'll be prompted with a system file dialog, asking us to add a
font. Navigate to the font collection we downloaded from Google Web Fonts, find the TTF
font for Chelsea Market, and select it to be uploaded.
Now we'll repeat the process for the Lato font, again clicking the Add Fonts button and then
navigating to the Lato folder. This time, there'll be ten different TTF font files. We don't need
them all, so select only the ones called Lato-Regular.ttf and Lato-Bold.ttf. Once all three files
are added, the Webfont Generator page should look as shown in Figure 4.7 .