Webサイトファビコン(favicon)とは、Webブラウザのタブ上でページタイトルと一緒に表示されるアイコンを指します。ファビコンを活用することで検索エンジンでのクリック率は上がり、サイトの認知度も高めることが可能です。
しかし、Wordpress(ワードプレス)の初心者の方からすると設定が難しいのではないでしょうか。実際には、すごく簡単な作業で設定が可能ですのでご安心ください。
そこで本記事では、Wordpressでのファビコンの設定方法について紹介したいと思います。
ページコンテンツ
Webサイトのファビコン(favicon)とは!?
Webサイトのファビコンとは、Webサイトのタブ上でページタイトルと一緒に表示されるアイコンを指します。
ファビコンがあることによって、Webサイトの運営者情報をイメージされやすく、Webサイトの信頼性に繋がり、結果としてクリック率が高くなることが知られています。
Webサイトの一般的なファビコン設定方法
通常Webサイトのファビコン設定を行うときには、headタグ内(<head></head>)に以下の記述をするだけです。
これがフロントエンド初心者にとっては、テーマファイルを触るのが大変なので、せっかくWordPressを使っているなら、WordPressの機能で入れてしまった方が早いです。
WordPressのファビコン設定方法
WordPressでWebサイトを運用している場合には、ファビコンの設定がとても簡単です。以下で手順を紹介します。
手順1: ファビコンに利用する画像を準備する
ファビコンに利用できる画像は正方形の縦横比率が等しいものを利用することが望ましいです。WordPressの場合には、最大512pxの画像が利用可能ですので、512px × 512pxの画像が一番望ましいです。
kirin.jpg
WordPressで実際に以下のキリンさんの画像を、ファビコンとして設定してみようと思います。本ファイルは事前にAdobeのイラストレーターで作成した画像となります。またファイルフォーマットはJPEGを使用していますが、他にも「.ico」、「.png」などが利用可能です。
手順2: WordPressの管理画面からファビコンを設定する
実際にWordPressの管理画面から「外観」➡︎「カスタマイズ」を選択しビジュアルエディターに遷移した後に、以下の「サイト基本情報」を選択しましょう。WordPressでは、以下の「サイトアイコン」欄から簡単に設定可能です。
「サイトアイコンを選択」をクリックしましょう。すると、WordPressのメディアライブラリ(WordPressに表示させるための画像を格納するファイル)にアクセスできるので、ファビコンとして利用したい画像を選択しましょう。
選択した画像(kirin.jpg)が正しく反映されていることを確認しましょう。ここでは保存が確定されていないので「公開」をクリックし変更を確定しましょう。これによりファビコンが公開されます。これで設定は完了です。
手順3: 設定したファビコンのブラウザ反映を確認する
設定したファビコンがブラウザできちんと表示されているかを確認しましょう。管理画面での見え方と異なることも大いにあり得るので気をつけましょう。
しっかりと反映されていることを確認できれば、設定は完了です。
冒頭でも説明した通り、Webサイトにファビコンを設定することにより、サイトのブランディングや流入にも1役買うのでファビコンをすぐに設定することをオススメします。