ノマゴンクエスト

自由に生きることを主題にしつつ気分により色々と落書きします。トライオートFXやトライオートETF等の資産運用。少々のライフハック等を書いてます。雑記ブログです

ブログのファビコンを作成した時に意識したポイントと導入メリット

ファビコンを導入してブログを主張しちゃいましょう!

Windows10のペイントでサクッとファビコンを作成したら、ブログが一気にブログらしくなりました!

 

ファビコンとは何ぞや?
■ファビコンとはサイトやブログのシンボルマークであり、ブックマークされた時やブラウザのタブ等に表示されるマークのことです。

ファビコンの説明

例えば、ブラウザではてなブログを開いたとき、赤枠で囲っているのがはてなブログのファビコンです。今回はこれを作製しました!

 

※ただし、私は高機能なお絵かきソフトを持っていませんので、Windows10標準のペイントで作成しました。簡易ですが、それでも、なぜもっと早くやらなかったんだろうってくらいブログが主張してきます(笑)

 

そこで、私がブログのファビコンを作る時に意識したポイントをご紹介したいと思います。

ファビコンを作製する時はなるだけシンプルにする

最初に設定したファビコン

まずは、こちらが1個目に作ったファビコンです。アルファベットを4文字並べています。Wordに文字を打ち、それを二段に分けて、着色し、スクリーンショットした画像をペイントで編集しました。超シンプル設計!

 

しかし、1個目のファビコンは失敗しました。このファビコンは、一見シンプルながらも派手に見えますが、実際にブログに設定してみたら失敗したとすぐに分かりました。

実際に表示させてみたら小さくてファビコンが見えない

文字を4文字使ってみたんですが、いざ設定してみたら文字が小さくて何が書いてあるのか分かりません。私のデザイン力のせいでもあるのですが^^;これでは読者の目にも留まりませんよね。

 

文字を用いてファビコンを作成するポイントは、文字を少なくすることでしょうね。なるべくシンプルにした方が逆に目立ちます。他のブログを参考にすると2文字くらいなら、何が書いてあるのか割りと判別できます。

ファビコンの色に拘ってブログを想起しやすくする

ファビコンは、色にも拘りたいところ。なるべくならブログでメインにしている色と同系色で合わせたいですし、読者の目に留まる色を使いたいと思いました。

 

そこで、2個目に作ったファビコンは1文字で文字を判別しやすくし、色はブログで意識して配色しているオレンジを使うことにしました。

 

実際に作製、導入したファビコンがこちらです。

採用したファビコン

平仮名『の』をイメージしました。ブログ名:ノマゴンクエストの頭文字『の』です。こちらも同じくWindowsのペイントでちゃちゃっと作製しました。かなりシンプルでしょ?(笑)※カタカナちゃうんかい!というツッコミは勘弁してください。

ファビコンをはてなブログに導入する方法

いざ、作成したファビコンをはてなブログに導入します。

はてなブログにファビコンを設定する手順

はてなブログのファビコン導入は超簡単!設定→基本設定→ブログアイコン『参照』で作成しておいたファビコンの画像を設定できます。最後にページ下部の変更するを押してやればファビコン設定の完了です。お疲れ様でした。

ファビコンが正しくブログに表示されている

これでブログにオリジナルのファビコンを設定できました。1個目に比べて分かりやすいですね。ちなみに過去記事を張り付ける際にもファビコンは表示されますし、スマホ画面にもちゃんと出てきますよ!作り甲斐がありますね!

 

例)過去記事を張り付けると左上にファビコンが表示されているのが分かります。↓↓↓

www.nomagonquest.com

例)スマホ画面の赤枠内にもファビコンの画像が表示されていますね。↓↓↓

ブログのスマホ表示にもファビコンが反映されている 

※ただし、レスポンシブデザインに変更した場合は、スマホ表示の画面にファビコンが出てきません。しかし、レスポンシブデザインはそれを補ってブログを目立たさせてくれるので非常にお勧めです!詳しくは下記の記事をご覧ください。

 

www.nomagonquest.com

まとめ

ファビコンは適度にシンプルにし、かつ色にも拘ってやることで、ブログをアピールするのに大変メリットがあり、便利な存在です。言わば、ブログの看板ですね。

 

最初は私もファビコンを導入するメリットや重要性に気づいていなくて、ブログ開設から随分と後回しの作製となりましたが、やってよかったです!

 

ブログを始めたばかりでファビコンを導入していない方は、すぐにでも導入することをお勧めします♪ブログがよりブログらしくなりますよ!というわけでノマゴンでした!ではでは!