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

ウェブデザインでは、まずウェブサイトの包括的なイメージの位置付けが必要です。
⑴ 内容によって形式が決まります。まず内容を充実させ、次にブロックに分割し、トーンを決め、最後に細部に対処します。
⑵ まず全体、次に部分、そして最後に全体に戻る。
全体の状況を考慮して、スペースを埋められるものはすべて埋めてください。次に、モジュールでトーンとデザインを設定します。最後に、満足できない詳細を調整します。
⑶ 機能によってデザインの方向性が決まります。ウェブサイトの目的によってデザインのアイデアが決まります。商業用のウェブサイトは営利目的を強調し、政府系のウェブサイトはイメージや権威ある記事を強調し、教育系のウェブサイトは講師やコースを強調します。
コンテンツと機能によって、表現形式とインターフェース デザインが決まります。よく出される課題は、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 ストレステストツールのインストールと使用

推薦する

フォント宝庫 50 種類の素晴らしい無料英語フォントリソース パート 2

デザイナーは独自のフォント ライブラリを持っているため、プロジェクトの設計時にすぐに使用できます。今...

LinuxでifconfigとaddrがIPアドレスを表示できない問題を解決する

1. 仮想マシンにLinuxシステムをインストールし、仮想マシンを起動し、rootとパスワードを入力...

10分で始めるCSS3アニメーション

導入アニメーションを使用すると、JavaScript や jQuery に依存せずに、純粋な CSS...

MySQL 8.0.13 手動インストールチュートリアル

この記事では、MySQL 8.0.13の手動インストールチュートリアルを参考までに紹介します。具体的...

React diffアルゴリズムソースコード分析

目次単一ノード差分単一要素を調整するマルチノード差分調整子配列ノードが移動したかどうかを判断するには...

Dockerのヘルス検出メカニズム

コンテナの場合、最も単純なヘルスチェックはプロセス レベルのヘルスチェックであり、プロセスが稼働して...

MySQL パラメータ関連の概念とクエリ変更方法

序文:以前の記事では、特定のパラメータの機能についてよく紹介してきました。しかし、MySQL パラメ...

フォーム送信の更新ページはソースコード設計にジャンプしません

1. ソースコードの設計コードをコピーコードは次のとおりです。 <!DOCTYPE html ...

mysql8.0.19 でパスワードを忘れた場合の完璧な解決策

おすすめの読み物: MySQL 8.0.19 は、間違ったパスワードを 3 回入力するとアカウント ...

中国語フォントの英語名まとめ

CSS の font-family プロパティを使用して中国語フォントを参照する場合、フォントを定義...

Nginx リバース プロキシ学習例チュートリアル

目次1. リバースプロキシの準備1. LinuxシステムにTomcatをインストールする2. Tom...

CSSは背景画像の画面適応を実現する

ログインページなどのホームページを作成する場合、大きな背景画像を配置する必要があり、さまざまな画面の...

js オプション連鎖演算子の使用

序文オプションの連鎖演算子 (?.) を使用すると、チェーン内の各参照が有効であることを明示的に検証...

MySQLデータベースのロック機構の分析

同時アクセスの場合、非反復読み取りやその他の読み取り現象が発生する可能性があります。高い同時実行性に...

Docker コンテナ入門から夢中になるまで(推奨)

1. Docker とは何ですか?仮想マシンについては誰もが知っています。Windows に Li...