best google fonts

There are many options for a web designer to use beautiful fonts in a website, however many of them are not versatile and easy to implement and may not give expected results in different web browsers.

With over more than  600 font families Google web font is not only free but also very easy to use.

One can either simply use Google fonts with Html, css or JavaScript just by adding a piece of code, in next few minutes you will learn how to use them.

google fonts survey

This chart shows the global market share of technologies in the category Font Scripts. The current market leader is Google Font API.

 

How To use Google Font ?

Its really very easy to implement Google fonts.

Step 1. Launch Google font page pick up the font you think will suit your blog, then click on quick use.how to use google font

Step 2. Choose the type of font you want.

choose the font

Step 3. Copy the code as the first element in the <head> of your HTML document, click @import tab to integrate as Css or javascript to use as javascript. Note: This code connects with fonts located on the server.

add this website

 

Step 4. Integrate on Stylesheet, Add the font name to your CSS styles just as you’d do normally with any other font.

add to css

 

So now you know how to use them, lets view the list of best of Google fonts.

 

 

1. Open Sans

When it comes to Body text opens sans is the best choice, see the screenshot.

open sans font

 

 

Usage page

 

 

2. Roboto

roboto

Usage

 

3. Lato [Recommended for paragraph ]

Usage

Combination of lustiia and Lato can can be awesome

lato

 

4. Oswald [Recommended  for headlines, Titles]

Usage

oswald

 

5. Droid sans

Usage

droid sans

 

6. Ubuntu

Usage

ubuntu

 

7. Lobster Two

Lobster two is awesome if you need handwriting script in your website.

lobstertwo

 

8. Share Tech (best for headlines)

share tech

Usage 

 

9. Khand 

Usage 

khand fonts

 

10. Orbitron

Usage

Orbitron

Let us know your opinions and combinations of Google fonts that can give best result.

Post Tagged with:

Your Comment


 

Social