ウェブデザインでは、まずウェブサイトの包括的なイメージの位置付けが必要です。

ウェブデザインでは、まずウェブサイトの包括的なイメージの位置付けが必要です。
⑴ 内容によって形式が決まります。まず内容を充実させ、次にブロックに分割し、トーンを決め、最後に細部に対処します。
⑵ まず全体、次に部分、そして最後に全体に戻る。
全体の状況を考慮して、スペースを埋められるものはすべて埋めてください。次に、モジュールでトーンとデザインを設定します。最後に、満足できない詳細を調整します。
⑶ 機能によってデザインの方向性が決まります。ウェブサイトの目的によってデザインのアイデアが決まります。商業用のウェブサイトは営利目的を強調し、政府系のウェブサイトはイメージや権威ある記事を強調し、教育系のウェブサイトは講師やコースを強調します。
コンテンツと機能によって、表現形式とインターフェース デザインが決まります。よく出される課題は、2 つの文章が書かれた小さな紙で、Web サイトをデザインするようにというものです。紙一枚を見るだけでページをデザインできる人もいます。たった 2 つの文章で、クライアントのページをデザインできます。私は 7、8 年のデザイン経験がありますが、それでもあえてやろうとは思いません。あなたは本当に私のアイドルです。
Web デザインを行うときは、クライアントについて多くのことを知る必要があります。
ウェブサイト構築のためのコラム計画と各コラムの形式と機能要件。メインカラー、顧客の性別の好み、連絡先情報、旧バージョンのURL、優先URL。業界と顧客の要件に応じて、段階的に構築するかどうか、将来の互換性を考慮するかどうかが重視される必要があります。顧客はウェブサイトを構築する強い意欲を持っていますか?顧客を精神的にコントロールできますか?これまで触れたことのない技術的な知識をしっかりと把握していますか?
等...
これらすべてのコンテンツを明確に理解すると、この Web サイトの包括的かつ鮮明な位置付けが頭の中に浮かぶようになります。次は、インターフェイス デザインに焦点を当てます。
⒈ ウェブページのカラーマッチングの基本概念 ⑴ 白黒の言葉は永遠のテーマであり、誰もそれが悪いとは言えません。
⑵ ウェブページで最もよく使われる人気色は青です。青い空と白い雲のような、落ち着いていて整然とした色です。
緑 - 緑と白、エレガントで活気のある。
オレンジ - 活気があり温かみのある、標準的なビジネスカラー。
暗い赤 - 厳粛、真剣、高貴。刺激的な赤を抑えるために黒やグレーと組み合わせる必要があります。
⑶ 色に関するタブー:汚い色は避けましょう。背景とテキスト コンテンツのコントラストが弱く、暗い背景は憂鬱な印象を与えます。
純粋さは避けてください。明るい純粋な色は人々に刺激を与えすぎ、意味合いが欠けています。
飛び飛びの色使いは避けましょう。色がどれだけ美しくても、全体の見た目から外れてはいけません。大衆から離れることは、自分自身に屈辱をもたらすことです。
花の使用は避けてください。絵全体に流れるメインカラーが必要です。メインカラーは、最も面積が大きい色ではなく、テーマを最もよく表現し反映できる最も重要な色です。少数派であっても決定的な役割を果たすリーダーのようなものです。
パウダーは避けましょう。明るい色はきれいに見えますが、コントラストが弱すぎると、まるで絶望的な病人のように、全体が青白く弱々しく見えてしまいます。
純粋な青、黄緑、明るい赤は避けてください。⑷ 青、白、オレンジのいくつかの固定された組み合わせ - 青をメインカラーとして。白い背景、青いタイトルバー、装飾としてオレンジ色のボタンまたはアイコン。
緑と白の蘭 - 緑がメイントーンです。白い背景、緑のタイトル バー、装飾として青またはオレンジ色のボタンまたはアイコン。
オレンジ、白、赤 - オレンジがメイントーンです。白い背景、オレンジ色のタイトル バー、装飾として濃い赤またはオレンジ色のボタンまたはアイコン。
ダークレッドと黒 - メイントーンはダークレッド。黒または灰色の背景、濃い赤のタイトル バー、テキスト コンテンツ用の明るい灰色の背景。
⒉ 弱められたインターフェース 優れたインターフェース デザインは、弱められたインターフェースを持ちます。これにより、機能が強調され、Web サイトがユーザーに提供するものが強調されます。これには、閲覧順序、機能分割などが含まれます。
訪問者は、0.5 秒以内に Web サイトの業種特性を把握し、1 秒以内に Web サイトの使用を開始する場所を認識できる必要があります。一度クリックできれば、二度とクリックする必要はありません。もちろん、上記はほとんどの機能的な Web サイトを指します。特殊効果や Flash Web サイトなどのプロモーション Web サイトやディスプレイ Web サイトの場合は、少し凝ったデザインにする必要がありますが、やりすぎであってはいけません。ウェブサイトは漫画ではありません。効率がますます高まり、社会心理がますます衝動的になっている中国では、人々の忍耐力はますます小さくなり、心理的耐久力はますます低下しています。効果は芸術的な概念を反映し、まさに適切なものになります。
⒊ 強力なモジュール性と変更可能性 モジュール性により再利用性が向上するだけでなく、Web サイトのスタイルを統一し、プログラム開発の強度を軽減することもできます。ここでは、サイズ、係数、許容差、命名規則などに関する知識を設計しますが、詳細については説明しません。
アーキテクチャ、モジュール、画像など、どのようなものであっても、強力な変更可能性を考慮する必要があります。簡単な例を挙げると、ロゴやボタンなどの場合、多くの人が絵を描くことを好み、N 個のボタンは N 個の絵を意味します。 3 ~ 5 種類のボタンの背景画像を作成し、それを使用して Web ページのコードにテキストを入力すると、変更が容易になり、プログラマーにテキストの変更を任せることができます。ただし、Web ページに表示されるフォントはギザギザになります。一般的に、明瞭さと美しさの両方を確保できるフォント サイズには、次の種類があります: Songti 12px | Songti 12px Bold | Songti 14px | Songti 14px Bold | Heiti 20px | Verdana 9px | Arial Black 12px |
⒋ 芸術を創作するのは恥ずべきことです。分析能力は創造性よりもはるかに重要です。デザインの世界ではいつも「創造性」について語られています。私が言いたいのは、コンテンツの目的や意味を明確にせず、技術的な制作を完璧にせずに、創造性や特殊効果を使って顧客や訪問者を混乱させることは恥ずべきことだということです。ウェブデザイナーにとって、分析能力は創造性よりもはるかに重要です。
⒌ CSS、XHTML、web2.0、Ajaxなどを考慮するか放棄するか。嵐が来ています。高度な技術を学ぶことは確かに有益ですが、中国での現在の認知度の低さは、顧客の需要と価格もかなり低いことを示しています。先ほど、Web デザインは経済によって決まると述べましたが、場合によっては、これ以上の妥協は許されず、放棄したり諦めたりすることも無力な行動です。

