Using Google Web Fonts and @font-face
With the advent of the @font-face
support across browsers, you can use custom fonts from services such as Google Web Fonts (https://www.google.com/fonts/) in your Magento theme.
Including Google Web Font in your store's theme
Once you have selected a font to use, copy the code that Google Fonts provides to embed the CSS, which will look something like the following:
<link href='//fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'>
Navigate to System | Configuration in your Magento store's administration panel and paste this in the Miscellaneous Scripts field, which is in the HTML Head panel under the Design tab, as shown in the following screenshot:
Click on the Save Config button at the top-right corner of the screen to save this change.
This step ensures that the font is available to be used in your theme; the next step is to use the font in your theme's style sheets.
Google's Web Font performance is okay for desktop visitors...