ソーシャルメディアボタンの色を変更してカラーパレットに合わせる
ソーシャルメディアボタン（facebook/Twitter/linkedinのサインアップとログイン、共有）の色を変更して、当社のWebサイトのカラーパレットに合わせるのに興味があります。
関連するソーシャルネットワークがロゴのみで識別され、対応する色がない場合、これらのボタンの効果が低下すると思いますか？
私の直感は、色がユーザーに追加の視覚的なキューを与え、ソーシャルブランドを活用できるようにすることを教えてくれますか？
[〜＃〜] vs [〜＃〜] 
ここでのベストプラクティスは、ソーシャルメディアのアイコンを中間色、通常は灰色で表示することです。このアプローチは広く実践され、受け入れられています。
主要なソーシャルメディアブランドのほとんどには、上記を明示的に禁止する使用ガイドラインがあることに注意してください。たとえば、Facebookの ブランド許可センター は、許可されている特定のブランドアセットを一覧表示し、ブランドアセットと「紛らわしく類似」しているものはすべて明示的に禁止しています。
デザインや色を変更するなど、Facebookブランドアセットを変更しないでください。
もちろん、これは上記の慣行の広範な採用を妨げるものではありません。
それらをページに配置して、人々にクリックしてもらうのが目的ではありませんか？彼らがあなたの配色から目立つ場合、まあ、それは彼らがクリックされる可能性を高めるだけです。 コントラストによる視覚的な目立ちは、クリックスルーの可能性を大幅に増加させます。
他の行動を促すフレーズをクリックするのではなく、アイコンをクリックすることを懸念している場合は、最初にページにアイコンを配置する手間を省く必要があります。それ以外の場合は、通常の色を使用して簡単に認識できるようにします（サイト上であまりにも派手に見えると思われる場合は、少しトーンダウンする可能性があります）。
他の回答で言及されているブランディングの問題を無視して、質問は次のとおりです。
- ソーシャルメディアボタンの色を変更すると、ボタンが見つけにくくなりますか？
- ソーシャルメディアボタンの色を変更すると、ボタンの機能の予測/理解が難しくなりますか？
これらの質問への回答では、例としてこれらの3つのWebページを使用しています。ページへのリンクが回答テキストに表示されます。
質問1
最初の質問は視覚的な検索についてです。ユーザーがディストラクタのフィールド（つまり、ページ上の他のすべてのもの）の中からターゲット（つまり、ボタン）を見つける能力に寄与する多くの要因があります。この状況では、ターゲットの色と予想される場所が最も関連しています。
ターゲットカラー
視覚的な表示は、色を適切に使用することで 前処理 の恩恵を受けます。これ スラッシュドット は、この現象の例を示しています。ページ上の他の色との色の違いにより、ユーザーはメイン段落の下の青と赤のソーシャルメディアボタンをすぐに見つけることができます。対照的に、 このBBCページ のソーシャルメディアボタンは、色付きのボタンがページ上の他の色付きの要素と競合するため、見つけるのが困難です。色がBBCページのソーシャルメディアボタンの前処理に貢献することはほとんどありません。
予想される場所
ボタンの位置も検索時間に影響します。言い換えれば、人々はソーシャルメディアボタンが特定の場所にあることを期待しています。一般的なWebページ要素の予想される場所に関する調査があります。これらの場所については、このサイトの他の質問で説明されています。ソーシャルメディアボタンの適切な位置についてはよく知りませんが、同様のサイトやアプリを簡単に調査すると、答えがわかるかもしれません。 3つのニュースサイトのサンプルは、記事の真上または真下が予想される場所であることを示唆しています。 BBCはボタンを記事の上下に配置します。スラッシュドットはそれらを下に置きます。 Grantland も下に配置します。
スラッシュドットのボタンはスクロールせずに下に表示されているのに、グラントランドのボタンはスクロール後に下に表示されていることに気付くでしょう。これは、ユーザーの期待を議論にもたらすためです。通常のユーザーがいる場合は、スクロールが必要な場合でも、一貫した場所が最も重要な要素です。ボタンの色よりも重要です。ただし、頻繁に使用しないユーザーが多い場合は、ボタンをスクロール（スクロールなど）せずに表示することをお勧めします。
質問2
いいえ。色を変更すると、ボタンの機能を予測/理解するユーザーの能力に影響するはずです。色ではなくロゴは、ソーシャルメディアボタンの最も顕著な特徴です。 （ブランドの専門家への注意-その声明で私を非難しないでください！）.
サイトへのトラフィックを獲得するために一生懸命働いたときに最後にしたいことは、サイトへのトラフィックを得るためにそこにあるソーシャルメディアページに移動するようにサイトを離れるように顧客を招待することです。無限ループ。
したがって、「共有」を呼び出す機能の場合、これらのアイコンはソーシャルメディアブランドのままです。
基本的に他のサイトへの外部リンクであるものについては、サイトの設計に合わせてそれらを設計する必要があります。
これは、ウィジェットに与えたい注意と、穏やかでクリーンなデザインをどれだけ重視するかによって異なります。ここに私が考えることができる主な利点と欠点があります。
単一の値/ Webテーマ用に再設計：
- 注意を引くことはありません。ユーザーが自分で考えた場合にのみ使用する可能性があります。ボタンの意味は、一瞬長く解釈し、フォーカスのグラムを解釈するのにより多くかかります。
- Webサイトの最初の表示は、より快適で、無秩序ではありません。
確立された色：
- ウィジェットが注目を集めます。ユーザーは共有するように求められます。
- 最初のビューはより無秩序です。
もちろん、これらはスペクトルの両極端にすぎません。あなたはいつもあなたのウェブサイトと調和するオレンジ/ブルー/シアンの色合いを見つけることができます。マウスオーバーでのみ色を表示できます。または、2つのウィジェットを使用できます。共有する可能性が低い場合は最小と灰色、ユーザーが共有する可能性が高い場合は大きくカラフルです。
CI（またはRSSの場合は慣例）の一部として、ソーシャルチャネルに使用される色は、それらを正しく認識するために重要です。もちろん、裸の形状も認識できますが、レイアウトでは目立ちません（特に、コントラストが非常に低い2番目の場合）。ただし、共有が作業するプロジェクトの重要な戦略的要件の1つではない場合は、一般的に重要性が低くなるので、それを実行する方法です。
2番目のデザインに似たデザインがある場合は、コントラストとカラーマッチングの問題を回避するために、これらのアイコンを別の白いコンテナに入れることを検討してください。これらのアイコンは常に白い背景で見栄えがします。
もし私があなたのところに来て、あなたが飲むためのミルクセーキをあなたに提示し、それが視覚的に「ダークチョコレート」であるという事実にもかかわらず、ミルクセーキがイチゴであると言いました-それはダークブラウンであり、赤い部分の美しいピンクの調合ではなかったということですその中にいちごの。あなたがそれを味わうとき、それは確かに味のイチゴですが、見た目はダークチョコレートです。どう感じますか？
私はソーシャルメディアのアイコンでも同じアプローチをとっています。はい、色は物語の半分にすぎませんが、色が期待とは異なるものである場合、それは価値観や経験の1つの視点を変更します。形がそこにある限り（Facebookの「F」またはTwitterアイコンの抽象化された鳥）、リンクがまだ意図したWebサイトに関連付けられている限り、すべてが問題ないと主張することができます。しかし、色も同様に重要です。これらのアイコンの色は標準になり、関連付けられている製品の代名詞となっています。イチゴのミルクセーキにも同じことが言えます。イチゴの味がするだけでなく、従来のイチゴのミルクセーキのように見えることも期待しています。
それはあなたのサイトのブランディングと、あなたのウェブサイトが何をしているのかに対するこれらのアイコンの重要性に依存すると思います。
いくつかの点で、これらのアイコンはWebサイトでトークンの必須アイテムになっています。人々はそれらを含める必要性を感じているようであり、場合によってはそれらは必要ではなく、しばしば実装されますが、ビジネスは前述のソーシャルメディアを適切に利用していません。
あなたの中心的な関心やビジネスが社会的に志向されているかどうか、と思います。ニュース/ディスカッションサイト、またはソーシャルメディアに積極的に参加していて、サイトコンテンツに付加価値や関心を提供している場合は、これらのアイコンをより目立ち、フルカラーにするのが理にかなっています。
興味深いシナリオの1つは、特に厳格なブランドガイドがある場合-たとえば、それが本当に最小限であるとしましょう。素敵なスタイリッシュな書体と色はブラック/ホワイト/グレーです。これらをマルチに配置すると、ブランドの整合性または一貫性が損なわれると感じるかもしれません。丁寧に作成され、ブランド化されたページ上の色付きのソーシャルアイコン。したがって、この場合は、ブランドの重要性とソーシャルメディアのニーズのバランスをとることが重要です。
ミュート/彩度を下げたソーシャルアイコン（ロールオーバーで完全な適切な色が表示される場合がある）がサイトのデザインに巧妙に作成され、アイコンに目立つようにしながら、強力なブランドの完全性を維持する方法で、この素晴らしい例をいくつか見ました。
申し訳ありませんが、私はそこに少し触れました:)そのシナリオがあなたに当てはまるかどうかはわかりませんが、それが役に立てば幸いです。
純粋な答えは、公式のオリジナルのソーシャルメディアボタンの配色を変更することで、独自のブランドやデザインの好みを進める代わりに、サイトを使いにくくすることです。
とはいえ、主要なユビキタスソーシャルメディアブランド（Facebook、Twitter、LinkedInなど）は非常に簡単に認識できるため、カラースキームからカラースキームに切り替えても、ほとんどの洗練されたユーザーの認知能力に大きな影響はありません。
ただし、これらの要因のいずれかまたは両方を回避するほど、ユーザーにとっては困難になります。
青、黒、白は、ほとんどのソーシャルネットワーキングWebサイトで頻繁かつ巧妙に使用されている色です。ソーシャルネットワーキングウェブサイトを1つとして簡単に認識できるようにします。これらの色を使用する方が安全です。だから、私の提案は、根本的に違うものを試してはいけないということです。
-あなたは非常に才能のあるアーティストで、優れたビジュアルデザインをデザインできます。
-アプリケーションを宣伝するための強固なプラットフォームとユーザーベースを持っている
独自のアイデンティティを持つビジュアルエクスペリエンスをデザインするのは良いことですが、それをユーザーベースで使用、経験、目撃することもできます。
使用ポリシーを遵守する場合は、色を変更したり、カスタムロゴを使用したりすることはできません。 Twitterポリシー および Facebookポリシー を参照してください