WordPressでファビコン(サイトアイコン)を設定する方法

WordPressを開設したらファビコンを設定しましょう。

ファビコンとはサイトを象徴するアイコン画像のこと。Googleのスマホ検索画面でもファビコンは目立つ位置に表示されています。

今日のブログでは、サイトを象徴する顔となるアイコン「ファビコン」をWordPressで設定する方法について解説します。

ファビコンはどこに表示される？

ファビコンはデバイス上の様々な場所で利用されています。

1.ブラウザのタブ

ブラウザでサイトを開いた際、タブにサイトタイトルと一緒にファビコンが表示されます。

2.スマートフォンのホーム画面

iphoneやAndroidでサイトをホーム画面に追加するとファビコンが表示されます。サイズも大きめで目立ちます。

3.Googleの検索結果 (スマートフォン)

現在はスマートフォンのみですが、近くWeb版でもアイコンが表示される予定です。

また、Googleトップページのショートカットでも利用されています。

と、
いろんな場面で利用されているファビコン。
まさにサイトを象徴する顔ともいえます。

ファビコンのサイズ

WordPressで推奨されている画像サイズは縦横512ピクセル以上の正方形。

WordPressでは、画像を1つ用意すれば各デバイスに合わせて自動で最適化してくれます。

画像の制作はスマートフォンの無料アプリ、CANVAなどを利用して簡単に作成できます。

関連記事：[ Canva ] 無料でWordPress用タイトルロゴを作る方法

ファビコン制作のポイント

1.デザインのポイント

とにかくシンプルが一番。

一番小さなものでは数ミリ程度でしか表示されませんので、文字を詰め込みすぎると何が書いてあるのか読めません。

会社のロゴや、屋号の頭文字1文字でデザインするのがオススメです。

2.ブランドカラーを利用する

ファビコンにはブランドカラーやサイトを象徴する色を使いましょう。

何度もサイトを訪れるユーザーはファビコンも頻繁に目にします。色でサイトを印象付けておくと、ブックマークや検索結果画面でサイトを探しやすくなります。

色数も背景1色、ロゴ1色など少ない方が視認性も高まります。

3.背景を透過させる

背景を塗りつぶさないファビコンの場合、背景を透過させると見た目もきれいです。

背景を透過させるには「.jpeg」形式ではなく「.png」か「.gif」形式で保存します。

4.デザインまとめ

WordPressでのファビコン設定方法

ファビコン画像が準備できたらWordPressで設定していきます。

メニューの [外観] > [カスタマイズ] から入り、 [サイト基本情報]をクリック。

ファビコンに設定したい画像をアップロードして [ 選択 ] します。

これでファビコンが登録されました。

ブラウザでブログを開いて、ファビコンが登録されているか確認してみましょう。

まとめ

WordPressにサイトの顔となるアイコン「ファビコン」を設定する方法についてご紹介しました。

通常のwebサイトではデバイス毎に何種類ものファビコンを設定しなければなりませんが、WordPressではその手間を簡略化し１枚の画像をアップロードするだけで完了するのが嬉しいですね。

ファビコンはサイトの顔となる大切な要素ですので、面倒くさがらずにしっかりと設定しておきましょう。