CODEWITHSUNDEEP
htmlcssgoogle-font-api
Danish Adeel
Danish Adeel

Reputation: 730

Is it necessary to select font styling from google fonts?

I often use Google Fonts for my web, Is it necessary to select font weights and then add like this fonts.googleapis.com/css?family=Crimson+Text:400,700" or I can just select regular one family=Crimson+Text:400" and change it to bold/semi-bold with css ? Whats the difference ?

Upvotes: 1

Views: 375

Answers (1)

andrew
andrew

Reputation: 9583

Yes, its necessary to specify the weights.

Take a look at the css file you included fonts.googleapis.com/css?family=Crimson+Text:400,700

Here is what it contains:

/* latin */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 400;
  src: local('Crimson Text Regular'), local('CrimsonText-Regular'), url(https://fonts.gstatic.com/s/crimsontext/v8/wlp2gwHKFkZgtmSR3NB0oRJfbwhT.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 700;
  src: local('Crimson Text Bold'), local('CrimsonText-Bold'), url(https://fonts.gstatic.com/s/crimsontext/v8/wlppgwHKFkZgtmSR3NB0oRJX1C1GDNNQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

Notice in particular the lines font-weight: 400; and font-weight: 700;

These tell your browser which glyphs to use when that weight is selected, your browser cannot simply Bold or italicize your text based on weight, it needs to download and render the appropriate glyphs

Upvotes: 1

Related Questions