Typografia to jeden z najważniejszych aspektów projektowania i tworzenia stron internetowych. Jednak ileż można ograniczać się do wąskiego grona wzajemnej adoracji: Arial, Verdana, Times New Roman? Na szczęście webfonty i dyrektywa @font-face pozwoliły nam na niemal bezproblemowe użycie i wyświetlenie dowolnych fontów w każdej przeglądarce. Wraz z rozwojem webfontów powstało wiele serwisów, pozwalających na zdalne osadzanie webfontów, a zdecydowanie najpopularniejszym z nich jest Google Fonts. Poniżej mocno subiektywne zestawienie 15 webfontów, które każdy webdeveloper powinien znać i stosować w swoich pracach.
Open Sans
[button url=’/tutorial/googlewebfonts/index.html#demo-open-sans’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/Open+Sans’ size=’large’ style=’red’]Pobierz[/button]
Roboto
[button url=’/tutorial/googlewebfonts/index.html#demo-roboto’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/Roboto’ size=’large’ style=’red’]Pobierz[/button]
Lato
[button url=’/tutorial/googlewebfonts/index.html#demo-lato’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/Lato’ size=’large’ style=’red’]Pobierz[/button]
PT Sans
[button url=’/tutorial/googlewebfonts/index.html#demo-pt-sans’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/PT+Sans’ size=’large’ style=’red’]Pobierz[/button]
Ubuntu
[button url=’/tutorial/googlewebfonts/index.html#demo-ubuntu’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/Ubuntu’ size=’large’ style=’red’]Pobierz[/button]
Signika
[button url=’/tutorial/googlewebfonts/index.html#demo-signika’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/Signika’ size=’large’ style=’red’]Pobierz[/button]
Marmelad
[button url=’/tutorial/googlewebfonts/index.html#demo-marmelad’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/Marmelad’ size=’large’ style=’red’]Pobierz[/button]
Roboto Slab
[button url=’/tutorial/googlewebfonts/index.html#demo-roboto-slab’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/Roboto+Slab’ size=’large’ style=’red’]Pobierz[/button]
Bitter
[button url=’/tutorial/googlewebfonts/index.html#demo-bitter’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/Bitter’ size=’large’ style=’red’]Pobierz[/button]
Noticia Text
[button url=’/tutorial/googlewebfonts/index.html#demo-noticia-text’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/Noticia+Text’ size=’large’ style=’red’]Pobierz[/button]
Merriweather
[button url=’/tutorial/googlewebfonts/index.html#demo-merriweather’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/Merriweather’ size=’large’ style=’red’]Pobierz[/button]
Sanchez
[button url=’/tutorial/googlewebfonts/index.html#demo-sanchez’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/Sanchez’ size=’large’ style=’red’]Pobierz[/button]
Libre Baskerville
[button url=’/tutorial/googlewebfonts/index.html#demo-libre-baskerville’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/Libre+Baskerville’ size=’large’ style=’red’]Pobierz[/button]
Playfair Display
[button url=’/tutorial/googlewebfonts/index.html#demo-playfair-display’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/Playfair+Display’ size=’large’ style=’red’]Pobierz[/button]
Quattrocento
[button url=’/tutorial/googlewebfonts/index.html#demo-quattrocento’ size=’large’ style=’blue’]Demo[/button] [button url=’http://www.google.com/fonts/specimen/Quattrocento’ size=’large’ style=’red’]Pobierz[/button]
