Font Awesome 5がリリースされたぞ！

fontawesome.com
(URLも従来の.ioから移転されました。)

v4からのアップデートガイド(英語)

更新の概要

• お金を払ってより多くのアイコンを手に入れることができる、Proバージョンができました。
  • 無償版でも従来から比べてアイコン数が増え便利になりますが、ProではLightウェイト等の追加のアイコンを利用できます。
• アイコンの数はもちろん増えました。
  • 日本の開発者にとって最もうれしいアイコンはLINEのアイコン(fab line)ではないでしょうか。
• 導入方法が増えました。
  • JavaScriptとSVGによる描画が新たに追加されました。
    ページをパースし、自動的に必要なCSSと<i>タグ内にsvgを挿入します。
  • もちろん、従来のCSSとWebFontを用いたバージョンでも可能です。
  • npmパッケージを用いれば、サーバー(node.js)サイドで事前にSVGを埋め込むこともできます。詳細は後述。
  • フォントをパソコンにインストールすれば、OpenTypeの合字として表示することができます。
    対応しているソフトや使う場所が限られていますが、何かと重宝しそうです。
• アイコンの種類が明確に分かれました。
  • Solid(塗りつぶし), Regular(線・標準の太さ), light(線・細い Proのみ), Brands(ブランド)の4種類があります。
  • アイコン一覧では種類ごとに使えるアイコンを見ることができます。
• faプレフィックスに代わり、種類ごとのプレフィックスfas,far,fal,fabになりました。
  • 例えば<i class="fab fa-line"></i>,<i class="fas fa-clock"></i>など。
• 種類分けに併せて、アイコンの命名が変わりました。
  • より論理的に、そして無垢になりました。
  • 4から利用している方は要注意です。しかしご安心ください。fa-v4-shim.jsを利用すれば、そのままで大丈夫です。
  • → アップグレードガイドを参照してください。

導入例

サイトビルダーや一般的なビルドを行うサービス等、事前処理ができる状況においては、JavaScriptの処理をビルド時にしてしまいたいと誰もが思うはずです。
npmパッケージ化によってそれができるようになりました。

以下に例を示しますが、APIの説明をすっとばして実使用の場合のみを想定しています。
詳しくはAPIの説明を読んでください。
ブラウザとnode.js双方の仕様についてたいへんわかりやすく書かれています。

例

例を示すと言ったな？あれは嘘だ。
公式ドキュメントを見つけたので削除しちゃいました
→https://fontawesome.com/how-to-use/on-the-web/other-topics/server-side-rendering