PhotoshopでFaviconを作成

Webブラウザでホームページを開いたときに、URLの横やタブのタイトルの横に表示されているアイコン。
FaviconといわれるアイコンをPhotoshopでつくってみた。
プラグインを追加しないと使えないため、以下の手順を覚え書き。

■Photoshopへプラグインの追加
1)「http://www.telegraphics.com.au/sw/」からプラグインをダウンロード
2)私は、PE9(Mac版)をつかっているので、「Mac CS5」をダウンロード
3)ダウンロードされた「ICOFormat.plugin」ファイルを「アプリケーション」→「AdobePhotoshop….」→「Plug-Ins」→「FileFormats」へ移動

■Photoshopからの作成方法
1)Faviconにしたい画像を開いて「32×32」でトリミング
2) 解像度を「72dip」でサイズも「32×32」にする
3)保存をするときにファイル形式を「ICO」にし、ファイル名「favicon.ico」で保存

■ホームページ(WordPressの場合)へ適用させる
1)テンプレートファイルのヘッダ部分に以下を追加
<!– Favicon, Thumbnail image –>
<link rel=”shortcut icon” href=”<?php bloginfo(‘template_url’); ?>/images/favicon.ico”>

2)作成したFaviconファイルをテンプレートフォルダ配下の「images」へアップする

以上

中小企業診断士 山口亨
UTAGE経営研究所

関連記事

  1. XML Sitemap Generator for WordPress…

  2. IS06 Android携帯に必要なアプリ

  3. Coreserveの転送は402だから、そのままだとサイト移転時のSE…

  4. CoreserverでWordPressが開かなくなった

  5. 気持ちを新たにアメブロを再度開始

  6. IS06 Siriusα の利用レポート

  7. ロジクール・プレゼンテーション使えなかったが動いた

  8. IS06シリウスαのバッテリ

PAGE TOP