……って初めて作ったかのようなタイトルつけたけど、初めてじゃないんだよ……
メインブログでちゃんとアイコン作ったんだよ……
でもどうやったのか全く覚えてなかったから今回まるで初めて作ったかのようになっちゃったんだよ……
やれやれ。
でもとにかく1年近く前のことは覚えていられないってことは学習したから対策としてメモっとく。
いいんです、そのためにこのブログ作ったんだから。
……てことで、以下学んだこと。
はてなの場合、ファビコンのサイズが云々とか考える必要なし
このいわゆるファビコンってやつ、どこにどう表示させるものかによってサイズいろいろだし設置方法もいろいろみたいだけど、えーっ、こんな難しい話だったっけ？と思って、はてなブログの設定ページを見直したら「ブログアイコン」ってのを設定すればいいだけだった。
しかも、2MB以下のJPEG、PNG、GIF、BMP、ICOだったらOKというアバウトな話だった。正方形じゃないとマズイとかそういうことはないのかな？まあいいや。
でも一応使用されるときのサイズも考えるべき
ブラウザのタブとかお気に入りで使われるのは16×16pxとか32×32px。Windowsのデスクトップは48×48px。そしてタブレットやスマホのホーム画面が152×152px。
つまり、サイズは最低でも152×152pxであるべき。そしてデザインは16×16pxとか32×32pxに縮小されても大丈夫なものであるべき。
あと、スマホとかなぜかアイコンが丸くトリミングされるケースがあるので、一応そうなってもいいようなデザインを検討すべし。
将来はてな以外でブログをすることになったら
で、はてなの場合は「ブログアイコン」としてファイルを1つアップロードするだけだけど、そうじゃない場合はいろんなサイズでファビコンファイルを作成してそれをまとめてマルチアイコンを作る、と。将来必要になったらやり方はここだぞ。
背景の透過処理もやっておくべき
背景もデザインの一部なら関係ないけど、そうじゃないときは背景が透過するようにしておくと、はてなブログのファビコンみたいに白い背景が残らない。
左が透過してないはてなブログのファビコンで、右が透過してるあたしのメインブログのファビコン。
しかし前回は一体どうやって透過処理したアイコン作ったんだろう、あたし……。
謎だ。
透過処理のやり方
前回どうやったのかさっぱり分からないので、ググって最初に出てきた方法でやった。
透過したファビコンを作る | WordPress初心者ガイド – インストールから使い方まで
無料ソフトGIMPをダウンロードして、作ったアイコンの画像を開いて透過処理して保存し直すだけ。ソフトはここからダウンロード。
……ということで、できたのはこれ。
作ったばかりのアイコン、気に入らなくて作り直すことになっても次は少なくともやり方が分かるから大丈夫だろう。たぶん。
