おれ かきすてる おまえ よむ

ぶんたい いろいろ いちにんしょう ばらばら でも それでいい きにするな おまえ つよくいきろ それでいい

SNSシェアボタンのレギュレーション

サイトデザインに合致したソーシャルシェアボタンを作成する際に参照すべき、各SNSサービスのレギュレーション。あくまで本日、2015年3月15日現在の参考情報としてお読みくださいね。

Twitter

丁寧に作成された日本語のレギュレーションが参照できます。

  • 2012年6月に公開されたTwitterバードロゴのみ使用可。
  • 色は青=#55AACE、もしくは白。
  • なにかと組み合わせる際には、セーフティースペース(余白)を200%確保。

特徴的なのが、文字と組み合わせる際のセーフティースペースが円状に設定されていること。Twitterバードは円の組み合わせによって描かれる図案なので、セーフティースペースもそれに倣い設定する必要がある、と。Photoshopで正確な配置をするような時には、まず補助円を引いてやる必要がありそうです。

Facebook

facebookbrand.comという別ドメインにまとめられています。そのせいか、検索ビリティ低くてよくないですね。

  • 2013年4月に更新された「f」ロゴ、親指(いいね)ロゴ、いいねボタン、バナーが使用可。
  • 『十分なスペースを取り、すっきりと見えるようにする』などといった比較的ゆるいガイドラインのみ。提供素材さえ使用していれば、あとは各個人の裁量に任されている。

ガイドラインは日本語で読めますが、日本語表示のまま「f」ロゴ素材をダウンロードしようとすると『選択されたメディアの組み合わせは、現在ご利用いただけません。』となってしまいます。必ず英語表示にしてからダウンロードしましょう。

LINE

LINEロゴの利用についてとしてまとめられています。

  • 吹き出しアイコン、LINEロゴが使用可。
  • 利用規約文書への同意が必要。

気を付けなければいけないのは、最もメジャーな「吹き出し」アイコンは背景の角丸正方形までを含めてひとつのロゴとして定義されているということ。

つまり、吹き出しアイコンを使ってシェアボタンを作成したい場合、他のシェアボタンも同形状の角丸正方形ベースで作成せざるを得なくなるということです。これは厳しい。

Google+

Google+ Platform Branding Guidelinesに、クソわかりづらく書かれています。必ず英語版を参照すること。日本語版は翻訳品質が極端に低く(英語版ですらわかりづらいのに!)、挙句には最も重要な記述が削除されているなど、読むだけ時間の無駄です。マジで。

シェアボタン、およびGoogle+ロゴに関するレギュレーションは下の方、「Google+ badge, share, and follow button branding guidelines」以下に書かれています。曰く:

  • g+のロゴシェイプを改変しないこと。
  • 色は白と赤=#dd4b39を使用すること。
  • ロゴはボタンの中央に配置すること。

ごちゃごちゃと書かれているわりに、レギュレーションはシンプルかつ、ゆるめ。最初からこれだけ書いておいてくれれば十分なのに!

素材のダウンロードは「Google+ Sign-In button branding guidelines」パラグラフにある表組み、一番右の列の「Image Files > Download files」から行います。なお、「Google+ icon branding guidelines」パラグラフにある「download Google+ icon」は関係ありません。なんやねんマジで!

レギュレーションがわかりづらいと、悪意なき違反者が増えると思うんですけどね…。Googleってほんと、エレガントじゃない会社ですね。


繰り返しになりますが、このエントリはあくまで参考情報と思ってくださいね。ただでさえ動きの速いWeb業界、常に最新のレギュレーションをチェックして利用しましょう。