Your SlideShare is downloading. ×
Web Safe Fonts Are Dead Series | Part 3: OpenType, The New Frontier
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

Web Safe Fonts Are Dead Series | Part 3: OpenType, The New Frontier

286
views

Published on

In Part 3, Thomas Phinney takes on the bleeding edge of OpenType features on the web, including: …

In Part 3, Thomas Phinney takes on the bleeding edge of OpenType features on the web, including:

• Workhorse OpenType features—what they are, and how and when to use them
• How OpenType allows you to have script and calligraphic fonts that look more real than ever before
• The bizarre world of cutting-edge OpenType fonts that draw pie charts, translate or censor text, or even predict the future!
• Detailed references and creative inspiration

Published in: Technology, Art & Photos

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
286
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Presented by Thomas PhinneyOpenType:the newweb frontier
  • 2. OpenTypebrowser supportFirefox 4+ (syntax change in 14)Chrome:•  15/16+ Win•  22+ MacInternet Explorer 10+Safari & Opera: not yet
  • 3. OpenTypefeature codes•  Standard stuff: liga (ligatures), kern, calt(contextual alternates), clig (contextualligatures)•  Oldstyle/proportional numbers:onum, pnum•  Fractions: frac•  Superscript/subscript: sups, subs, sinf•  Small caps from caps: c2sc•  Small caps from lowercase: smcp•  Discretionary/historical ligs: dlig, hlig•  Stylistic Set #2, #14: ss02, ss14
  • 4. OpenTypefeatures in CSSbody {-moz-font-feature-settings:"calt", "liga", "clig", "kern";-moz-font-feature-settings:"calt=1, liga=1, clig=1, kern=1";-ms-font-feature-settings:"calt", "liga", "clig", "kern";-o-font-feature-settings:"calt", "liga", "clig", "kern";-webkit-font-feature-settings:"calt", "liga", "clig", "kern";font-feature-settings:"calt", "liga", "clig", "kern";text-rendering:optimizeLegibility;}
  • 5. DEMO
  • 6. Resources &Linkshttp://www.webink.com/type-resourceshttp://mzl.la/ff4-ot@WebINK@ThomasPhinney