WEBサイトのfavicon(ファビコン)について書かせていただきます。
faviconはご存知でしょうか?
WEBサイトをパソコンのブラウザで開くと、タブの左端に表示されている小さな画像アイコンです。
サイトを目立たせることにも役立ちます。
ただしこの画像はWEBサイトで故意に設定しないと未設定のままになります。
今回は、このfavicon画像の作成方法について書かせていただきます。
【favicon画像の作成方法】
※今回は既にお持ちの画像をアイコン化する手順を紹介します。
※Windowsで無料ツールを使って簡易的に画像を作成する手順になります。
①画像を正方形にする
Windowsに元々インストールされている「Paint」ツールを使用します。
1)ホームタブの選択をクリック
2)切り取りたい画像の範囲を選択
3)ウィンドウ下部にピクセル数が表示されるため、正方形になる大きさに範囲指定
4)コピーして別のPaintウィンドウに貼りつけ保存
※少々コツがいる作業になります。別のツールを使うともう少しやりやすいかもしれません。
参考サイト
②画像サイズを変更
faviconアイコンは64px×64pxのサイズに変更する必要があります。
1)「画像を縮小する!」サイトで希望のサイズに変更可能なため、以下のサイトにアクセス
https://resizer.myct.jp/
2)画像サイズ選択のラジオボタンエリアにて、テキストボックスに「64」、単位を「px」にセット
3)「縮小する!!」ボタンを押す
4)しばらくすると、「 全ての画像をZIP形式でダウンロード」
また、iPhone、Andoroid用のアイコンは別のサイズで作成する必要があるため、詳細については以下の参考サイトをご確認ください。
参考サイト
③アイコンファイル(icoファイル)作成方法
フリーソフトの「@icon変換」を使用します。
1)「@icon変換」を起動
2)画面左ペインに変換したい画像をセット(開くボタンから選択できます)
3)ツールバーの「単独アイコンに保存」ボタンを押下
参考サイト
https://qiita.com/Kosen-amai/items/4700100342c76f9fda78
今回の方法は一例ですので、他にも効率的なやり方があるかもしれません。
参考になれば幸いです。