The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS [Solved] Some Questions Regarding @Font-Face/FontSquirrel Embedding…

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #161033
    Tom Houy

    I had a couple of questions regarding embedding web fonts on to a page using services such as FontSquirrel.

    1.) When creating web fonts with FontSquirrel’s tool, it creates multiple font file types, along with the code to include these in your CSS. Does the user’s browser download all of these variations, or only the one(s) it needs?

    2.) When dealing with font variations, how do we make sure the property values for “font-weight” match up to the proper font files? For example the Google web font “Alegreya Sans” has a total of 14 variations. If I were to use something like “p{font-weight:700;}”, how do I ensure it is pointing to the correct font file, assuming I embedded all 14 variations into my page? When I open the actual font file that it should be using, I don’t see any mention of “700” in it.

    1. Modern browsers seem to only load 1 version that it needs. Here is a post about it. An easy way to test this is to load the @font-face in a blank index file and open it with a browser, and check which files were loaded via the inspector. That’ll give you a definite answer.

    2. Google fonts allows you to select which sizes to include and tells you how to specify them in your css. Check their how-to page

    Tom Houy

    Perfect, thanks!

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.