{"id":573,"date":"2011-09-10T12:54:49","date_gmt":"2011-09-10T12:54:49","guid":{"rendered":"http:\/\/fiveforks.com\/jeb\/2011\/09\/google_web_fonts\/"},"modified":"2011-12-27T17:05:46","modified_gmt":"2011-12-27T22:05:46","slug":"google_web_fonts","status":"publish","type":"post","link":"https:\/\/www.fiveforks.com\/jeb\/2011\/09\/google_web_fonts\/","title":{"rendered":"Google Web Fonts"},"content":{"rendered":"

In website design, you are restricted to a limited set of text fonts. You have to design based on the most common fonts people have installed. The complex data for drawing the font doesn’t come across the web, but rather from the local operating system. You control this with style code that looks something like this:<\/p>\n

body {font:15px arial, helvetica,sans-serif;}<\/p><\/blockquote>\n

Which means, try to use areial and if they don’t have that, use helvetica, and if they don’t have that use whatever san serif default font the reader has.<\/p>\n

The only way to use a creative display font would be to be to make it a graphic and display it as an image, which would not be text and would not be sizable or searchable. It wouldn’t really be a font.<\/p>\n

As bandwidth has gotten greater… everyone is now watching YouTube and streaming Pandora… the concern about being so efficient with text has diminished. Why not send some extra font data with the page so everyone can read whatever font you want to use?<\/p>\n

Google Web Fonts<\/a> does just that. They have a nice little shopping tool<\/a> that helps you browse different styles of fonts and then “check out” with the code to put at the top of your website. It is a specialized stylesheet call back to google fonts.<\/p>\n

<head><\/p>\n

<link href=’http:\/\/fonts.googleapis.com\/css?family=Schoolbell’ rel=’stylesheet’ type=’text\/css’><\/p><\/blockquote>\n

After trying on some different fonts, I settled on a general text font for Mac5’s home page called Cabin<\/a> and then a fun display font for JEB:LOG titles called Schoolbell<\/a>.<\/p>\n

\"JEB_LOG<\/p>\n

What’s he building in there?<\/p>\n","protected":false},"excerpt":{"rendered":"

In website design, you are restricted to a limited set of text fonts. You have to design based on the most common fonts people have installed. The complex data for drawing the font doesn’t come across the web, but rather … Continue reading →<\/span><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[],"class_list":["post-573","post","type-post","status-publish","format-standard","hentry","category-tech"],"_links":{"self":[{"href":"https:\/\/www.fiveforks.com\/jeb\/wp-json\/wp\/v2\/posts\/573","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.fiveforks.com\/jeb\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.fiveforks.com\/jeb\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.fiveforks.com\/jeb\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.fiveforks.com\/jeb\/wp-json\/wp\/v2\/comments?post=573"}],"version-history":[{"count":1,"href":"https:\/\/www.fiveforks.com\/jeb\/wp-json\/wp\/v2\/posts\/573\/revisions"}],"predecessor-version":[{"id":630,"href":"https:\/\/www.fiveforks.com\/jeb\/wp-json\/wp\/v2\/posts\/573\/revisions\/630"}],"wp:attachment":[{"href":"https:\/\/www.fiveforks.com\/jeb\/wp-json\/wp\/v2\/media?parent=573"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.fiveforks.com\/jeb\/wp-json\/wp\/v2\/categories?post=573"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.fiveforks.com\/jeb\/wp-json\/wp\/v2\/tags?post=573"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}