faviconの設定(簡易メモ)
とても簡易なメモですが、favicon制作で迷いたくないのでメモをいたす。
heml head 表記
link rel="shortcut icon" href="http://XXXXX.com/wp-content/themes/XXXXX/images/favicon.ico"> link rel="icon" href="http://XXXXX.com/wp-content/themes/XXXXX/images/favicon.ico" type="image/vnd.microsoft.icon"> link rel="apple-touch-icon" href="http://XXXXX.com/wp-content/themes/XXXXX/images/apple-touch-icon.png"> link rel="apple-touch-icon" sizes="72x72" href="http://XXXXX.com/wp-content/themes/XXXXX/images/apple-touch-icon-72x72.png"> link rel="apple-touch-icon" sizes="114x114" href="http://XXXXX.com/wp-content/themes/XXXXX/images/apple-touch-icon-114x114.png">
wordpressの時
link rel="shortcut icon" href="/images/favicon.ico"> link rel="icon" href="/images/favicon.ico" type="image/vnd.microsoft.icon"> link rel="apple-touch-icon" href="/images/apple-touch-icon.png"> link rel="apple-touch-icon" sizes="72x72" href="/images/apple-touch-icon-72x72.png"> link rel="apple-touch-icon" sizes="114x114" href="/images/apple-touch-icon-114x114.png">
用意するのは、
favicon.ico
apple-touch-icon.png サイズ57 57
apple-touch-icon-72x72.png
apple-touch-icon-114x114.png
4つ
favicon.icoは
参考
http://minakul.jp/favicon-2290
pngでーた
64px × 64px
48px × 48px
32px × 32px
16px × 16px
4つ作って、
http://ao-system.net/alphaicon/index.php
で一気にに作る
apple-touch-icon
114px 72px 57px で作る