Bir internet sayfasının tasarımı tamamlayan en önemli şartı font tipidir. Font tipi aynı zamanda sayfa kullanımının da en önemli parçasıdır. Gerek tasarımcılar için gerekse geliştiriciler için de bir o kadar yorucu olabiliyor o kadar font içinde en doğru olanı seçip kullanmak. Google Fontlar ile bu sorunu büyük ölçüde çözse de fontların kendi sayfamızda nasıl duracağını kestirmek zor oluyor. Burada da imdada WebFonter yetişiyor.
WebFonter, yazı tiplerini istediğimiz herhangi bir sayfada deneme imkanını bize sunuyor. Google Chrome için bir de eklentisi bulunan servisi kullanımı da oldukça kolay. Font ailesini seçtikten sonra tipini ve hangi alanlarda kullanılması gerektiğini seçiyoruz. Ardından boyut ayarlarını tamamlıyoruz. Hepsi bu kadar.
[alert-note] Eğer Webfonter’ı yer işaretlerine eklemek isterseniz bu linke tıklamanız yeterli [/alert-note]
 { if (typeof(fsi_webfonter) === 'undefined') { console.log('load webfonter'); var gaTrack = function (g,h,i){function c(e,j){return e+Math.floor(Math.random()*(j-e))}var f=1000000000,k=c(f,9999999999),a=c(10000000,99999999),l=c(f,2147483647),b=(new Date()).getTime(),d=window.location,m=new Image(),n='http://www.google-analytics.com/__utm.gif?utmwv=1.3&utmn='+k+'&utmsr=-&utmsc=-&utmul=-&utmje=0&utmfl=-&utmdt=-&utmhn='+h+'&utmr='+d+'&utmp='+i+'&utmac='+g+'&utmcc=__utma%3D'+a+'.'+l+'.'+b+'.'+b+'.'+b+'.2%3B%2B__utmb%3D'+a+'%3B%2B__utmc%3D'+a+'%3B%2B__utmz%3D'+a+'.'+b+'.2.2.utmccn%3D(referral)%7Cutmcsr%3D'+d.host+'%7Cutmcct%3D'+d.pathname+'%7Cutmcmd%3Dreferral%3B%2B__utmv%3D'+a+'.-%3B';m.src=n}; var url = '/bookmarklet?url=' + location.host + location.pathname; gaTrack('UA-45420013-1', 'webfonter.fontshop.com', url); var base = '//webfonter.fontshop.com/'; var r = function(u) { return u + '?r='+(Math.round(new Date().getTime()/600000)); }; var sc = function(p, a) { var e = document.createElement('script'); e.setAttribute('type','text/javascript'); e.setAttribute('charset','UTF-8'); e.setAttribute('src', r(base + p)); if (a) { for (var k in a) { e.setAttribute(k, a[k]); } } document.body.appendChild(e); }; var head = document.getElementsByTagName('head')[0]; if (!head) { head = document.getElementsByTagName('html')[0]; } var ss = function(c) { e = document.createElement('link'); e.setAttribute('type','text/css'); e.setAttribute('rel', 'stylesheet'); e.setAttribute('href',r(base + c)); head.appendChild(e); }; window.require = { baseUrl:base+'js', urlArgs: 'bust=' + (new Date()).getTime(), config: { text: { useXhr:function(url,protocol,hostname,port) { return true; } } } }; window.fsi_webfonter_config = { isDev: true, api: { baseUrl: '//d3otl0lvq84taj.cloudfront.net'+'/webfonter/api/' }, wfs: { ssl: false } }; sc('js/webfonter.js'); ss('css/bookmarklet.css'); ss('css/fsi-swapper.css'); fsi_webfonter = true; } else { if (typeof($) !== 'undefined') { $('#fsi-webfonter').trigger('reopen'); }; } }());){kind=link}