ブログ

ファビコンとは?タブにアイコンを作る『Favicon Rotator』

  • このエントリーをはてなブックマークに追加
  • follow us in feedly

ダイレクトレスポンスマーケティングで音楽業界に恩返しを誓う!
たけやんこと、永田武です。

今回は、

ファビコンとは?タブにアイコンを作る『Favicon Rotator』

についての説明です。

Favicon Rotator01

色々なホームページやサイトを見ていると、
たまにブラウザのタブにアイコンみたいなものがありませんか?
※上記画像参照

このアイコンがファビコンといい、
WordPressのプラグイン『Favicon Rotator』をインストールすれば、
自由にファビコンを作成することができます。

 

ファビコン画像の作成

まずは、ファビコンの素材を用意しましょう。

タブに表示されるファビコンのサイズは16×16(px)なのですが、
デスクトップ表示された時にしっかり表示されるように、
32×32(px)のサイズがおススメです。

favicon

 

※拡張子はPNG , GIF , JPG(JPEG)のどれかで作成してください。

次にこの画像を、ファビコン専用のファイルに変換します。

Favicon Rotator02

favion.icoを作ろう

上記サイトから、中画像(32×32)のボタンでファイルをアップロードし、
『favicon.icoの作成』をクリックします。

Favicon Rotator03

画像を確認し、ダウンロードします。
『favicon.ico』というファイルが出来るので、保存してください。

これでファビコン画像の準備ができました。

 

Favicon Rotatorのダウンロードとファビコンの設定

  1. Favicon Rotator』で検索し、インストールと有効化をクリックします。
    Favicon Rotator04

     

  2. 『外観』の『Favicon』をクリックします。
    Favicon Rotator05

     

  3. 『Browser Icon』の『Add Icon』をクリックします。
    Favicon Rotator06

     

  4. 先ほど上記で作った『favicon.ico』を選択し、アップロードします。
    画像を確認して、問題がなければ『Add Browser Icon』をクリックします。
    Favicon Rotator07

     

  5. 同様に、『Touch Icon』でも同じファイルをアップロードします。
    Favicon Rotator08

     

  6. 画像のアップロードが完了したら、『変更を保存』をクリックします。
    Favicon Rotator09

     

  7. これで完了です。
    ちゃんとブラウザのタブに表示されています。
    Favicon Rotator10

 

ファビコンでライバルと差をつけろ!

ほんの小さなアイコンではありますが、
これがなかなかバカにはできません。

Favicon Rotator11

タブだけではなく、ブックマークでもしっかりとアイコンが表示されます。

Favicon Rotator12

明らかに目立ちますよね?

簡単に誰でも閲覧できるサイトだからこそ、
ささいなきっかけがアクセスアップや、リピート率に繋がります。

是非ともファビコンは設定しましょう。

 

以上、

ファビコンとは?タブにアイコンを作る『Favicon Rotator』

に関する記事でした。

 

追記

icoのファイルでうまく表示されない場合は、
変換前の元素材(PNG、JPG、GIFなど)をそのままUPしてみてください。

  • このエントリーをはてなブックマークに追加
  • follow us in feedly

人生の選択肢を増やすための永田武公式メールマガジン

コメント

  1. monと申します。
    ブログランキングからきました。

    ワードプレス僕も使っています。
    最初は難しく感じていましたが、
    そんなことはなかったですね。

    これからもよろしくお願いします。
    応援ポチっと。

    • コメントありがとうございます。

      私も最初は抵抗がありましたけど、
      やっているうちに大分慣れてきました。

      まさに、
      『できるからやるのではなく、やるからできる』
      ですね!

  1. この記事へのトラックバックはありません。

Facebook Twitter YOUTUBE google google

コンテンツカテゴリー

最近の記事一覧

ページ上部へ戻る