【勉強】favicon
昨日やった内容を載せます。
ちなみにファミコンじゃなくてファビコンです。
似ていますが。
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
faviconとは？
→favicon（ファビコン）は、ウェブサイトのシンボルマーク・イメージとして、ウェブサイト運営者がウェブサイトやウェブページに配置するアイコンの俗称である。favorite icon（フェイバリット・アイコン：お気に入りアイコン）という英語の語句を縮約したものである。
これね↓
faviconのサイズですが、基本的には16px×16pxですが、OSやデバイスによって様々ですべてに対応させるとなるときりが無くなってしまうので、今回の授業は
PC用のサイズ 16px×16px
Mac版Safari用 32px×32px
スマートフォン用 144px×144px
の3種類のみに限定します。
★作成していきましょう★
※今回はPC用のサイズ16px×16pxの分を載せます。
1.Illustratorでカンバスサイズ16px×16pxに設定。
自由に描きましょう。
（今回課題で制作しているサイト用に作成しました）
2.16px×16pxのサイズ且つ.png形式で保存。
3.こちらで.ico形式にします。
※Photoshopからそのまま「.icoファイル」に書き出せるプラグインなどもありますが、「.icoファイル」の特性であるマルチアイコン化（複数のサイズの画像を１つのicoファイルで持つ事が出来る）をするには、やはりネット上にあるジェネレーターを使うのが便利です。
http://ico.bradleygill.com/index.php
Favicon Converter http://favicon.qfor.info/c/
下の変換ツールを利用しました。
画像の通りにすると.ico形式で変換されます。
変換されたらダウンロード。
4.下記の通り入力していきます。
※下記記載の先生のブログからコピペされると楽ですよ。
6.完成〜。
※分かりやすい説明は先生のブログをご参照ください※
Faviconの設定
http://yachin29.hatenablog.com/entry/2015/03/11/192205
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
