[HowTo] Use Google Web Fonts in your webpage

Designing a website today is not such a cumbersome process, thanks to the advent of tools such as Adobe Dreamweaver and open source blogging tool and content management system such as WordPress. Beautiful and sophisticated websites can be built, but someday you may feel wanting for a change from the same old fonts that have been used in the web world for ages.

Google Web Fonts is a large collection of fonts which can be used by you in your website or on your desktop applications such as Microsoft Office Word. The following tutorial will guide you through simple steps for making use of Google Fonts on your webpage.

Step 1: Go to Google Web Fonts page. Click on the “Start choosing fonts” button.

Step 2: You will be taken to a page where you can select the font which matches your specification. The steps to do that are illustrated below.

You can test the font being displayed, on a single word, a sentence or on an entire paragraph. Just below that you also have the option to provide your own word, sentence or paragraph.
You can set the size of the font and also sort the font on basis of different options such as Trending, Date, Popularity etc.
You can search for a particular font if you already know the name of the font.
You can also filter your search on basis of categories such as Serif, handwriting etc or on basis of the degree of thickness, slant and width
The quick use option will take you to the next step if you are using only one font. Pop out gives an elaborate view of the font, in detail.
If you are planning to use multiple fonts, just add them to your collection.
You can bookmark your collection for later use and also download them on to your desktop for using with your desktops apps such as Microsoft Office Word.

After selecting the required fonts, click on the review button on the bottom right of the screen.

Step 3: You get to review your selected fonts in this section.

As you can see, you have several options on the top left part of the screen. You can use these options to subjectively test your fonts to check whether they are they are the right fonts for your need. After you have selected your fonts, press the use button on the bottom right part of the screen.

Step 4: Final step asks you one last time about the fonts that you need and it shows you the page load that may occur due to the fonts. It also guides you through the steps for using the fonts in your webpage.

Finally choose the fonts that you are really going to use, as unnecessary fonts may cause more page load.

Choose the character sets you want, avoid using unwanted character sets. It also gives you a link which you have to embed between the <head> tag of your webpage.