FontAwesome Sample

FontAwesomeとは?

FontAwesomeは、HTMLやCSSで簡単にアイコンを表示できるWebフォントのサービスです。以前までは小さなアイコンでも画像として表示させなければならなく、サイト作成に手間がかかっていました。しかし、FontAwesomeを利用することでHTMLやCSSだけでアイコンを表示できることができ、手軽に見栄えの良いサイトを作ることが可能になりました。

FontAwesomeのアイコン例

FontAwesomeでは非常に多くのアイコンが用意されているので、サイト作成においてアイコンには困らなくなるほど便利に使うことができます。FontAwesomeの導入・使い方についてはこちらのページで解説していますので、いますぐ使いたい方はご覧ください。
FontAwesomeの使い方

FontAwesomeを使うメリット

FontAwesomeを使うメリットは、なんと言ってもその手軽さです。単にアイコンを表示させるのも簡単ですし、WebフォントなのでHTMLやCSSでスタイルを指定することによって大きさ・色・角度などを簡単に変更することができます。

アイコンを画像で表示させると大きさや色を少し変えるだけでも非常に手間がかかりますが、FontAwesomeであれば簡単に変更ができサイト作成が効率よく行えるようになります。

またレスポンシブなどでスマートフォンやタブレットでサイトの表示を変える場合にも役に立ちます。スマートフォンやタブレットではフォントサイズを小さくする事があり、それに伴ってアイコンも小さくしたいという状況はよくあります。このような場合でも画像であればそれぞれに画像を用意する必要がありますが、FontAwesomeであればCSSでスタイルを変えるだけで済みます。

テンプレートを作るようなときにも便利です。色のパターンを変えたテンプレートを作成するときには、そのテンプレートに合わせた色にアイコンを変更することができます。またJQueryなどのスクリプトでアイコンを変化することも容易です。

このようにFontAwesomeは非常に手軽であり、多くの状況に対応できる便利さもあります。

有料版と無料版

FontAwesomeには、有料版と無料版があります。有料版は使えるアイコンの種類が増えてさらに便利に利用できます。ただ無料版でもかなり使えるアイコンが多くほとんど不便はないので無料版でも十分に活用できます。

当サイトの解説も基本的に無料版で使うことを前提にサンプルや使い方の解説をおこなっております。