ウェブサイトにファビコンを実装する方法
2015/10/3
2021/10/5
3164 views
ファビコンを作ろう！
ウェブサイトの完成度にこだわるならファビコンは必ず設定しておきたいところです。
でもファビコンってどうやって作るの？っという方もいるでしょう。
今回は「favicon.ico」さんで簡単にファビコンを作成できたのでそのやり方をご紹介します。
１．ファビコンにしたい画像を用意する
まずは、ファビコンにしたい画像を用意します。
PhotoShopやイラストレーターなどで正方形の画像を作成しましょう。
作成されるサイズは16px × 16px、32px × 32px、48px × 48pxとなるのでこれらに近いサイズでの画像をおすすめします。
背景が透過のファビコンが作りたいならPNG24形式の背景透過で保存しましょう。
2．favicon.icoにアクセスしファビコンを作成する
favicon.icoにアクセスします。
「画像ファイルを選択」から作成した画像をアップし、「アイコン作成」をクリックします。
後は背景色を選択し、「ダウンロード」で完了です。
３．htmlにファビコンを読み込むソースを記述
実際にサイトにファビコンを適用するには、以下の記述を<head>内にします。
<link rel="shortcut icon" href="images/favicon.ico" type="image/vnd.microsoft.icon" />ファビコンはキャッシュが残りやすく、すぐに反映されないこともあるので、キャッシュクリアなどして確認してください。
以上です。
ご質問などあればお気軽にコメントください。
この記事へのコメント
- まだ書き込みはありません