Your SlideShare is downloading. ×
0
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
交點台大Vol.9 - 葉俊麟 - justfont分享
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

交點台大Vol.9 - 葉俊麟 - justfont分享

210

Published on

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
210
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
3
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. Web  fonts
  • 2. ! .title  {     font-­‐family:  “myFont”  ,  Arial,  sans-­‐serif;   }   ! @font-­‐family  {     font-­‐family:  myFont;       src:  url(http://xxx/myfont.ttf);   }   Download  or     Web  font  service
  • 3. Technology  Adoption  Curve Web  fonts  in  10-­‐15%  of  top  1000  websites   Latin  fonts
  • 4. Google
  • 5. Typekit
  • 6. Why  use  Web  Fonts  ? 建⽴立排版⼀一致性 改善⽤用⼾戶體驗! 強化SEO! 解析度問題! ⽀支援html5效果
  • 7. 中⽂文 ?
  • 8. ! .title  {     font-­‐family:  “雅坊POP3”  ,  Arial,  sans-­‐serif;   }   ! @font-­‐family  {     font-­‐family:  “雅坊POP3”  ;       src:  url(http://xxx/  AFUPOP03.ttf);   }   Download  ?   Web  font  service  ?
  • 9. Huge Big5  (13,053)  =    6~8MB   Unicode  6.0  (109,449)  =  50MB  
  • 10. Actually What  actually  is  on  CJK  web  page?  
  • 11. Latin 20k Chinese 8M
  • 12. Subset Font  subsetting  delivers  only  the  font   characters  that  are  used  for  the   displayed  content
  • 13. Dynamic  Subsetting Small  font  size  (50k  average)   Dynamic  content   No  additional  set-­‐up  at  design   time   Optimization  for  Chinese  font     Improves  page  load  times
  • 14. font   data ! Javascript ajax
  • 15. Speed File  compression   Subsetting  techniques   WOFF/TTF/EOT  format   Download  times
  • 16. 2.39  s Chinese:  30-­‐400k   Using  justfont  subsetting  technology.   No  easy  way  to  re-­‐use  the  subset  on   another  page   Good  for  article  titles   Record  by  2012/2/10
  • 17. 1.58  s Chinese:  30-­‐400k   Using  justfont  subsetting  technology.   No  easy  way  to  re-­‐use  the  subset  on   another  page   Good  for  article  titles   Record  by  2013/10/10
  • 18. 0.16  s Chinese:  30-­‐400k   Using  justfont  subsetting  technology.   No  easy  way  to  re-­‐use  the  subset  on   another  page   Good  for  article  titles   Record  by  2014/5/29  
  • 19. Justfont提供跨平台與瀏覽器! 的閱讀和使⽤用體驗 新iPad螢幕解析度為2048×1536的 視網膜顯⽰示螢幕,解析度為iPad 2 的4倍,超越印刷出版品質。!
  • 20. 260,000  k/  ⽉月
  • 21. justfont 平台服務 ■ 中⽂文網路字型平台服務! ■ 深耕和推廣字型相關知識! 字型學(Typography)   字型講座舉辦! ■ 代理字型業務! 信⿊黑體授權(電⼦子書/APP)   ■ 發明專利保護(台灣/⼤大陸)! 藉由圖騰伺服器產⽣生網⾴頁圖騰之⽅方法及其系統! 將⾃自訂標籤應⽤用於XML⽂文件之⽅方法及其系統
  • 22. 字體123:web font的使⽤用(上)(中) (下)! 字體123:必須知道的字型基本知識! 字體123:⼤大家都能懂的通⽤用字體! 字型沒那麼簡單:中性字體之必要! 字型沒那麼簡單:現代倉頡怎麼造字! 如何跨平台顯⽰示更好讀的字體(1)(2)! [But專欄]字型設計⾃自⼰己來─中⽂文字型設計 (1) (2) (3)! [⽇日星專刊] 漫談活版印刷 (1) (2)! 視覺錯視與字型設計 (1) (2)! justFont 密技:怎樣跨平台顯⽰示更好讀的字體? 專業的字型學社群
  • 23. 2012/03/23 談現代字體應⽤用設計 2012/08/14 混排× 復刻× ⼤大師對話 ⽇日星鑄字⾏行! 張介冠 信⿊黑體作者! 柯熾堅
  • 24. ⿊黑與⽩白的饗宴III (2013/4/13)! 之字型松 + 創意字型展! 張介冠:⼿手書、⾏行氣與活字! 吳逸⽂文 (Even Wu):平⾯面排版與當代網⾴頁設計! 柯志杰:漫談漢字印刷字體的形成! 張軒豪:Think the Opposite! 柯熾堅:給中⽂文設計師的建⾔言
  • 25. 字戀⼩小聚
  • 26. +
  • 27. 幼兒學習網站! 注⾳音字型

×