小さい画像でも効果はあります。favicon（ファビコン）は設定しよう

WEBブラウザでホームページを見ているとWEBブラウザのタブに画像が表示されています。
普段あまり気にすることもないかもしれませんがこれは、favicon（ファビコン）と呼ばれる画像で、WEBページを開いた時に出来る複数のタブの中から見たいページを見つける目印になります。
WEB制作の現場ではSEO対策などに比べて重要度が高いわけではありませんが、WEB
サイトの象徴をになっているので必ず作成はします。
今回はfavicon（ファビコン）の役割について解説していきます。

ファビコンとは

タブブラウザでWEBページを開いた時にタブに表示される画像、検索結果に表示されるページタイトルの横に表示される画像で、WEBサイトのシンボルマーク的な役割をはたしている画像です。また、WEBサイトをお気に入りに登録した時にはファビコンも登録されるのでユーザとっては見つける目印になります。
また、実際にファビコンが設定してるWEBサイトとそうでないWEBサイトではユーザーに残る印象が随分と異なってきます。ファビコンがあることによってユーザは無意識にこのWEBサイトはどのようなサイトをかを判断しています。

ファビコンが表示される個所

WEBブラウザの場合

ブラウザのタブ、お気に入りのショートカット、検索結果のタイトル、に表示されます。

スマートフォンの場合

ショートカットを作成した時にファビコンが適応されます。

このようにファビコンは様々な場所に適応されWEBサイトのブランディングや知名度アップに貢献しています。
ファビコンが有ると無いでユーザーには親近感や信頼感を与えることが出来ます。

ファビコンの大きさと作り方

ファビコンの大きさ

ファビコンは様々なあブラウザやスマートフォン、タブレットに使われるため対応するサイズが制作数えたことはありませんが10～20程度あります。
16×16
ファビコンのサイズ
16×16
32×32
36×36
48×48
72×72
96×96
144×144
180×180
192×192
256×256

WEBブラウザやお気に入りに使われるのは「16×16」になりスマートフォンやタブレットに利用されるのは「180×180」になります。
ただ、用途に合わせて、種類ごとにファビコンを制作するのは合理的ではありませんでので
対応させたい一番大きなファビコンを用意するのがおすすめです。
ファビコンは用途に合わせて自動的に適応したサイズに変更されるので大きめのファビコンを用意しておけば、ファビコン縮小されても綺麗に表示されます。

ファビコンの作り方

ファビコンの作り方は、まずファビコンにしてたい正方形の画像を作成します。
※ほどんどの場合あロゴがファビコンにする方が多いです。
作成した画像をファビコンに自動変換してくれるサイトがありますのでそこに画像をアップすることでファビコンを作成することが出来ます。
オススメとしては下記の3サイトが比較的簡単にファビコンを作成することが出来ます。

・Faviconジェネレーター
・favicon generator
・ファビコン favicon.icoを作ろう!

まとめ

ファビコンは自体は小さい画像ですが、ファビコンを設定するこでユーザーに無意識にWEBサイトのことを認知してくれるようになります。画像は小さながら様々なブラウザやデバイスで活躍してくれます。設定方法は非常に簡単なのでまだ設定されていなのであればこの機会に設定してみてはいかがでしょうか？