html5 ボイラープレートのお気に入りアイコンが機能しない (表示されない)
ローカルホストとサーバーで試しましたが、どちらの場合も機能しませんでした。それを機能させるにはどうすればよいですか。
html5 ボイラープレートのお気に入りアイコンが機能しない (表示されない)
ローカルホストとサーバーで試しましたが、どちらの場合も機能しませんでした。それを機能させるにはどうすればよいですか。
HTML5ボイラープレートはlink
、デフォルトではアイコンの要素を使用しません。代わりに、ブラウザがルートディレクトリでfavicon.icoまたはapple-touch-icon.pngのいずれかを見つけることに依存しています。
HTML5 Boilerplateをサブディレクトリに配置すると、ローカルホストでもサーバーでも、ファビコンが表示されないか、サーバーのルートディレクトリにある既存のファビコンが表示されます。<head>
これを簡単に修正するには、index.htmlのセクションに次のコード行を追加します。
<link rel="icon" type="image/png" href="apple-touch-icon.png">
さらに良いのは、57x57のapple-touch-icon.pngを使用する代わりに、16x16のPNG画像(例:favicon.png)を作成することです。これにより、サイズが変更され、明瞭さが失われます。
詳細については、ユーザーガイドの「ファビコンとタッチアイコン」セクションを参照してください。