いまや仕事でもプライベートでも、インターネットの存在は欠かせません。
仕事ではメールの送信やオンライン上でのファイル管理、プライベートでは動画の閲覧や検索サイトを利用した調べ物……といったように、その用途は多岐にわたります。
実際、ブラウザで毎日何かしらのWebサイトやWebサービスを使用しているように感じます。
以前Web制作の仕事に携わっていたことがあり、Webサイトを制作する上で忘れずに設定していたものがあります。それは、タブのWebサイト名やページ名の左横にある、小さな画像の設定です。
この画像を何と呼ぶかご存じでしょうか？
これは「ファビコン（favicon）」という、Webサイトのシンボルとして使用されるアイコンです。
某家庭用ゲーム機に名前が似ていますが、全くの別物です。
しかしながら、私はこの語感で「ファビコン」の名前を覚えました。
なお、ファビコンは俗称で、正式名称ではありません。
正確には「フェイバリット・アイコン（favorite icon）」といい、この語句内の一部分をつなぎ合わせて作られた名称がファビコンです。
ただ、「ファビコン」のほうがよく名称として使われるため、この記事内では以降「ファビコン」と表記します。
昔は1つのウィンドウに複数のタブを用いてWebページを開くことができなかったこともあり、ファビコン未設定のWebサイトも多数ありました。
しかし今ではWebサイトにおいて、とても重要な存在となっています。
今回はWebサイトを利用する側の視点で、ファビコンが重要な理由と、その活用方法を見ていきます。
1. どのWebサイトを開いているかが一目でわかる
どのWebサイトを開いているかがわかる。
これはファビコンにおいて最も大切な要素です。
ブラウザでタブをたくさん開いてWebサイトを表示すると、1つあたりのタブの幅が狭くなり、名前が見えにくくなります。
ここまでくると、もはや名前が見えません……。
それでもファビコンを設定してあれば、どのタブがどのWebサイトなのかが一目でわかります。
たとえWebサイトを訪れたのが初めてだったとしても、あらかじめ会社名やロゴを知っていれば、明確に判断可能です。
なお、ファビコンを利用してブックマークをこのように表示することもできます。
ブックマークバーにファビコンだけを表示してすっきりさせました。
手順はいたって簡単で、各ブックマーク名を消した状態でブックマークバーに表示しているだけです。
例として、Chromeで表示する場合の実際の手順を紹介します。
ブラウザのブックマークバーにファビコンだけを表示する
（１）ブックマークバーに表示させたいWebページを開いて
すでに追加済みの場合は、同じアイコンをクリックして「ブックマークの編集」をクリックします。
（２）名前を削除し、フォルダで「ブックマーク バー」を選択して「完了」をクリックします。
（３）ファビコンだけがブックマークバーに表示されます。
あまり利用していないWebサイトを登録してもわからなくなってしまうので、この表示方法はよく利用しているWebサイト向けです。
ちなみにこれは私が実際に設定しているブックマークバーになります。
どれもほぼ毎日利用しているWebサイトなので、名前が表示されていなくてもはっきりわかります。
上記のように、ファビコンはWebサイトを一目で示すという重要な役割が持つので、ファビコン自体がどのWebサイトを示しているのかが明確にわかるようにする必要があります。
そのためファビコンには、主にWebサイトや会社のトレードマーク、ロゴの一部などの画像を用いることが多くあります。
2. スマホでホーム画面にショートカットを作成した場合はアイコンになる
パソコンのように、スマホでもWebページへのショートカットを作成できます。
その際にアイコンとして使用されるのがファビコンの画像です。
例えば、iPhoneでSafariを使用している場合、Webページへのショートカットは次のように作成できます。
ブラウザにWebページへのショートカットを作成する
（１）Safariの最下部中央にあるアイコン
（２）メニューを上にスワイプして表示を広げ、「ホーム画面に追加」をタップします。
画面上部のWebサイト名の隣に表示されている画像がファビコンです。
（３）名前とアドレスを確認し、「追加」をタップします。
名前とアドレスの左に表示されている画像が、ホーム画面に表示されるショートカットのアイコンになります。
なお、名前はWebサイトやWebページの名前がデフォルトで入っていますが、任意の名前に変更することも可能です。
（４）ホーム画面にWebページへのショートカットが作成されます。
よく閲覧するWebサイトやWebページがある場合、このようにショートカットを作っておくと便利です。
私の場合、通っているスーパーのチラシページのショートカットを作成してホーム画面に設置しています。
おわりに
最後にスマホでショートカットを作成しましたが、ブラウザの表示よりも大きくアイコンが表示されるため、ファビコンの画像がより鮮明に映ります。
ファビコンの画像を大きなサイズで見たい場合は、スマホでショートカットを作ってみるというのも手です。
ファビコンをしっかり設定しているWebサイトだと、その作り込みがこのショートカットでよくわかります。
あまり気にしていなかった、という方は、ぜひファビコンにも注目してみてください。
いつも閲覧しているWebサイトの、隠れたこだわりが見えてくるかもしれません。