書評

【ブロガー必見】ファビコンの作成方法【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を使用して、画面を拡大した後、強引に切り取りを行いました。

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

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

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

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

 

ちなみにcanvaでは無料のアイコン素材が使えたりロゴ作成もできます!

簡単で自由度も高く超おすすめです。是非使ってみてください。

▼デザイン例

【Canvaブログ】無料のアイコン素材を使ってデザインを簡単作成

ロゴ作成

スポンサーリンク

Amazonチャージ

【Amazonでお得に買い物ができる】

Amazonギフト券で事前に現金チャージをしておくと、チャージ金額に対して最大2.5%のポイントが還元されます。

チャージ金額通常会員プライム会員
5,000円〜19,999円0.5%1.0%
20,000円〜39,999円1.0%1.5%
40,000円〜89,999円1.5%2.0%
90,000円〜2.0%2.5%
モリゴッド
モリゴッド
たとえばプライム会員なら、50,000円チャージすると1,000ポイントがもらえるよ!

さらに、今なら初めてのチャージで1,000円分のポイントがもらえるキャンペーン中。つまり、5,000円をチャージすると1,050ポイント付与。

\ポイント還元率20%超え/

詳細はこちら