Webサイト上でSNSのロゴを使う時の注意点

Webサイト制作ではSNSのリンクをつけることが当たり前になりました。

サイトの目標の一つ、重要なポイントになる部分ですのでクライアントも力を入れています。

デザイナーとしては、情報設計面・ビジュアル設計面ともに腕の見せ所かもしれませんが注意点もあります。

 

この記事ではSNSリンク埋め込みをデザインする際に知っておいた方がいい点をまとめています。

ただしTwitter、Facebook、Instagram、LINEの規約まとめやコツみたいな内容ではありません。

もう少し根本的なところ、チェックポイントです。

大きく分けて2つあります。

 

1.他サイトのデザインを安易にマネしない

最近、4大SNSのリンクを含む制作に携わったので、

改めて他サイトではどんな風にデザインしているんだろうと思って調べました。

そして驚きました。

誰もが名を知る有名な企業サイトでも規約に沿っていないことがけっこう多い!

 

例えばTwitterを例にすると…

Twitterが示している規約(pdf 2019.8現在)では、Twitterのロゴと「Twitter」というテキストを組み合わせて表示してはいけないのですが思いっきり並列で書かれていたり…(実はこのサイト自体もそうです!)

他に多いのがロゴ周りの余白(各SNSごとにそれぞれ明確に示されている)が足りないこと。四方向の一部とはいえ何かを入れてしまっていたり。

ひどかったのはロゴマーク内に影を加えていること、またロゴの形自体の改変もあって驚きました。(これらは有名とは言えない企業でしたが)

Twitterの規約は他よりも細かめ(厳しめ)

 

また規約熟読後に改めてよくみると、微妙なラインのものもありました。

例えば先述の「Twitterのロゴと『Twitter』というテキストを組み合わせて表示しない。」

この「組み合わせ」というのは公式の規約内にシンプルな例が示されています。

この公式例とはちょっと違う形、つまり「組み合わせ」と言えるのかどうか微妙な表現方法などがありました。

※ちなみに今回のこれらのチェックは私一人の解釈ではなく、社内でベテラン勢と検討をした結果でもあるので信頼度は高めと思っています。

 

ちなみに今回わざわざいろんな有名企業のサイトを一からチェックしたわけではありません。

ググってトップに出てきた制作会社さんのまとめ記事で「SNSリンクのお手本サイトまとめ」みたいなのがあったので、そこからたどり着いたサイトばかりです。

つまり規約が守られていないサイトばかり紹介されていました。

確かにおしゃれで上手いので目は引きますし、デザインテクニック的にはとても勉強になるものばかりでしたが…

デザイン力は初級者の自分とは比較にならないほど高い!と感じるサイトほど規約を守れていないケースが多かったです。(統一感などの理由でロゴ周りもデザインしちゃうからでしょうか。)

ちょっと話が逸れますがアクセシビリティ対応でも同じ傾向があると感じています。
つまり手の込んだ素敵なサイトほど障がい者にやさしくない傾向。
私もアクセシビリティ対応は難しいと感じているのであまり言えないのですが。

 

こわいですね、名の通った企業のサイトでやっていてしかもそれを制作会社が紹介してたら規約なんて読まずにマネしてしまいます。

HTMLのセマンティックもそうですが、デザインが上手いサイトでもHTMLの書き方はだめってパターンもけっこう多いので気をつけようと思います。

 

インハウスデザイナーならまだしも特に受注制作会社ではまずいです。

クライアントに実害やペナルティがあることはほとんどないとは思いますが、心配や迷惑もかかるかもしれませんし。

ちなみに私自身も実は今まで規約などしっかり目を通したことはなく、

今回クライアントさんに「ロゴの使用大丈夫ですか」と念を押されてようやくしっかり調査したという流れでした。

コンプライアンスの意識の高いお客様に育てていただいています。

2.まとめに頼らず公式の規約を確認すること

4大SNSすべての公式の規約を確認するのはなかなか大変です。

(公式の規約が見にくいとかではなく、それぞれ調べていくのがめんどうに感じる)

なのでついまとめ記事みたいなものに頼りたくなります

 

ですが一度は公式規約すべてに目を通した方がいいと思います。

 

規約が変更されることは思った以上に多く、まとめ側がついていけていないことも多いです。

私も今回せっかく調べたので一覧表にして掲載しようかとも思いましたがやめました。
理由は細かい規約の変更も短スパンでありそうでついていけないかもしれないと思ったからです。
また他の理由としては、4大のそれぞれの規約を開くことさえ億劫がらなければ、公式の方がわかりやすいことに気付いたからです。

また、まとめ側のさじ加減で「ここを守れば大丈夫」のような書かれ方をしている場合も注意です。

それを守ろうとして違う部分に抵触することもありえます。

 

また制作者なら保守管理しているサイトもあると思うので、

常に正確に最新版にするためにも規約はいったん読み込んでおいて

変更を知ったらすぐに対応できるくらいになっておいた方がいいとも思います。

最初はめんどうですが結局その方が煩わしさも避けられて効率的かと思います。

まとめ記事はありがたいですし便利ですが、頼りすぎないようにしましょう。

まとめ記事を使う時の注意点

  • 規約の最新版に沿っているかどうか
  • ポイントを絞ってまとめている記事の場合、規約の他の部分が抜けている可能性を考える

 

SNSロゴを使う時の注意点まとめ

1.有名な企業サイトやSNSロゴの使い方で紹介されているサイトを安易にマネしない
2.4大SNSの規約をポイントで絞ったまとめ記事などに頼りすぎない(一度は公式に目を通す)

 

今回SNS調べた結果「えっこれもだめなの?」ってなることが多かったです。逆に「これはいいのか!」ってなったりも。

最初はちょっと大変かもしれませんが、一度公式規約に目を通しておくことはメリット大です。

毎回基本的なことを調べる手間が省けるようになりますし、改めてロゴやその扱いの具体例図をまじまじと見るとデザインの勉強にもなります。

規約を守ってSNSブランド企業も制作者も発注者もユーザーもみんなハッピーになれるようにしましょう!

コメント