About me Computer Systems Analyst at the California Institute of the Arts (http://calarts.edu) Nice fonts make me smile.
About this presentation Some module demonstrations The contrib area does make it much easier It is more efficient to do custom work at the theme layer (or even in a site module) Do that if you feel comfortable. Feel free to jump in. If you have something to share, come up!
Image Based Text Replacement No issues with a flash blocker (like sIFR) Don’t have to worry about licensing issues as much. Quite a few options Cufon (Most popular though 6.x no longer supported – it is, however, still fairly stable) TextImage (Second best option) FaceLift Image Replacement ImageAPI Text Renderer Signwriter
Image Based Text Replacement Cufon Download Cufon module (http://goo.gl/pxi1z) Download external cufon js (http://goo.gl/AqZAq) Generate a font definition (http://goo.gl/x0ar) Move the js file to sites/all/libraries/cufon-fonts (or add to your theme). DEMO
Using @font-face Quickly become the standard. Text remains unchanged. Licensing issues… Currently need many different font formats. eot: IE4+ otf/ttf: Safari (iOS 4.2+), FF 3.5+, Opera, Chrome svg: iOS < 4.1, Opera woff: FF 3.6+, Opera, Chrome, IE9+, Safari 5.1+ Browsers load the font in different ways (some show plain text until font is downloaded, other hide text)
Using @font-face (cont’d) Font-Your-Face (http://goo.gl/27ORm) Enable and go (works with a number of providers) Native providers include typekit, kernest, font squirrel, google fonts 6.x has ability to upload custom fonts (still to be ported to 7.x) Integration between Webfont Loader and Font-Your- Face in works. DEMO
Places to get nice fonts Free, commercial use fonts Kernest (http://kernest.com) Font Squirrel (http://fontsquirrel.com) Google Fonts (http://www.google.com/webfonts) Subscription-based Typekit (http://typekit.com) Font Spring (http://fontspring.com) Font Deck (http://fontdeck.com) Fonts Live (http://fontslive.com) Any others?
Questions? Have something to share? Come on up! Interested in helping with some of the typography projects? Let’s talk after! What other presentations might be related and/or useful? Drupal Design Skills 2012
A particular slide catching your eye?
Clipping is a handy way to collect important slides you want to go back to later.