ウェブサイトのコンテンツの100~1%はナビゲーションである

ウェブサイトのコンテンツの100~1%はナビゲーションである

ウェブサイトでは、コンテンツの(100-1)%がナビゲーションです
1. ジェシー・ジェームズ・ギャレットは著書『ユーザーエクスペリエンスの要素』の中で、グローバルナビゲーション、ローカルナビゲーション、補助ナビゲーション、内部リンクナビゲーション、フレンドリーナビゲーションなど、複数のナビゲーションシステムについて言及しています。
しかし、それだけではないと思います、「検索」「分類」「サイトマップ」「コンテンツ紹介」などは、ナビゲーション方法が異なるだけです。
2. ウェブサイトの価値は、「ユーザーがタスクを完了し、特定の体験を得るのに役立つこと」です。
ウェブサイトに必要なのは、ユーザーがタスクを完了できるように適切にガイドし、タスクを完了するプロセスでユーザーが良好なエクスペリエンスを得られるよう保証することです。
ある意味、Web サイトが最初から最後まで行うことが「ナビゲーション」であり、最終的な結果のみが「コンテンツ」であると言えます。
3. したがって、ウェブサイト デザインの「100 パーセントマイナス 1」はナビゲーション デザインです。
ウェブサイトの体験と「タスクを完了するプロセス」は、実際には「ナビゲーション体験」です。
そのため、デザインにおいては、「ユーザーがこのタスクをよりうまく完了できるようにするにはどうすればいいか」、「この操作を完了するためにユーザーをよりうまくガイドするにはどうすればいいか」、「ユーザーがこの操作に慣れるにはどうすればいいか」などを常に考えています。
ページ、コンテンツの(100-1)%はナビゲーションです
4. 心理学者のジョン・クレイド教授はかつて、人間の 7 つの恐怖をまとめたが、その 5 番目は「考えることへの恐怖」である。人間は、より多く、より豊富な選択肢よりも、単純で明白な答えを必要としている。ホワイトウォーター事件をまとめたとき、アメリカ人は「スキャンダルを複雑にすれば、罪悪感から逃れられる」と言った。
同様に、ページを複雑にすると、ユーザーが迷ってしまう可能性がある、と言いたいです。
5. 実際、Web サイトのどのページでも、ユーザーに「 1 つの」メッセージを正確に伝えるだけで済みます。
実際、ページはユーザーに「1 つの」メッセージしか伝えられず、他の情報は「ガイド」としての意味しか持ちません。
6. したがって、Web サイトのどのページでも、「100 パーセントマイナス 1」のコンテンツがナビゲーションになります。
7. ホームページ上の他の部分はすべて「このウェブサイトはどのような感じか」をユーザーに伝えること(これはコンテンツを直接提示するのではなく、「目に見えない形で」表現されることが多い)に加えて、「ガイダンス」を目的としています。
ウェブサイトのホームページ上のコンテンツの 100% がナビゲーションであると想定できます。
ナビゲーションは詳細であればあるほど良いというわけではない
8. 「補助ナビゲーション」または「フレンドリーナビゲーション」を設計する際に従う原則は、多くの場合、ユーザーが情報 A を閲覧しているときに操作 B を実行する必要がある可能性があるとデザイナーが判断した場合、「操作 B を実行する方法」をユーザーにすぐに知らせるように努めるというものです。
もちろん、「ユーザーにすぐに知らせる」ということは、「操作 B をページ上のわかりやすい場所に配置する」ことも意味します。ただし、「可能性のある需要」が多すぎるため、直接配置は選択肢にならないことがよくあります。
9. 調査レポートによると、東洋人はウェブサイトを操作する際に比較的怠惰に考えており、特に「考えることへの恐怖」に陥りやすいそうです。
簡単に言えば、東洋の人々が情報 A を閲覧しているときに操作 B を実行する必要がある場合、一般的に「操作 B はページ上のどこかに明確に配置されている必要があり、そうでなければデザインが良くない」と考えています。
そのため、多くのウェブサイトのデザインではこの原則に違反し、ページ上に「補助ナビゲーション」や「フレンドリーナビゲーション」を多く配置していることがよくあります。結果は上で述べたとおりです。ページを複雑にすると、ユーザーは混乱してしまいます。

<<:  MySQL データテーブルのパーティション戦略と利点と欠点の分析

>>:  カタツムリ映画システムのDocker展開の詳細なプロセス分析

推薦する

Vue echarts は棒グラフの動的な表示を実現します

この記事では、棒グラフの動的な表示を実現するためのvue echartsの具体的なコードを参考までに...

Nginx ロードバランシング クラスタの実装

(1)実験環境youxi1 192.168.5.101 ロードバランサーyouxi2 192.168...

MySQL データベースのエンコーディングを utf8mb4 に変更する方法

utf8mb4 エンコーディングは utf8 エンコーディングのスーパーセットであり、utf8 と互...

ページングクリックコントロールを実装するネイティブJS

これは、ネイティブJSを使用してページングクリックコントロールを実装する必要がある面接の質問です。参...

Vue el-date-picker 動的制限時間範囲ケースの詳細な説明

2つの状況がある1. 開始時間と終了時間が同じボックス内にあります(今月のみ限定) 2. 開始時間と...

MySQL Innodbインデックスの原理の詳細な説明

導入振り返ってみると、4年前、私がMySQLのインデックスについて学んでいたとき、先生はインデックス...

MySQL ストアド プロシージャにおけるループ ステートメント (WHILE、REPEAT、LOOP) の使用法の分析

この記事では、例を使用して、MySQL ストアド プロシージャでのループ ステートメント (WHIL...

HTML webpackプラグインの使用に関する簡単な分析

html-webpack-pluginプラグインを使用してページを開始すると、htmlページをメモリ...

リンク内の href=# はどういう意味ですか?

現在のページへのリンク。 -------------------一般的な使用法は次のとおりです。 &...

シンプルなタブバー切り替えケースを実現するJavaScript

この記事では、タブバーの切り替え効果を簡単に実現するためのJavaScriptの具体的なコードを参考...

Linux で MongoDB のリモート自動バックアップを実装する方法

序文古いプロジェクトを引き継ぐ苦労 - MongoDB クラスターの学習と構築に関する前回の記事を読...

HTML チュートリアル: title 属性と alt 属性

XHTML は CSS レイアウトの基礎です。jb51.net は常に XHTML 知識の習得を重視...

JavaScriptイベント実行メカニズムの深い理解

目次序文ブラウザJS非同期実行の原理ブラウザのイベントループ実行スタックとタスクキューマクロタスクと...

Vite2とVue3を使用したウェブサイトの国際化を実現するプロセス全体

目次序文vue-i18nをインストールするロケールの設定getLangs.js の実装i18nインス...

mysqlはルートユーザーと一般ユーザーを作成し、機能を変更および削除します。

方法1: SET PASSWORDコマンドを使用する mysql -u ルート mysql> ...