windowsのアクセサリにあるペイントを使ってFavicon（ファビコンと読む）を作ってみました。ファビコンというのはブラウザのタブに表示される画像です。ブックマークをつけたときも表示されます。
ファビコンがない状態のタブ
ファビコンがある状態のタブ
それでは作り方です。windowsのペイントを立ち上げたらサイズ変更をして正方形の枠になるようにします。正方形であればサイズは適当で大丈夫です。あまりにも枠が小さいとペイントでは書きづらいので、ここでは300ピクセルの正方形にしました。
①赤枠のサイズ変更を押下する。
②青枠のピクセルを選びサイズを指定する。
③「OK」ボタンを押下する。
そうすると、以下のように正方形の枠になります。
ここにファビコンの絵を書きます。ペイントは簡易ソフトなので細かい絵は難しいです（無理です）。図形を組み合わせたデザイン程度であれば大丈夫でしょう。書き終わった絵が以下です。
これをpng形式で名前をつけて保存します。ファビコン用の画像が出来たのでワードプレスの設定に入ります。ワードプレスでは任意の画像をサイトアイコンとして登録すればファビコンとして設定してくれます。本サイトはワードプレスで運用しているので、この方法でファビコンを設定しました。ワードプレスでの操作の仕方です。
まず、管理画面の左側のメニューから「外観」→「カスタマイズ」を選択します。そうするとカスタマイズの画面が表示されるので「サイト基本情報」を押下します。
画面の左下にサイトアイコンの表示が出るので「サイトアイコンを選択」を押下します。512ピクセル以上と書いてありますが簡単なデザインなので気にしてません。正方形なら大丈夫でしょう。
png画像を選択してアップすると画像切り抜きの画面が表示されます。僕の場合は切り抜きが不要なので右下のボタンは「切り抜かない」のほうを選択しました。先ほど画像は512ピクセル以上と書いてありましたが、切り抜く必要があるのでそのような指定をしているのかな？とも思いました。
画像切り抜きの画面を閉じるとサイトアイコンとして選択した画像が表示されています。上部にある「公開」ボタンを押下してファビコンの設定は完了です。
ワードプレスでファビコンを設定するのは簡単なので、もっと早く設定しておけば良かったです。。
[広告]
ワードプレスではなく普通のWEBサイトでファビコンを設定する場合についても書いておきます。ファビコンは通常ico形式なので、先ほどのpng形式の画像をico形式に変更する必要があります。この変更については、以下のサイトを利用させていただきました。
ファビコンはブラウザごとにサイズが異なるようですが、16×16と32×32があればだいたい大丈夫らしいです。なので、ピンク色の枠で囲った「ファイルを選択」のところに先程作成したpng形式の画像をそれぞれ指定します。その後に、緑色の枠の「作成」ボタンを押下します。
そうすると、ファビコンが作成され「ダウンロード」ボタン（緑色の枠のところ）が表示されるので、押下してダウンロードします。ダウンロードしたファビコンはfavicon.icoと言う名前になっています。
これでファビコン画像（ico形式）の作成は完了です。これをWEBサーバーのドキュメントルートにfavicon.icoという名前で配置するだけでブラウザがファビコンを認識してくれます。HTTPファイルの修正も不要です。ちなみにドキュメントルートとは、https://www.example.com/index.html のURLがあった場合、index.htmlを格納しているディレクトリになります。レンタルサーバーを借りてWEBサイトを運営している方はレンタルサーバーの提供元に聞いてみてください。
もしファビコンが認識されない場合、ブラウザにキャッシュが残っていると思うのでキャッシュのクリアをしてみてください。ChromeとFirefoxのキャッシュのクリアの方法は以下です。
ChromeのキャッシュとCookieの消去
Firefoxのキャッシュを消去するには
Firefoxでキャッシュをクリアする画面を載せておきます。データを消去（赤枠のところ）を押下するとキャッシュがクリアされます。
ブラウザで再表示すれば、ファビコンが表示されると思います。