WebFont – Load Google Fonts & TypeKit asynchronously

Google & TypeKit collaborated to load web fonts asynchronously, here are the methods:

1. Include Google Host Library directly:

   <script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js"></script>
   <script>
     WebFont.load({
       google: {
         families: ['Droid Sans', 'Droid Serif']
       }
     });
   </script>

2. Include Google Host Library asynchronously:

   <script type="text/javascript">
     WebFontConfig={
       google:{families:["Lato:400,700,300,100:latin"]}
     };
     
     (function(){
       var wf = document.createElement("script");
       wf.src = ("https:" == document.location.protocol ? "https":"http") + 
                "://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js";
       wf.type="text/javascript";
       wf.async="true";
       var t = document.getElementsByTagName("script")[0];
       t.parentNode.insertBefore(wf, t)
     })();
   </script>

 

You can also download Google WebFont Loader locally and call WebFont.load()  function
For more details, check: https://github.com/typekit/webfontloader