ブログ運営

【ブロガー必見】ファビコンの作成方法【29/100】

こんにちは。森GODです。

ファビコンをご存知ですか?

サイトのアイコンのようなものです。主にサイトを訪問しているときやブックマークなどで使用されています。

こんな感じです。

そして本日、以前より設定したいと思っていたファビコンをついに設定しました!5分ぐらいで終わるかと思っていましたが、意外と苦戦。

他にも同じようにつまづく人がいると思うので、私がどのようにして設定に至ったかを共有します。

 

Googleで『ファビコン作成 無料』で検索すると、かなりいい感じの無料サイトが出てきました。

https://www.favicon.cc/

色を選んで、キャンバスに描くだけ。とても簡単なツールです。私はシンプルに数字の26を作ったので3分程で完成しました!

めっちゃ簡単!と思って設定してみたところ、私の使っているワードプレスのテーマ『JIN』では推奨サイズが512×512ピクセルということで、設定ができませんでした。(おそらくスマホのアイコンでも使用できるように設定されているため)

 

それならサイズ変換ツールでリサイズしよう!

ということで下記サイトにて変換を試みました。

https://favikon.com/

結果は、、、画像が対応していませんでした。画像のサイズが原因か、拡張子(.ico)が原因かは分かりんがとにかく対応していなかったので、断念。

 

うーん。もう既存のアイコンを使用するか!

ということで下記サイトに飛んでみました。

http://icooon-mono.com/

しっくりこない!特に使いたい画像がない・・・。

 

やはりこれは自分で作ろう!と思い飛んだのが

canva

というサービスです。こちらも無料。

テキストやら画像の素材やら色々組み合わせて画像の作成が可能です。

『これでついに完成だー』と思っていたのも束の間、縦横比が合わず、、、やり直し。

しかし、canvaはすごかった。

文字の間隔調整も可能。間隔を狭くすることで縦横比を強引に合わせにいきました。

そして、やっと完成!と思いきや、設定してみると26が小さすぎて(白のスペースがありすぎて)見にくい!

最終的にはGoogle Chromeの拡張機能Lightshotを使用して、画面を拡大した後、強引に切り取りを行いました。

最終的に完成したのが、このファビコンです。

なんとか完成して、めでたしめでたし。なんとなくブログのモチベーションが上がりました✨

ワードプレスのテーマによっても変わってきたりすると思うので、その辺は調べながら進めたほうが良さそうですね!

ブロガーの方は是非設定してみてください。

スポンサーリンク