CPI x CSS Nite x 優クリエイト「After Dark」（12）フォローアップ：酒井 優さん（WEBCRE8.jp）

2014年7月17日、KDDIウェブコミュニケーションズ セミナールームで開催したCPI x CSS Nite x 優クリエイト「After Dark」（12）Web Fonts特集のフォローアップとして、酒井 優さん（WEBCRE8.jp）の『2014年版Webフォントの使用方法とこれまでの歩み』セッションのフォローアップを公開します。

• スライド

Webフォントはとりあえず導入するだけなら本当に手軽に利用することができます。アイコンなどの利用もそんなに難しいものではないので、デモを触って実際のコンテンツに組み込んでみたり、CodePenやjsdo.itなどのサービスを用いて自分で用意したフォントを表示させてみることから始めてみてはいかがでしょうか。

WEBCRE8.jpでも、今後Webフォントや文字に関する、特にリガチャをはじめとしたフォントの機能についても記事を書いていきますのでよろしくお願いします！

補足、参照リンク

スライド内で掲示したサイトを紹介します。

• WEBCRE8.jp
  http://webcre8.jp/
• HTML5KARUTA
  http://roadstohtml5.com/html5karuta/
• HTML5KARUTA Game for Web
  http://roadstohtml5.com/html5karuta/game/

フォント生成ツール

• sfnt2woffフォント作成コマンドツール
  http://people.mozilla.org/~jkew/woff/
• WOFFコンバータ
  http://opentype.jp/woffconv.htm
• Create Your Own @font-face Kits | Font Squirrel
  http://www.fontsquirrel.com/tools/webfont-generator
• Glyphter
  http://glyphter.com/

フォント入手先

• Google Fonts
  https://www.google.com/fonts
• Adobe Edge Web Fonts
  https://edgewebfonts.adobe.com/
• Open Font Library
  http://openfontlibrary.org/

アイコンフォント

• Font Awesome
  http://fortawesome.github.io/Font-Awesome/
• ? IcoMoon
  http://icomoon.io/
• Symbolset
  https://symbolset.com/
• Symbols
  http://kudakurage.com/ligature_symbols/

参考資料

• 次期Firefox 3.6が対応する新しいWebフォント形式“WOFF”とは？ - フォントブログ
  http://blog.petitboys.com/archives/woff.html
• WOFF (Web Open Font Format)の導入 - 血統の森 web実験小屋
  http://momdo.s35.xrea.com/web-html-test/CSS3-memo/introducing-woff.html
• CSS Fonts Module Level 3 （日本語訳）
  http://www.hcn.zaq.ne.jp/_/WEB/css-fonts-ja.html
• Can I use... Support tables for HTML5, CSS3, etc
  http://caniuse.com/#search=font

AfterDark12-s2 from CSS Nite on Vimeo.