絞れば、出てくる、アイディア。

ファビコンとは何?? 役割とワードプレスでの設定方法を紹介

日頃からインターネットを使っている方なら必ずほぼ毎日目にしているものが「ファビコン」です。
「ファビコン」とは、Google ChromeやSafari、Microsoft EdgeなどのブラウザでWEBサイトを閲覧しているときに、タブの左側に表示されている小さなアイコンのことを言います。
タブだけでなく、検索結果一覧の画面やブックマークのアイコンとしても使用されます。

今回の記事では、WEBサイトやブログ制作のときに必ず設定しておきたい「ファビコン」の役割とワードプレスでの設定方法について紹介します!

1. ファビコンとは何??

ファビコン(favicon)とは、ブラウザのタブブックマークバースマートフォンのホーム画面などに表示される、小さなアイコンのことです。

ファビコンは「Favorite Icon」の略で、ユーザーがウェブサイトを一目で認識できるように設置されます。

ブラウザのタブの左側に表示されているのが「ファビコン」です。

↑ブラウザのタブの左側に表示されているのが「ファビコン」です。

ファビコンはGoogleの検索結果ページにも表示されています。

↑ファビコンはGoogleの検索結果ページにも表示されています。

単なる小さな画像ですが、WEBサイトやブログを表す重要なアイコン的存在が「ファビコン」です。

2. ファビコンの役割

繰り返しになりますが、ファビコンは単に「小さなアイコン」ではなく、WEBサイトやブログのブランディングユーザー体験を向上させるための重要なアイコンです。

ファビコンの有り無しでは、WEBサイトのイメージや視認性が大きく異なります。

ファビコンの有り無しでは、WEBサイトのイメージや視認性が大きく異なります。

例えば、ブラウザのタブにファビコンが表示されていれば、ユーザーに一目でWEBサイトのイメージを印象付けることができます(画像上)
また、ブックマークのアイコンとしても、ファビコンが表示されているのとされていないのでは視認性に確実に差が生まれます。

↑まとめると、ファビコンの役割は大きく上記の3つになります。

weblemonを例に挙げると、レモンの中に「W」の文字のファビコンを設定することで黄色と紫、そして「レモン」のイメージを視覚的にユーザーに与えることができます。

また、ファビコンを設定することで「メンテナンスが行き届いているWEBサイト・ブログ」という印象を与えることができ、信頼性の向上につながっていると言うことができます。

3. ワードプレスでの設定方法

ここまでファビコンの役割を読んでいただいた方は、もうファビコンを設定しない理由が見つからないと思います。というわけで、ワードプレスでの設定方法を超簡単にご紹介します!

まずファビコンとなる画像を用意します。 ファビコンは正方形の画像を用意することが基本で、512px✖️512px、PNG形式、できるだけ高解像度の画像を用意します。

↑まずファビコンとなる画像を用意します。
ファビコンは正方形の画像を用意することが基本で、512px✖️512px、PNG形式、できるだけ高解像度の画像を用意します。

Canvaを使えば、無料で簡単にWEBサイトやブログのイメージにあったファビコンを作成することができます!

ワードプレスの「外観」にマウスをかざして、「カスタマイズ」をクリックします。

↑ワードプレスの「外観」にマウスをかざして、「カスタマイズ」をクリックします。

「カスタマイズ」の画面に移ったら、「サイト基本情報」をクリックします。

↑「カスタマイズ」の画面に移ったら、「サイト基本情報」をクリックします。

「サイトアイコンを選択」をクリックし画像をアップロードしてファビコンを登録したら完了です!

「サイトアイコンを選択」をクリックし画像をアップロードしてファビコンを登録したら完了です!

まとめ😺

「ファビコン」はただの小さなアイコン画像に過ぎませんが、侮れないとても大切なものです。
ファビコンがあるのとないのとでは大きな違いがあります。
設定自体は非常にシンプルで簡単なので、まだファビコンを設定していない方は、今回の記事を参考にぜひファビコンを設定してみてください!

↓ワードプレスのサイトやブログのOGP画像の設定方法はこちら!

2024-10-16
Wednesday

weblemonの筆者

YUKINKO

20代後半のWEBマーケター&WEBデザイナー
新卒で商社に入社しWEBマーケターとして勤務後、
カナダに渡航し現地企業のWEB制作と
マーケティング支援を行う。
現在は帰国し某企業でWEBマーケターをしています。

 自分がWEBマーケター・WEBデザイナーとして
仕事をしているときに気になった事を
調べた経緯を残しておきたいなという思いと、
それを誰かのお悩み解決に
役立てることができたらいいなと思っています。

“ネコとレモンのWEBマーケ&デザインブログ”
みたいな感じで覚えてもらえたら嬉しいです😺🍋

POPULAR POST

LATEST POST