favicon を自前で作成する方法 と faviconをネット上で簡単に作成できる無料サービス ファビコン ジャパン

とりあえずはじめに、自前で作成( Photoshop )したfaviconと無料ネットサービスで作成したfaviconを比べてください。

　自前（　Photoshop　）で作成したfavicon

　無料ネットサービスで作成favicon　　　　              

細かいことが省きますが、やはりＰｈｏｔｏｓｈｏｐで作成した方が画像がきめ細やかです。

プロが作成するなら、やはりＰｈｏｔｏｓｈｏｐで作成したfaviconをオススメします。

Photoshopでfaviconを作成する方法

---

photoshopにfavicon作成プラグインをインストールしていない場合は先にインストールしてください　＞＞インストール方法はこちらへ

1. faviconに私用する画像をphotoshopで作成する　画像解像度（サイズ）は６４×６４px
2. 作成した画像を透過処理する
3. 画像の画像解像度を32×32pxに変更する
4. 画像を保存する　保存形式は ICOを指定し、ファイル名をfavicon.icoにする
5. faviconをサーバーにアップロードする

faviconをウェブサイトで表示させる方法

Bloggerダッシュボード ＞テンプレート　＞　ＨＴＭＬの編集　と進み、テンプレート内の青太字の部分をfaviconのＵＲＬに書き換えます。

当社で紹介しているホームページ作成方法以外の場合は、ホームページのＨＴＭＬ内に下のＨＴＭＬを貼り付けてください。

//////////　テンプレート内にあるファビコンの画像ＵＲＬ変更箇所 ////////////////　

<!-- Favicon&#12288;&#9632;&#9632; ■■ファビコンの画像URLを入力する■■&#12288;ここから&#12288;&#9632;&#9632;

============================================================= -->

<link href='http://www.******.com/img/' rel='icon' type='image/x-icon'/>  

<link href='http://www.******.com/img/favicon.ico' rel='Shortcut Icon' type='img/x-icon'/>  

<!-- Favicon&#12288;&#9632;&#9632; ファビコンの画像URLを入力する&#12288;ここまで&#12288;&#9632;&#9632; -->

////////////////////////////////////////////////////////////////////////　

PhotoshopにＩＣＯがプラグインされていない場合は？

Photoshopを起動させていない状態で以下の作業を行います

1. ICOFormat.zip　をダウンロードする
2. 解凍し、中のプラグイン（ＩＣＯＦｏｒｍａｔ）をプログラムファイル内にある Applications/Adobe Photoshop CS/プラグイン/ファイル形式に保存する
3. ＰｈｏｔｏＳｈｏｐを起動する

起動後、アプリケーションメニューから『プラグインについて』メニューでインストールされている事を確認できます。

こちらのサイト Photoshop で背景透過の美しい favicon (ファビコン) を作成する でもくわしく紹介しています。

【別録】無料ウェブサービスでfaviconを作成する方法　PHOTOSHOPがない方に・・・・

---

ブラウザーのタグ部分に表示するファビコンを簡単に作成できるジェネレーターを忘れないうちに、

紹介しておきます。

1. 
   

   Favicon Japan!! -ファビコン作成方法-

   
   

   www.favicon.jp/favicon_create/ - キャッシュ

   Favicon(お気に入りアイコンのこと、ファビコンと読みむ)のサイト。作成方法、設置方法、登録ができます。
   このページに 2 回アクセスしています。前回のアクセス: 11/08/08
2. 
   

   Favicon Japan!! -ファビコン自動生成-

   
   

   www.favicon.jp/favicon_auto_create/ - キャッシュ

   お手持ちの画像からfavicon.icoを自動作成します。 アップロードする画像のサイズが正方形 ...