本当は難しい?!SNSアイコンのレギュレーションの話
こんにちは!webデザイナーのcandaです。
web制作者の皆さんは日々インスタやらXやら、あらゆるSNSアイコンをサイト等に設置する機会があると思います。
ただ、そのSNSアイコン、正しく使えていますか…?
かく言う私も、いざ使おうとするときは「黒にしていいんだっけ?」などとわからなくなっては都度調べながら使っています。
一度ルールを頭に入れてからいろんなサイトを見ると、意外とルールを遵守できているサイトは少ないなと感じます。「エフェクトかけたり、回転させたり変形したりするのはダメ!」というのはもちろんですが、ついレギュレーション違反してしまいやすいポイントとしては
白黒の可否
webでの最小サイズ
最小余白
の3つかなと思います。
Twitterも新しくXになったことですし、改めて2023年9月現在のSNSロゴレギュレーションを確認したいと思います!
結論
1.白黒の可否
2.webでの最小サイズ
3.最小余白
特徴として、最小サイズが他のロゴと比べると大きめに設定されているようです。
また、アイコンは白か黒が推奨ではあるものの、他の色への変更も可のようです。とはいえブランドイメージと離れない色を選択した方がよさそうですね。
■Instagramアイコンの使用に関するガイドライン
■ロゴDLページ
LINE
上記はLINEのブランドアイコン及びAPPアイコンの話です。
ただLINEにはボタンの役割に種類があり、例えばLINEソーシャルプラグインという、「LINEで送る」「友だち追加」「いいね」ボタンを追加してウェブサイトとLINEを連携させるサービスがあります。
ブランドアイコン・APPアイコンでは色替えは不可でしたが、ソーシャルプラグインの方では「#555555」のグレーを使用することが認められています。
他にも「LINEログイン」ではマウスオーバー時のカラーなどにもしっかり規定があります。
自分がどの意図でLINEアイコンを使いたいのか意識した上で適切なアイコンを選び、ガイドラインを確認する必要がありそうです。
■LINEの「ブランドアイコン」「APPアイコン」のガイドライン及びDLページ
■LINEソーシャルプラグインについて
■LINEソーシャルプラグインのデザインガイド
X
現時点ではガイドラインの一般公開はされていないようです。ただしロゴ自体は配布されており、黒ver、白verが入っています。
旧Twitterのレギュレーションでは最小サイズ32px、最小余白はロゴの半分以上だったので、それらを参考にしてもいいかもしれません。
■ロゴDLページ
Facebookは2023年9月20日、Facebokのブランド・アイデンティティを再定義すると発表し、ロゴも刷新しました。
ぱっと見では気づきにくい変化なのですが、少し「F」の字が太くなり、お馴染みの青色もやや濃くなったようです。
それに伴いロゴのルールも変更となりました。
参考に旧ロゴのルールも置いておきます。
新ルールでは最小サイズについて明記されるようになり、最小余白も大きくなりましたね。かつては黒やグレーもOKだったのですが、それについては明記がなく、ただダウンロードデータの中には入っていないので使わないのが無難かもしれません。
■新ロゴDLページ
■2023年9月20日 ブランドアイデンティティ刷新のお知らせ
YouTube
YouTubeにはアイコン単体の「YouTubeアイコン」とYouTubeの文字が一緒になった「YouTubeロゴ」がありますがどちらも同じルールです。
面白いのが、余白についてほとんどのアイコンが「アイコンの◯%」だったのに対しYouTubeではアイコンの中の「▷」が基準になっていることです。考え抜かれたバランスで成り立っているのですね。
■ブランド関連情報
Pinterestで印象的だったのは、ロゴのカラーバリエーションが豊富なことです。自分で好きな色にカラーを改変することはNGなのですが、公式で用意されているアセットの中には濃いものからパステルカラーまで、様々な色のパターンのロゴが用意されています。
これは私も初めて知ったのですが、「P」のマークは白ではなくくり抜きなので背景のカラーになるようです↓
また、少し注意が必要なこととして「Follow on」のようなテキストを付ける際はテキストとアイコンが同色にならなければいけないそうです↓
■Pinterest ブランド使用ガイドライン
いかがでしょうか。
簡単なようで、意外と守れていないルールもあるのではと思います。
ついサイトのデザインを優先して色を変えたり、小さく配置してしまいたくなるアイコン。でもそのアイコンはブランドを象徴する大事なもの。
心血注いでアイコンを作成してルールを決めたデザイナーさんがどこかにいるはずです。リスペクトを込めて、正しく使っていきたいですね。
ご精読ありがとうございました。
---------------------------------
※note記載の内容は2023年10月4日現在の情報です。アイコンを利用する際は必ず最新のレギュレーションをご確認いただくようお願いいたします。
---------------------------------
この記事が気に入ったらサポートをしてみませんか?