favicon（ファビコン）は、ウェブサイトのシンボルマーク・イメージとして、ウェブサイト運営者がウェブサイトやウェブページに配置するアイコンの俗称である。favorite icon（フェイバリット・アイコン：お気に入りアイコン）という英語の語句を縮約したものである。
モダンブラウザーでは通常のPNGやGIF形式でも表示出来ますが、IEでは今のところ「.icoファイル」でないと表示出来ないので、PNGなどで作った画像を「.ico」ファイルにジェネレーターなどで変換しましょう。
Photoshopからそのまま「.icoファイル」に書き出せるプラグインなどもありますが、「.icoファイル」の特性であるマルチアイコン化（複数のサイズの画像を１つのicoファイルで持つ事が出来る）をするには、やはりネット上にあるジェネレーターを使うのが便利です。
2020年現在、ファビコンはpng画像で作るのが一般的なのでpng画像で作成しましょう。
faviconのサイズですが、基本的には16px×16pxですが、OSやデバイスによって様々ですべてに対応させるとなるときりが無くなってしまうので、今回は
- PC用 32px×32px
- スマートフォン用 192px×192px
の2種類のみに限定します。
Webサイトに必要なfaviconが21個になっていた - IT探検の追憶
肝心の記述ですがIEのバージョンによって多少変わってきますが、
IE11以上であれば以下の記述で大丈夫です。
<!DOCTYPE HTML> <html lang="ja"> <head> <meta charset="utf-8"> <title>Faviconを表示させる</title> <link rel="icon" type="image/png" href="/favicon.png"> <link rel="apple-touch-icon" href="/touch-icon.png"> </head>
