どうも、SUMAです。
最近、WEBプログラミングを再度勉強し直そうとしてホームページを作ろうとしたらファビコンの作り方を忘れてしまっていたため、この記事を備忘録として残したいと考えました笑
この記事では、僕が再度調べ直したファビコンの作り方を紹介していきたいと思います。
WordPressでの設定の仕方をベースにして紹介をしますが、自分でHTMLをいじりながらホームページを作成するという方にとってもファビコンの作り方は参考になると思います。
コンテンツ
すぐにファビコンを作れるサイトを紹介
favicon.cc
favicon.ccはブラウザ上で自分でファビコンを作成できるツールです。
画面左側のカラーピッカーで色を選び、フレーム内にある□を塗りつぶしていけば完成です。
フレーム内で完成させることができたらフレーム下にあるダウンロードボタンをクリックすることで手軽にicoファイルをダウンロードできます。
僕自身、このサイトでファビコンを作成した経験があるのですが、使い方もわかりやすいのでおすすめです!!
ファビコンfavicon.icoを作ろう
こちらのサイトでは既存の画像をico形式に変換してくれます。多少サイズの大きい画像を選んでもファビコンのサイズに合わせて小さくしてくれるので、既にファビコン用のデザインが決まっている方にはこちらをおすすめしたいと思います。
企業ロゴをそのままファビコンにしたい方やPNG形式の画像ファイルでファビコンにしたいと思っている画像をお持ちの方には使いやすくて良いサイトだと思います。
ファビコンとは?
さて、最初にファビコン形式のファイルを作成する方法について、紹介をしましたが「そもそもファビコンって何?初めて聞いた」という方もいるかと思います。
簡単に言えばファビコンとは、「favorite icon(お気に入りのアイコン)」を略したもので、サイトのシンボルマークのことです。
上の写真はこのサイトのファビコンを赤丸で強調して表しています。
サイトを開いている時のサイト名の前についているアイコンで会ったり、お気に入り登録をしたときにアイコンが付いているのが見て取れるかと思います。
これがファビコンですね。
TwitterやYouTube、その他企業のサイトなどでもファビコンが設置されているサイトは多いです。普段自分の利用しているサイトでも使用してないか確認してみると面白いかもしれませんね。
保存形式がico
ファビコンがどんなものなのかということについてはわかってもらえたかと思います。
次に皆さんが思うのは「じゃあファビコンってどうやって設定すればいいの?画像形式ってJPEGとかPNGとかあるけど何を使えばいいの?」
ということですよね。
結論としては、ファビコンにはicoという保存形式の画像ファイルを使います。
icoファイルの作成方法については前述していますので、確認してみてください。
そもそもファビコンってどんなメリットがあるの?
「ファビコンについてはわかったけど、ファビコンを設置するメリットって何なの?」「別に設置しなくても困らないでしょ?」
という方もいらっしゃるかもしれません。
確かにファビコンを設置したとしても、検索順位は上がったりしませんし、劇的に何かしらの効果があるわけ絵もありません。
しかし、ファビコンがあることでユーザーの方がズラッとタブを並べた中で目立ちやすかったりだとか、「このアイコンのサイト前にも見たことあるな」と思ってもらいやすくなる効果があったりします。
見てくれた人の記憶に残りやすくなるというのは実は大きなメリットではないでしょうか?
WordPressでファビコンを設置する方法(未作成のため後日追記致します)
まとめ
さて、皆さん無事にファビコンの設定をできたでしょうか?
ファビコンを設定することによって検索上位になったりだとか、劇的にPV数が増えたりすることはありませんが、ブックマークから見たときにすぐにこのサイトだなってわかってもらえますよね!
ぱっと目につくということは見てくれている相手の意識に何度も訴えかけてくれるということです。
些細なことかもしれませんが、大事なことだと思いますのでまだ設定をしていない方がいたら、「ちょっとおもしろそうだからやってみようかな」という軽い感覚で良いのでやってみてはいかがでしょうか?
以上、SUMAでした。