HOME   »   ブログ運営  »  FC2ブログでファビコンを設定する方法
RSSフィード
通常、自分のFC2ブログのページを開いた時に、タブの左側にFC2のファビコンが出ます。また、お気に入り登録した時のアイコンもFC2のファビコンです。

このファビコンを、任意の画像に変更する方法を紹介しようと思います。ブログ独自の色を出しやすくする良い方法だと思います。
Skitched 20130815 191145

スポンサーリンク
まず、ファビコンとは何ぞやということで、Wikipediaより引っ張ってきました。なるほど、Favorite iconの略称のようです。
Favicon(ファビコン)は、ウェブサイトのシンボルマーク・イメージとして、ウェブサイト運営者がウェブサイトやウェブページに配置するアイコンの俗称である。Favorite icon(フェイバリット・アイコン:お気に入りアイコン)という英語の語句を縮約したものである。


今回、FC2ブログでファビコンを設定するにあたって、以下の記事を参考にしました。


ファビコンを設定する手順としては、
  1. ファビコンにしたい画像(大きさは16×16で拡張子は.ico)を用意
  2. その画像をFC2サーバーやアップロード
  3. ブログテンプレート(html)から、head内に指定したタグを埋め込む
になります。

それでは手順を紹介していきます。

1.ファビコンにしたい画像(大きさは16×16で拡張子は.ico)を用意

ファビコンにしたい画像の大きさの変更には、無料MacアプリのResizeitを使用しました。
Skitched 20130815 193945
▲数値指定してやりました。

ResizeIt App
カテゴリ:グラフィック&デザイン
価格:無料(記事掲載時点)
バージョン: 3.6.0
リリース日:2011/03/02


また、拡張子の変更は、Finderから行えます。
Skitched 20130815 194154
▲Finderから画像をみつけて、名称を変更すればOKです。

2.ファビコン画像をFC2サーバーにアップロード

通常の画像アップロードのように行うだけです。
Skitched 20130815 194407
▲ファイル選択から、ファビコン用画像を選択してアップロードします。

3.ブログテンプレート(html)から、head内に指定したタグを埋め込む


ブログのテンプレートから、PC用テンプレートの中を編集します。</head>の上の部分に、以下のタグを埋め込みます。

<link rel="shortcut icon" href="http://blog~~~.ico(ファビコンのアドレス)">
Skitched 20130815 195132
▲埋め込んだら、更新を押せば完了です。Twitterアカウント@nasimeyaと同じアイコンにすることが出来ました。

例えば、PCのタブを沢山開いている時に、このブログのページは一目でわかるかと思います。あとはお気に入りのページに追加した時にパッと見てわかるでしょう。

わずかではありますが、ユーザーにとって使いやすくなったのかなとは思います。

FC2ブログを利用している方は、自分のブログにファビコンを設定してみてはいかがでしょうか。



関連記事

ブログのはてブ人気エントリーをサイドバーに設置する方法

FC2ブログでコードを行番号つきで表示する方法

FC2ブログで最新記事にサムネイルを付けてサイドバーを見やすく!

FC2ブログでPocket用ボタンを設置する方法とその利点

リピーター確保作戦!ブログにFeedly登録用ボタンを設置する方法

FC2ブログのスマホ版テーマ「basic_black_st」でのブログタイトルを全て表示する方法

FC2ブログで記事のタイトルにブログ名を含めない方法

2013年5月版現在使用しているブログ用iPhoneアプリ13個

スポンサーリンク

過去記事セレクション

当ブログの過去記事の中で、オススメの記事25個をまとめたページを作成しました。500記事を超えた中から厳選していますので、どれもオススメできる記事となっています。もしも興味がありましたら、是非一度ご覧ください。
公開記事が500を超えたので、過去記事の中からオススメを25個セレクトしてみました



▼このカテゴリの最新記事
Relate Entry
Entry TAG
ファビコン   ブログ  
Comment
Trackback
Comment form
サイト内検索
全記事表示リンク

PAGE TOP