ウェブサイトのコンテンツの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展開の詳細なプロセス分析

推薦する

2008 年の Web デザインにおける 10 の経験

<br />インターネットは絶えず変化しており、BusinessWeek.com は専門...

Vue でメニュー権限制御を実装するためのサンプルコード

バックエンド管理システムで作業している場合、通常、メニュー権限制御に関連する問題に遭遇します。もちろ...

MySQL 5.7.18 無料インストール版ウィンドウ設定方法

初めてのブログです。データベースの勉強を始めた頃のことを書いています。自分でダウンロードしたのですが...

IDEA を MYSQL データベースに接続するための構成時に失敗する問題の解決策

この記事では、主に、IDEA を MYSQL データベースに接続するための構成時に失敗する問題の解決...

検証例 MySQL | 同じ値を持つフィールドを更新すると、binlog に記録されます

1. はじめに数日前、開発仲間から、フィールドを同じ値に更新すると binlog が記録されるかどう...

CocosCreator ScrollView 最適化シリーズ: フレーム読み込み

目次1. はじめに2. 行き詰まった問題の分析3. 解決策(理論) 4. ソリューション(コード) ...

Raspberry Pi msmtp と mutt のインストールと設定のチュートリアル

1. muttをインストールするsudo apt-get install mutt 2. msmtp...

DOCTYPE 文書型宣言 (Web ページ愛好家必読)

DOCTYPE 宣言 作成するすべてのページの先頭に、ドキュメント宣言が必要です。はい、そうでしょう...

MySQLの起動と接続方法の例分析

目次mysqldの起動方法方法 1: mysqld方法 2: mysqld_safe方法3: mys...

MySQL レプリケーション問題の 3 つのパラメータの分析

目次01 sql_slave_skip_counter パラメータ02 スレーブスキップエラーパラメ...

Web でよく使われるフォントの紹介 (iOS および Android ブラウザでサポートされているフォント)

年末なので仕事も少なくなっています。私が何もせずにいるのを見ると、上司はきっと不快に思うでしょう。そ...

CSSはコーナーカット+ボーダー+投影+コンテンツ背景色のグラデーション効果を実現します

CSS を使用するだけで、コーナーカット + ボーダー + 投影 + コンテンツの背景色のグラデーシ...

ECMAScript6 におけるマップマッピングの基本概念と一般的な方法

目次マッピングとは何かオブジェクトとマップの違いマップの共通メソッド宣言と初期化割り当てセットキー値...

Docker JVM メモリ使用量の表示

1. Docker コンテナのホスト マシンに入り、指定されたイメージを実行しているコンテナ ID ...

ネイティブ js はフォームの定期的な検証を実装します (検証後にのみ送信)

以下の機能が実装されています。 1. ユーザー名: onfouc は msg ルールを表示します。o...