なんか仕様がブラウザによって違うけどどうなんでしたっけ、というメモ。
faviconの生い立ち
faviconのはじまりは、ウェブブラウザであるMicrosoft Internet Explorer 5によってはじめて搭載された独自の（非HTML標準の）機能であった。ユーザーが任意のウェブサイトをお気に入りに登録するときに、ウェブブラウザは該当Webサイトのディレクトリから favicon.ico ファイルの存在を調べ、ある場合はこのファイルを該当Webサイトのアイコン画像として取り込む。それ以降にお気に入り一覧を表示する際、該当Webサイトについては一般的なWebアイコンではなく取り込んだアイコン画像が表示されるようになる。 - Favicon - Wikipedia
もともとは標準化から始まった規格ではなく、InternetExplorerが旗揚げをした規格。
HTML5と標準化
HTML5から標準化され、いろんな経緯があり、2019年の今は link 要素の icon で指定できるようになりました。
<link rel="icon" href="/favicon.ico">
shortcut icon だった時期もあったが、それも歴史的経緯という形で語られている ( 参考: HTML 5.2: 4.8. Links - 4.8.6.5. Link type "icon"）
標準化されていないもの
iOSのSafariショートカット用 apple-touch-icon
記述例は以下
<link rel="apple-touch-icon" href="/custom_icon.png">
画像形式がどういうレギュレーションなのか…みたいのは公式にもちゃんと書かれておらず、pngしかダメな雰囲気（参考： Configuring Web Applications）
Android Chromeはウェブアプリマニフェストも対象の様子
Android Chromeは従来のlink要素での指定でもOKだが、直近だとPWAには必須の manifest.json でも設定値がある。
詳しくは ウェブアプリ マニフェスト | Web | Google Developers 参照のこと。
