【WordPress】Favicon（ファビコン）の作り方と設定方法

WordPressでFavicon（ファビコン）を設定する方法を解説します。

Favicon（ファビコン）とは

Faviconとは、Webサイトのシンボルとして使われるアイコンのことです。

ファミコンと似てますが全く関係ありません。

ブラウザの上にあるタブやお気に入り（ブックマーク）一覧、スマホのホーム画面に表示されている小さな画像です。

ZAKKIPOSTのFaviconは以下のように表示されています。

favicon（ファビコン）

お気に入り一覧に使われていることから、

「favorite icon」　→　Favicon

「Favarite Icon」が名前の由来とされています。

ぶっちゃけ、Faviconを設定しなくても大きな支障はありません。

大きな支障はありませんが、Faviconを設定していないと、Webサイトのイメージ低下につながる可能性があります。

Favicon（ファビコン）

Faviconを設定していないと、上の例のように紙切れがぺろーんと折り曲がったようなアイコンが表示されてしまいます。
– Chromeの場合

これだと安っぽいサイトに見えませんか？素人が運営している安っぽいサイトに見えますよね。

実際にWebの素人だったとしても、素人が運営するサイトをじっくり読もうって人は少ないでしょうから、素人感はできるだけ排除した方が良いでしょう。

あと、タブをたくさん開いているときやお気に入り一覧でリスト表示されるときにFaviconがないと目立たないし、他のサイトと見分けがつかなくなってしまいますね。

最初にご紹介した通り、FaviconはWebサイトのシンボル（=顔）なので、読者の方にサイトを見つけてもらうためにも、サイトを憶えてもらうためにも、Faviconを忘れずに設定しておきましょう。

Faviconの作成方法について順を追って説明していきます。

まず、Faviconをどのようなデザインにするか考えます。

一般的には、ロゴやトレードマーク、サイト名やブランド名、企業名などを使うことが多いです。

Faviconは正方形なので、横に長いロゴやサイト名だと収まりきりません。そういった場合には頭文字だけをデザインに取り入れる方法もあります。

Faviconは表示されるサイズがとても小さいので、複雑な模様を使うと縮小したときにゴチャゴチャしたデザインになってしまいますので気をつけましょう。

Faviconはブラウザごとにサイズやフォーマットが違います。

Faviconのサイズはブラウザとデバイスによって適正サイズが異なります。
代表的なものは以下の通りです。