favicon(ファビコン)を設定してみよ～

favicon(ファビコン)を設定してみよ～

今日はWEB1年生のちょっとした簡単TIPS、「ファビコンを設置してみよう」ってお話を。

ファビコンって何？っていうと、ブラウザの上のURLバーとかに載るアイコンの事です。

これを設置すると、URLのバーだけでなく、ユーザーがお気に入りに入れた時にも目立ってわかりやすいよね。

でファビコンの作り方というと、色々やり方があるんですけど、
一番簡単なのはファビコンを作ってくれるwebサービスと使ってしまえば一瞬。
http://www.favikon.com/
ファビコン作成webサービスもたくさんあるんですが、↑ここのサービスが簡単だったのであげておきます。

• ・STEP１で画像をアップロードして、右の画面でファビコンにする部分をトリミングするだけ。
• ・あとはSTEP２でファビコンを作成して、右側の「Download Favicon」でダウンロード。

これでファビコン作りは完了。次は設定に入ります。

まず作ったファビコンをFTPソフトでサーバーにアップロードします。

そしてHTMLの＜head＞〜〜〜〜＜/head＞の中に以下を設定！

<link rel="shortcut icon" href="ファビコンまでのパス/ファビコンの名前.ico">

これで完了！

簡単ですね。外部CSSを設定するのと似た感じです。もちろん絶対パス／相対パスでも大丈夫。

ファビコン設定しているサイトも多いですので、
サイトを作るときにぜひぜひ設定してみてください。