it-mure.jp.net

カラーパレットとCSSのギャップを埋める

kuler などのサイトに精通しており、(プログラマーとして)HTML/CSS/JavaScriptに精通しており、自分のWebサイトにどのようなコンテンツが必要かを知っています。コンテンツを適切にレイアウトする方法を理解できます。しかし、私にとって最も難しいのは、それぞれの色(リンク、テキスト、背景、その他の要素など)の色を理解することです。色が凄い!

たとえば、kulerをトライアドモードにして色を選択すると、その色と2組の補色が表示されるので、色はそれぞれ太字にな​​りますが、同時に機能します。しかし、私はそれらをページに入れようとしました、背景用の1つの色、リンク用の1つの色、テキスト用の1つの色、それはまったく機能しません。私は明らかにそれをすべて間違っています!

ウェブサイトを作るためにどの色を見つけるための最良の方法は何ですか?私は絶対に色がひどいので、kulerが役立つと思いましたが、それほど簡単ではありません! kulerとCSSの「ギャップを埋める」のを手伝ってください。カラーパレットをすばやく簡単に選択して自分のWebサイトに適用できます。

9
Ricket

色に色を付けようとしているようです(たとえば、緑の背景に赤いテキスト)。これは目に非常に難しいです!

色と灰色の混合に努める(ここでは白と黒は「灰色」です)-たとえば、色付きのテキストが必要な場合は、白または黒の背景に配置します。色付きの背景が必要な場合は、薄い色にして、その上に白または黒のテキストを使用します。

色を使用すると、少ないほど多くの効果があります。気が遠くなると、MySpaceに頭が痛くなります。コンテンツではなく、アクセントに色を使用します。黒と白のデザインから始め、1つのカラー要素を追加してみます。それがどのように見えるかを見てください。次に別のを追加します。過度に?もう一度取り出します。別の要素を試してください。

好きなWebサイトの色の使い方を見てください。たとえば、このページはほとんどが白黒で、一部は青(リンク、タグ、ヘッダーバー)、一部は黄色(青ではなく、非常に控えめに使用されています)アクセントカラー)。それが今日の一般的なアプローチです。

5
Alex Feinman

ユーザーに体験してもらいたい感情を把握します。コーヒーを提供する場所のためのサイトを作る?色で雰囲気を設定してみてください。どの色がどの感情に関連するかを知る必要があります。

では、どのような感情をビジターに与えようとしているのですか?

私はこのサイトが色理論の非常に役立つ紹介であることがわかりました: TigerColor-色理論の紹介

色を選択するだけでなく、色相を選択することを忘れないでください。また、明度と彩度を考慮に入れることも検討してください。

3
Daniel X Moore

トライアドの色が「うまく連携する」と正確に想定されていないだけだとしましょう。多くの場合、それらは3つの色であり、視聴者の注意を引いています。トライアドに基づくカラーパレットは、パレットからの色がニュートラルのプレーンフィールド上のスポットである場合、または1つの色が優勢で他の2つがアクセントとして使用される場合に適しています。

1
Mariusz Ciesla

プログラミングを学ぶとき、あなたは(おそらく)ジャンプして最初のプログラムとして3層アーキテクチャをゼロから作成しませんでした。おそらく、プログラミングの1つの小さな側面について教えるのに役立つ小さなプログラムを書いたでしょう。

同じことがデザインにも当てはまります。飛び込んですぐに見事で複雑なデザインを作成することはできません。

デザイナー以外の人は、できるだけシンプルに保つ必要があります。背景が白ではない(または少し白っぽい)見栄えの良いサイトを設計するには、実際のスキルが必要です。黒色のテキストを使用した無地の白い背景を用意し、リンク、見出し、太字のテキスト、そしておそらくヘッダーの3つの色を使用して、細かい詳細を設定します。

シンプルなデザインが鮮明に見えたら、コンテンツに集中します。それがすべて良ければ、デザインを実験するための良い基盤ができます。次に、少しずつ少しずつデザイナーのセンスを取り入れ、微妙な変更の影響を学習できるようにします。それを教育と考えてください。

1
Mongus Pong

クレヨンや色鉛筆などをつかんで実験してみましょう。 Kulerのトライアド(または一般的なカラージェネレーター)からCSSに直行すると、色によってはヒット/ミスになる場合があります。

最初は、2〜3色の色を使います。色理論は、利用可能なオプションがたくさんあるという点でタイポグラフィに似ていますが、最良のデザインでは通常、厳選された色をほとんど使用しません。

また、背景などの大きな広がりにはニュートラル(またはニュートラルトーン)を考慮し、リンクやロゴなどにはより目立つ色を考慮してください。

また、素晴らしいアイデアについては ColourLovers をチェックしてください(または、コミュニティに参加しましょう!)。

1

私はいつも模範的に働きます。投稿 Webデザインで色の力を使用するための初心者向けガイド は、@ Daniel X Moreが話している色理論を、問題の色理論を適用するWebサイトと組み合わせています。

次に、サイトの1つを所有しているコンテンツに一致させ、そこから色の調和を開始点としてリバースエンジニアリングできます。

1
icc97