2015.11.21 コーディング
「アイコンフォント」を活用しよう！！
肌寒い季節になりましたね、システムエンジニアの大橋です。これからもっと寒くなることを考えると、チョット憂鬱になります。
さて、今回は便利な「アイコンフォント」についてですが、皆さんは活用されていますでしょうか！？当然ながら「制作するべきもの」によって、使用有無を含めて判断になりますが、使い方を間違えなければ便利であることは言うまでもありません。
メジャーところは「Font Awesome」でしょうか！？
「Font Awesome」では、さまざまなアイコンフォントが500種類以上も提供されています。Webフォントとして使用できるので、フォントサイズやフォントカラーをCSS制御することもできるわけです。便利ですよね。
ライセンスを確認しておきましょう！！
フォントライセンスは「SIL Open Font License（OFL）」が適用されます。ライセンス形式を明示することにより、ほぼ自由に使用することができる、とても扱いやすいライセンスになります。
コードライセンス（CSSファイル等）は「MIT License」によりライセンスされています。「GPL License」のようなコピーレフトではありませんので、コードを一部修正したとしても開示する必要はありません。
結論としては、CSSファイル内にライセンス形式を明記すれば、ほぼ自由に使うことができるということです。安心ですね。
実際に使ってみましょう！！
今回は、アイコンフォントをダウンロードするのではなく、CDNを使用したサンプルで試してみました。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<title>Font Awesome</title>
</head>
<body>
<i class="fa fa-camera-retro fa-lg"></i> Camera（fa-lg）
<i class="fa fa-camera-retro fa-2x"></i> Camera（fa-2x）
<i class="fa fa-camera-retro fa-3x"></i> Camera（fa-3x）
<i class="fa fa-camera-retro fa-4x"></i> Camera（fa-4x）
<i class="fa fa-camera-retro fa-5x"></i> Camera（fa-5x）
</body>
</html>
結果はこんなカンジ！！
使い方はとても簡単、ですが、500種類以上ものアイコンから目的のものを探し出すのは疲れますね！！＜つづく＞
