しゅーたろーです。
・ どうやって作るの？
そんな悩みに答えます。
僕が作成した事例も紹介していきます！
ファビコン（favicon）の作り方！ツールも紹介します【WordPress】
ファビコン（favicon）とは
ざっくり言えばサイトのシンボルマークのことです。
サイトアイコンと言ったりもします。
作成するメリットは以下です。
・ サイトを覚えてもらいやすい
以下はTwitterのfaviconです。googleの検索一覧でリンクの上部に出てきていますね！
ここだけでなく、ブラウザのタブ等様々な場所に表示されます。
faviconが未設定だとデフォルトのマークが表示されるのですが、インパクトに欠けてしましまいます。アクセス数UPにもつながるので是非作成しましょう！
作成に使用したツールについて
ぶっちゃけ絵をかければなんでも良いです。
僕はCanvaというデザインツールで作成しました。
有料版を使用していますが、無料でも問題ないです！
画像サイズとファイル形式について
僕は以下のルールで作成しました。
・ png形式で保存する
faviconは「.ico」というファイル形式で作成することが推奨されていますが、WordPressに関してはバージョン4.3以降であれば、この形式でなくても大丈夫です。
作ってみよう
早速作っていきます。
まずはデザインの大枠を決めますが、以下を意識しましょう。
・ インパクトを持たせる
ファビコンはとっても小さいです。
目に留まり、インパクトのあるデザインを目指しましょう。
僕はこんな風につくってみました！
センスは置いておいて、とりあえずこれでいきます。笑
Canvaではダウンロード時に透過させるかどうかを選択することができます。
WordPressに反映させよう
このブログは「THE THOR」というテーマを使用していますが、以下に項目がありました。
外観 ＞ カスタマイズ ＞ サイト基本情報 ＞ サイトアイコン
アップロードして完了です。
512pxの正方形で作成しましたが、WordPress内部でサイズの違うfaviconが自動で生成されています！
faviconでサイトに個性をつけよう
今回はfaviconを作成するメリットと、作成方法について解説しました。
- favionはサイトのシンボルマーク。適切に作成すればPVアップも狙える
- 作成ツールはCanvaがオススメ
- WordPressであれば、512px以上の正方形でアップロードすればよい
みなさんも独自のセンスでデザインしてみてください。
favicon作成を通じて、僕のセンス皆無であることが判明いたしました！
今回は以上です。