ブラウザの「アドレスバー」と呼ぶのでしょうか、URLを入力したりする欄がありますが、HPを観ていると時々、URLの先頭に独自のアイコンが付いているものがありますよね。以前からどうやって表示させているのか気になっていたのですが、書店でPC関連の雑誌を読んでいる時にヒントとなるようなことが書いてあったので、Googleで検索をしつつ作ってみました。
わが家はMacですので、標準ブラウザのSafariにアイコンを表示させることができれば良しとする、という方法を選びました。
まずは、"Photoshop Elements"で、16ピクセル×16ピクセルのgif画像を制作。制作といっても、色を付けた背景に文字を2つ乗せただけですが・・・。完成したら、拡張子を.gifから.icoに変更します。この画像をサーバーにアップロード。
とりあえずは、自分のHPのindex.htmlファイルだけで試してみることにしました。head部分に
＜link rel="SHORTCUT ICON" type="image/x-icon" href="アイコンファイルのURL"＞
を書き加えます。あとは、変更を加えたこのindex.htmlファイルをアップロードするだけ。わが家のMac＆Safariで観るぶんには、ちゃんと表示されています。
『安曇野の風景と暮らし〜信州安曇野の風景写真を中心に〜』タイトルページだけ、上の画像のようにアドレス欄に「Az」と書かれたアイコンが表示されるハズなのですが・・・。以上の手順はソース不明の情報ですので、やってみようと思われる方は、ご自分の責任でいろいろと調べてからチャレンジしてみてください。