<<:  CSSクラス名の問題の詳細な説明

>>:  Apache ストレステストツールのインストールと使用

推薦する

別の種類の「キャンセル」ボタン

「キャンセル」ボタンは必要な操作プロセスの一部ではなく、デザイン上の主要な要素として表示されません...

MySQL DATEDIFF 関数を使用して 2 つの日付間の時間間隔を取得する方法

説明する2 つの日付間の時間間隔を返します。文法DateDiff(間隔、日付1、日付2 [、週の最初...

純粋なJSを使用してセカンダリメニュー効果を実現します

この記事の例では、セカンダリメニュー効果を実現するためのJSの具体的なコードを参考までに共有していま...

Js でオブジェクトのディープ オブジェクトを安全に取得するメソッドの例

目次序文文章パラメータ例Lodash 実装:トーキー機能: castPath関数: stringTo...

Golang を使って Docker API を実際に操作する

目次SDKのインストールローカル Docker の管理コンテナの実行バックグラウンドでコンテナを実行...

mysql-connector-java.jar パッケージのダウンロード プロセスの詳細な説明

mysql-connector-java.jar パッケージのチュートリアルをダウンロードします: ...

DockerコンテナがSongtiなどのフォントを認識しない場合の解決策

問題の背景: docker を使用してプロジェクトをデプロイする場合、プロジェクト内で印刷コントロー...

Vueカスタムテーブル列実装プロセス記録

目次序文レンダリングsetTable コンポーネント使用結論序文フォームを使用して PC 側のプロジ...

ユーザーエクスペリエンスの要素またはWebデザインの要素

システムとユーザー環境の設計<br />Apple システムの成功は、そのシステム アー...

JavaScript はドラッグ可能なモーダルボックスを実装します

この記事では、ドラッグ可能なモーダルボックスを実装するためのJavaScriptの具体的なコードを参...

MySQLユーザー権限管理の詳細な説明

目次序文: 1. ユーザー権利の概要2. 実際の権限管理序文:データベースのユーザー権限管理について...

vuex の補助関数 mapGetters の基本的な使い方の詳細な説明

mapGettersヘルパー関数mapGettersヘルパー関数は、ストア内のゲッターをローカルの計...

Windows での MySQL5 グリーン バージョンのインストールの概要 (推奨)

1 MySQLをダウンロードするダウンロードアドレス: http://downloads.mysq...

MySQLのGROUP BYステートメントを最適化する方法

MySQL で、id、a、b の 3 つのフィールドを持つ新しいテーブルを作成します。次のように、同...

個人ブログシステムを構築するためのDockerの超シンプルな実装

Dockerをインストールするyumパッケージを最新バージョンに更新します: sudo yum up...