* 文字コードにおけるロゴマーク

[SEE[ [[文字コードにおけるロゴマーク]] ]]


* Web サービスにおけるロゴ

[10] [[Webアプリケーション]]には、実用上、いくつかのサイズと形式のロゴ画像が必要です。

** SVG

[1] [[Webサイト]]上の表示などには任意の大きさで使える [[SVG]] 版を1つ用意しておくと便利です。

** 大きな PNG

[2] [[Facebook]] の[[アプリケーション]]の[[ロゴ]]登録では、 1024 × 1024
の画像が必要です。[[背景]]は[[透過色]]でなければなりません。

[3] 他に、 [[Twitter]]、[[Google]]、[[はてな]]の[[アプリケーション]]登録、
[[はてな]]の[[プロフィール写真]]登録にも大きめの画像があると良いですが、
こちらは [[Facebook]] のような厳しい制限はありません。

[11] [[OGP]] もこれでいいか、あるいはもう1回り小さいのを用意した方が良いかもしれません。

** 大きめ横長 PNG

[8] [[Twitter]] のユーザーページ上部や
[[Facebookページ]]の[[カバー写真]]用に横長の[[画像]]があると良いです。

** 小さめ正方形 PNG

[4] [[favicon]] や各サービスの[[ユーザーアイコン]]として使う[[画像]]が必要です。

[5] 16 × 16 に縮小して表示されることもあれば、 64 × 64 などで大きく表示されることもあります。
縮小も意識しつつ 256 × 256 くらいで用意しておくのが無難でしょうか。

;; [[favicon]] はサイズを指定して複数指定できます。

[7] 普通は[[正方形]]で表示されます。

[6] 周囲は[[透過色]]とするのが無難です。[[サービス]]によっては丸く切り取るなどの加工を加えて表示することがあります。
[[スマートフォン]]の[[メニュー画面]]の[[アイコン]]として使う場合なども加工されることがあります。

[FIG(list)[
- [[favicon]]: [[favicon.ico]], [CODE[<link rel=icon>]]
- [[ユーザーアイコン]]: [[Twitter]], [[Google]], [[Facebook]], [[はてな]], [[GitHub]]
- [[メニュー画面]]: [[iOS]]
]FIG]

** 144 × 144 PNG

[9] [[Android]] 版 [[Chrome]] の[[ホーム画面に追加]]機能を有効にするには、
[CODE[<link rel=manifest>]] で 144 × 144 の [[PNG]] [[画像]]を指定する必要があります。

* 関連

[SEE[ [[ロゴ文字列]] ]]

* メモ

[12] [CITE[TwitterやFacebookなどのロゴ利用規約まとめ - NAVER まとめ]]
( ([TIME[2013-11-26 07:28:21 +09:00]] 版))
<http://matome.naver.jp/odai/2132149396384368301>