ブラウザタブのアイコン設定でサイトを埋没させない

タブに設置された画像「ファビコン」の重要性

インターネットで調べ物をしていると
ブラウザが複数のタブで一杯になって
今自分がどこにいるのか分からなくなること
ありませんか?

↓こんな状態↓




白いページアイコンの横に
文字がズラッと並んで
右端の文字は省略されます。

ブックマークで見ると一目瞭然ですが
ブラウザのタブにアイコンを設置しないと
お目当てのページが埋もれて
パッと探しにくいですよね。

ブックマーク マネージャ 2015-08-23 06-28-23

有名な企業やサイトは
必ずブラウザのタブに
アイコンを設定しています。

タブ


これなら複数のタブを開いていても
迷うことなくページを見つけることが出来ますね。

ブックマークやブラウザタブの左にある
小さなアイコンは
「ファビコン(Favicon)」と言って
Favourite(お気に入り)と
Icon (図形・象徴)を組み合わせた言葉です。


ファビコンは16×16ピクセルと
とても小さな小さなマークですが
タブにアイコンを設定してあるだけで
ひと目でサイトを見分けられるので
小さいながらも役割は重要です。

ファビコンの色やデザインはシンプルな方が
小さくても潰れませんので
私は白の背景に「ワ」と一文字
バカみたいに単純化してみました。



wordpressタブアイコンを変更する超簡単な方法

ファビコンを設定するには
用意した画像を16×16ピクセルの
「.ico 」形式の拡張子に
変換する必要があります。

ファビコン変換ツール「Favicon Converter」に
画像をアップロードして
プルダウンメニューでサイズを選択し
「アイコン作成」をクリックすると
リサイズされた「.ico 」形式の拡張子の
画像がパソコンにダウンロードされます。

Favicon Converter

アイコン(icon)変換ツール - Favicon Converter 2015-08-16 15-12-25



Macで.ico形式に変換するならプレビューが便利

Macをお使いなら「プレビュー」で簡単に
.ico形式で保存することができます。

プレビュー

今回私が用意した
「ワ」の画像は「.png」ですので
「.png」をico形式に
変換してみたいと思います。

わ.png

プレビューの「ファイル」から
「書き出す」を選びます。

プレビューで書き出す

ところが、この状態だと保存形式は
次の通りで「.ico 」形式の拡張子は
選択できません。

保存形式

「.ico 」形式の拡張子を表示させるには
「書き出す」をクリックし

プレビューで書き出す

その後に「option」をクリックします。
すると「GIF」など、
保存形式の選択肢が増えました。

オプション

「Microsoft アイコン」を選択して保存すると

書き出す 2015-08-23 08-32-56

「.ico」形式で画像が保存されます。

いやいや「プレビュー」って
奥が深いんですよね。



wordpressにプラグインをインストールする

「.ico」形式の画像が用意できたら
wordpressにプラグインをインストールします。

プラグイン→新規追加から
「All in one Favicon」
検索窓に入力します。

All in one Favicon 2015-08-16 15-16-06

「いますぐインストール」で
インストールが完了した後に
「プラグインを有効化」すると
サイドバーの「設定」に
「All in one Favicon」が表示されます。

All in one Favicon

後は「ICO Frontend」に用意した
ICO画像をアップロードして
「変更を保存」するだけです。

ちなみに「Check box to delete favicon. 」に
チェックを入れると削除されますので
ご注意ください。



ファビコン画像なんて作れない!?

もし、あなたが
ファビコン画像なんて作れないよ〜
という場合は
ファビコンを簡単に作成できる
ジェネレーターを使うと便利です。

「favicon.cc」なら
プレビューで見た目を確認しながら簡単に
ファビコンを作ることができます。

favicon.cc

favicon.ico GeneratorPreview

他にもインターネットで
「無料オンラインジェネレーター ファビコン」
など入力して検索すると、
ファビコンを作成できるジェネレーターは
たくさんヒットします。

ぜひお試しください。



最後まで読んでいただき
ありがとうございました。



ランキングに参加中です。
少しでも私の記事がお役に立ちましたら、
応援していただけると励みになります。
↓ ↓ ↓




スポンサード リンク

コメントは受け付けていません。

サブコンテンツ

運営者の紹介

名前:うみぞう
年代:40代
性別:女性
職業:デザライター
詳しいプロフィールはこちら
【メッセージ】
40代OLが隙間時間を利用してパソコンを最大限に活用したインターネット・マーケティングを実践中!


ブログランキングに参加中!!

人気ブログランキング1位

お陰様で1位をいただきました。

フォローしてください

このページの先頭へ