「FAVICON」

「ファビコン（Favorites　icon）

２０１２/１２/２８
お気に入りなどのURLの頭に表示されているアイコンをファビコンと言うらしい。
毎度恥ずかしながら知りませんでして、自分のを作ってみることにしました。

ネットで検索すると大きさは１６ｘ１６・３２ｘ３２・４８ｘ４８ピクセルのが有るらしい・・・。
でもどこから手をつければ良いのやらでしてウーンっと思案です。

もっと簡単な方法があるのでしょうけど思いつきで、ホームページ・ビルダーの「ウェブアートデザイナー」の「壁紙素材」から背景画を取り出して”Jtrm”に貼り付けました。
次は同じくJtrimで「文字入れ」を選択して「ＦＨ」と書き込んでフォントとサイズを１６ｘ１６ピクセルに調整して「OK」で確定させました。
そうそう、背景色は「透過」を選択しておきました。

同じようにあとの２つのサイズのも作成しました。
このjpgで保存した画像ファイルを拡張子”ico”に変換しないとアカンみたいです。
（手動で拡張子を変更はダメらしい。）

更にネットで検索しますとネット上でフリーで変換してくれるサイトが有りまして各サイズ欄にファイルを指定して”作成”を押すとファビコンファイルが作成されたのでダウンロードして保存しました。

検索すると「設置場所はサイトの一番浅い階層に・・・。」とのことですけど　この”favicon.icoファイル”をどこに設置するのか解らず・・・。
とりあえず「top.htm」にアップしましたけどこれで正しいのかどうかさっぱりです。

「top.htm」ファイルを開いて「HTMLソース」表示に切り替えて・・・

<HEAD>
中略
<link rel="shortcut icon" href="http://www16.plala.or.jp/junji-i/favicon.ico" type="image/vnd.microsoft.icon">
<TITLE>トップページ</TITLE>
</HEAD>
・・・・・のように１行追記、アップロードしましたが表示されず。（涙）

ブラウザ＜IE8＞のクッキー、履歴、一時ファイルを削除しても一緒です。
私、とんでもないボケをしているんでしょうね。

２０１２/１２/２９
またまた、インターネットで検索しますと・・・
<link rel="shortcut icon" href="icoファイルまでのパス/favicon.ico">の上段に・・・
<script type="text/JavaScript">image = new Image();image.src="favicon.ico（相対パスでfaviconのファイル名）";</script>
・・・を入れると早く表示されるようなことが書かれていましたので・・・
<script type="text/JavaScript">image = new Image();image.src="http://www16.plala.or.jp/junji-i/favicon.ico";</script>
・・・と、書き込みましたがやっぱり変化無し。

「index.html」ファイルに書かないとアカンのでしょうか・・・。ハァー、訳わかりません。
アップロードはバイナリーで行ないましたが変化無し。（悩み）
今日はこれまで。（フウー）

２０１２/１２/３０
早朝に自分の掲示板をチェックしますとjuneさんが昨晩に書き込んでくださってまして、有り難いことです。
ご意見に従い「余談-３５」に書いてますようにお餅搗きをしながらアチコチ修正をしました。

index.htmlに<link rel="shortcut icon"を追加して、top.htmに追加していた<script type="text/JavaScript">image = new Image();image.src="favicon.ico（相対パスでfaviconのファイル名）";</script>は削除しました。

同じく掲示板でシバケンさんから助け船をいただき、o6asanさんからもお知恵を頂戴しましてありがとうございました。
火狐では安定して表示されるとのお話をお聴きしましたので早速インストールしました。
でも未だファビコンの顔を見ることが出来ません。

２０１２/１２/３１
再びシバケンさんからアドバイスを頂戴しまして「フレーム構成でindex.htmlを編集する場合はホームページビルダーの”フレームHTMLソース”で行なわないと反映されない。」とのことでした。
そこで、ハタと・・・ぼんやりながら思い出しまして早速そのようにしてアップ・・・直後に姪っ子から迎え頼むの連絡があって確認もせず、一緒に父に会って、帰宅後確かめますと・・・ホホー出たぁ～～となりました。（喜）

「”フレームHTMLソース”で編集するのは基本やでぇー！」っと声が聞こえてきそうで・・・。（汗）

私のようなオオボケものに、皆様から沢山のアドバイスをいただき有難うございました。（感謝）

今、表示されているファビコンは１６ピクセル角だけのものですので3サイズ合成のものに交換することを考えているところです。

２０１３/０１/０２
先日作成しておいた１６ｘ１６，３２ｘ３２、４８ｘ４８ピクセルの情報を含んだfavicon.icoファイル（12KB）を本日アップして、今の１６ｘ１６ピクセルだけのものと取り替えました。
試しに落としてデスクトップに置くと大きいショートカットアイコンが旨く表示されました。ほっと安堵。

皆様に教えていただいたことをここに記しておきます。
（基本として。）
・サイトの直下（ルートディレクトリ）にicoファイルを置く。
・ルートのindex.htmlの<HEAD> ～ </HEAD> 内に、　<LINK REL="SHORTCUT ICON" HREF="favicon.ico">　一行追加すること。
　＜最近は追加しなくても良い。＞
・フレーム構成の場合のindex.htmlを編集するにはホームページビルダを使用なら”フレームＨＴＭＬソース”から行なわないと反映しないので注意のこと。
・簡単な編集ならTeraPadを使うのも一案。

間違いがありますればご指摘をお願いします。

２０１３/０１/２３
TOYPARKのほうのミラーサイトにもPLALAと同じようにファビコンを設置したつもりなんですけど何故か表示されず。
なかなか旨いこといかないものですね。

２０１３/０２/０２
何気なく仕事用のパソコン＜ASUS　P5VDC-MX（マザーボード名）＞からTOYPARKにあるミラーサイトを閲覧するとアリャマァーちゃんと自分のファビコンが表示されました。っと言うことはブラウザの関係なんでしょうか。しかし、両方とも”I/Eのバージョンはｖ８ですし・・・訳わかりません。

上に戻る

一つ前に戻る

 TOPに戻る