イロイロひとりごと

ブログのこと 日々のことをつぶやいています

<はてなブログ>サイトアイコン(ファビコン)作って設定してみた

 当ブログには、広告・プロモーションが含まれています

急に思い立ってアイコンを作ってみたのでご報告(*´ω`*)

 
運営している他の2つのブログはもう作成して設定してあったんだけど、このブログはまだ作っていませんでした。
 
今日なんとなく気になってしまったので、エイっ!と作ったわけです。
 
 

サイトアイコンって?

サイトアイコンって、意外と大事な気がしています。
そもそもサイトアイコンって何よって方もいるかな?
 
アレよ、ネットみてて上のタブのところに出るアイコン。
 
私、気になる記事とかを全部開きまくってあとからゆっくり読むんです。
するとタブめっちゃあるわけ。
 
そうすると何のサイトか分かりにくいんだけど、
アイコンがあると、このサイトか!って一目で分かったりします。
 
あとはスマホでホーム画面にブックマークするときは、サイトアイコンになりますね。
…なんて書いてからiPhoneでブクマしてみたけどならなかったよ…なぜ?
※iPhoneのお気に入り(ブクマ)でアイコンを指定するには「アップルタッチアイコン」の設定が必要です。下記に解説記事のリンクを貼っておきます。
 
 
お気に入りのブックマークでファビコン(favorite icon)とも言われていますが、
はてなブログの場合、サイトアイコンが設定されてない場合はデフォルトでこの下のペンマークになります。
 
f:id:setuyakuhappylife:20150303222200p:plain
はてなブログのひとつ。ではなく、私のブログを覚えてもらいたいo(`・ω´・+o)
ここもブログデザインの一部ですね!
 
 

サイトアイコンを作成

私が作る際に使用したのはIllustratorだけど、簡単なお絵かきソフトでもいいと思う。

デザインはこんな感じになりました(*´ω`*)

f:id:setuyakuhappylife:20150303223925p:plain

 

サイズがよく分からなかったので、64ピクセルで作成して設定したところ、設定画面で引き伸ばされピンぼけ状態にw

f:id:setuyakuhappylife:20150303224114p:plain

少々不安を感じ、256ピクセルで大きめに作成。

小さく表示させることを考えて、シンプルでわかりやすいデザインにしました。

 

悩んじゃう人はブログの頭文字を正方形の四角にいれちゃえばいいと思う。

 

これを「WEB用に保存」でpngで保存しました!

 

staff.hatenablog.com


開発ブログによると、

 

対応しているファイル形式は、2MB以下のJPEG、PNG、GIF(アニメーションGIFは非対応)、BMP、です。

 

ってことです。

 

サイトアイコンの設定

設定>詳細設定から

ブログアイコンを設定します。

f:id:setuyakuhappylife:20150303225214p:plain

 

ファイルを選択して、一番下にある変更するボタンを押せば

うまい具合にサイズを調整して設定してくれます(*´ω`*)

 

すぐに反映されて、無事サイトアイコンが表示されました(*´艸`*)

 

f:id:setuyakuhappylife:20150303225927p:plain

ブログの完成度が少しずつ上っていって、やっぱりうれしい(*´ω`*)

 

まだまだやりたいことあるけどね。

今日はこの辺で(●・ω・)/

 

アップルタッチアイコンも合わせて設定してくださいね!

happylife-tsubuyaki.hatenablog.com

 

©2014イロイロひとりごと。
当ブログに掲載されている画像を、無断で他サイトへ転載することはご遠慮ください。 文章を引用する際は、引用元として当ブログURLを記載ください。