Using custom web fonts can increase download time of your web pages. It's a good idea to not use too many and limit to the main headings, page titles and so forth.
In this example we will use the font Dancing Script and apply it to our Heading 2 (H2) tag.
- First go to http://www.google.com/webfonts
- Find the font you want, and select Use.
- Google will give you the following code to use on your website, the one below is for the font Dancing Script.
Add the code for your font to your Website > HTML HEAD
<link href='http://fonts.googleapis.com/css?family=Dancing+Script' rel='stylesheet' type='text/css'>
Then in the CSS add in the styles for the Google Font:
Example:
/* Applies formatting for Heading 2*/
h2 {
margin: 0 0 15px 10px;
font-family: 'Dancing Script', serif;
font-size: 41px;
font-style: normal;
font-weight: 400;
text-decoration: none;
text-transform: none;
letter-spacing: 0.061em;
word-spacing: 0.115em;
line-height: 1.11;
}
Overview
Content Tools