富士鷹ナスビが運営する個人サイト。自作の小説やWEBに関するお役立ち情報などを多数掲載中。WEB関連シェアするLINE!favicon(ファビコン)とは、ブラウザのアドレスバーやタブなどに使われるアイコン画像のことです。当サイトのファビコンはこんな感じですね。今回はこのファビコンの簡単な作り方をご紹介します。まとめ「favicon(ファビコン)」の作成手順ファビコンの作成手順は大きく分けて全部で三工程あります。画像の作成マルチアイコンの作成サイズの決定まず作成するファビコンのサイズを決定します。言うのも、使用されるユーザーの環境によってファビコンのサイズはまちまちなのです。サイズは基本の基本のようですが、実は色々な表示サイズがあるため特に最初は困惑する部分かと思います。実際、自分の時がそうでした。以下が比較的よく利用されるファビコンのサイズの一例です。64px:高解像度のWindowsサイトアイコンで使用されるサイズ他にも、現在では20以上のファビコンのサイズがあるらしいです。お願いだから規格を統一してください。いうわけでして、これを読まれた方は「じゃあサイズをどうすればいいの?」とますます混乱してしまうかもしれませんが、個人的な結論を先に申し上げますと16×16と32×32の2パターンあれば十分です。それで主要なブラウザはほぼカバーできます。作っても大変ですし、ファイルサイズも大きくなってしまいます。(32×32だけでもいいのですが、たまに上手く縮小されないことがあるので16×16もあった方がいいです)ですので、ファビコンのサイズは16×16と32×32の2パターンを用意しましょう。画像の作成サイズが決まったら、次は実際に画像を作成します。AdobeのIllustratorなどがあればそれを使って下さい。「そんな有料ソフト持ってないよ」という方は、無料のソフトをダウンロードして使用して下さい。個人的には『Inkscape』が無料で機能も充実しておりオススメです。ファビコンのデザインですが、特にこだわりがなければ背景は単色で塗りつぶし、そこに見やすい色でサイトの頭文字などを中央に配置しましょう。非常に簡単で、かつそれっぽく見えるようになります。32×32のサイズで作ったら、それをそのまま縮小し16×16を作ります。拡張子はpngでいいでしょう。ちなみに自分の場合、サイトの名前は「ワナビー」ですが、カタカナで「ワ」にしたら「ク」と見分けがつかなかったので、ひらがなの「わ」にしました。画像が2つ用意できましたら、それを一つにまとめます。これをマルチアイコンといいます。難しいことはありません。元になる画像を用意すれば、マルチアイコンはWEB上ですぐに無料で作成できます。具体的な手順としては、まずマルチアイコン作成サイトにアクセスします。次に先ほど作成した二つの画像を順番に選んで、最後に「アイコン作成」をクリックします。すると自動でマルチアイコンが生成されます。マルチアイコンが出来上がったら、ダウンロードしましょう。以上で現在の主要なブラウザにしっかりと対応した立派なファビコンの完成です。まとめ簡単なファビコンの作り方、いかがでしたでしょうか。今回はなるべく簡単に作れるようデザインも極めてシンプルなものを紹介しましたが、なれてきたらご自身で凝ったものを作られても面白いと思います。ファビコンはある意味サイトの顔になるものですし、実際ブラウザのタブに自分が一生懸命作ったファビコンが表示されたら、それだけで嬉しいものですよ。ファンタジーものを書こうと思った時に中々外国人の名前はぱっと思い浮...記事を読むjQuery「simplaModalwindow.js」をカスタマイズしてシンプルなモーダルウィンドウが実装できたお仕事でモーダルウィンドウを実装するように依頼されました。Ruby」がかなり便利だったWordPressで小説サイトを作るにあたって絶対に欲しくなるもの。それがルビ周りのプラグインだと個人的に考えています。自分が探し回...記事を読む無料で使えるExcel「LibreOffice」の表計算ソフト「Calc」がかなり優秀だった自分は仕事上、結構な頻度でExcel(エクセル)を触る機会にあります。マイクロソフトのオフィスは高いので、今までずっと無料で使...記事を読むみんなに愛されている秀丸エディタを使って愛される理由がわかった自分は仕事と趣味のそれぞれで沢山のテキストエディタを触って来ましたが、今回改めて初心に帰り秀丸を使ったところやはり使いやすかったので...記事を読む英語のアナグラムが自動生成できるサイト「Wordsmith」を使ってみたら面白かったアナグラムとは、アルファベットの綴りを入れ替えて別の単語や文章にすることを意味します。