ブログアイコン(ファビコン)の設定方法


Bloggerではファビコンを設定できます。

本記事ではそもそもファビコンとは何なのかの説明や、その設定方法について解説します。


ファビコンについて

ファビコンとは?

ファビコン(favicon)とは、お気に入り(favorite)登録した時に表示されるアイコン(icon)を意味するフェイバリット・アイコン(favorite icon)が語源です。

お気に入り(ブックマーク)・ウェブブラウザのタグ・検索エンジンなどに表示されるアイコンのことをファビコンと呼びます。



Bloggerの初期状態では、上の画像のオレンジのBみたいなアイコンになっています。


ファビコンの役割

お気に入りの一覧から目的のサイトを探す時、ブラウザで複数のタブが開いた状態で該当のタブを見つける時……アイコンがいくつも並んでいる時に役に立ちます。

文字より絵の方がパッと見の視覚的には分かりやすいですからね。

小さいけれど自分のブログを表す重要なアイコンです。



ファビコン用の画像を準備

サイズ

Bloggerでは100KB未満の正方形の画像が使用できます。

サイズは正方形であれば問われません。

一応32px以上のサイズであれば48の倍数が基本と言われています。

ファビコンのサイズで大きめに使われるのがAndroidのホーム画面表示の256pxなので、迷ったら256×256の正方形の画像を用意しましょう。


ファイル形式

形式はpng/jpg/svg/icoどれでも構いません。Blogger側で変換してくれます。

透過pngなどで背景を透かすことも可能ですよ。


どんな画像にする?

アイコンは小さく表示されるため、できるだけ簡略されたものがオススメです。

例えばブラウザのタブのファビコンのサイズは16pxとかなり縮小されるので、細かい描写は潰れて見えにくくなってしまいます。


使用環境によって色の見え方も変わってきます。

edgeのお気に入りで、環境設定をライトとダークにして見比べるとこんな風になります。



Bloggerや自分のブログを並べてみましたが、結構見え方に差異があります。

全ての環境設定に配慮するのは難しいですが、ちょっと考慮できると良いかもしれませんね。



ファビコンの設定方法

左のメインメニューから【設定】を選択し、基本の【ファビコン】をクリックします。



【アイコン ファイルを選択】からアップロードして保存します。



ブログを確認してファビコンが反映されていればOKです。


↓↓↓


反映には少し時間が掛かります。

数時間経っても反映されない場合、ブラウザのキャッシュや履歴を削除してみてください。


にほんブログ村 ブログブログ ブログサービスへ にほんブログ村 ブログブログ ブログノウハウへ