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

推薦する

vitrualBox+ubuntu16.04 python3.6 最新チュートリアルと詳細な手順のインストール

最近ディープラーニングを学ぶためにUbuntu+Python 3.6バージョンを使う必要があるため、...

CSSは、閉じることができるマスクレイヤーを備えたポップアップウィンドウ効果を実装します。

実際の開発ではポップアップウィンドウがよく使われます。CSS3を勉強していたときに、閉じることができ...

Vue-cliに基づくコードセットは複数のプロジェクトをサポートします

目次アプリケーションシナリオアイデアプロジェクト構造全体的なプロジェクト構造webpack パッケー...

ffmpeg 中国語パラメータの詳細な説明

FFMPEG 3.4.1 バージョンパラメータの詳細使用方法: ffmpeg [オプション] [[入...

Linux の Centos7 に Mysql5.7.19 をインストールする詳細なチュートリアル

1. MySQLをダウンロードするURL: https://dev.mysql.com/downlo...

イメージのアップロードとダウンロードに docker をプロキシするためのプライベート ライブラリとして nexus を使用する

1. Nexusの設定1. Dockerプロキシを作成する外部ネットワーク ウェアハウスからローカル...

MySQL ページング中にオフセットが大きすぎる場合の SQL 最適化の経験の共有

問題を見つけるコンテンツをリストで表示すると、リスト内のコンテンツの数は多いかもしれませんが、ユーザ...

Vueはコードのハイライトを実現するためにモナコを使用しています

Vue 言語と要素コンポーネントを使用して、コード コンテンツの入力を必要とし、ハイライト表示が可能...

CentOS ベースの OpenStack 環境の展開に関する詳細なチュートリアル (OpenStack のインストール)

エフェクト表示: 環境準備コントローラーノード: 6GB 4時間60GB/30GB/30GB計算ノー...

画像のプリロードと遅延ロードを実装するJavaScript

この記事では、JavaScriptで画像のプリロードと遅延ロードを実装するための具体的なコードを参考...

CSS3はトランジション効果を実現するためにtransitionプロパティを使用する。

物件の詳細な説明transition 属性の目的は、一部の CSS プロパティ (背景など) をスム...

Docker に Zookeeper を素早くインストールする方法の詳細なチュートリアル

Docker で Zookeeper を素早くインストール会社を変わってから長らくZookeeper...

JDカルーセル効果を実現するための純粋なHTMLとCSS

JD カルーセルは、動的な効果を追加せず、主に位置決めの知識を使用して、純粋な HTML と CS...

ウェブページの再設計の7つの主要要素 ウェブページの再設計の7つの主要要素を共有する

Shopify Plus は、私たちが設立した e コマース プラットフォームのエンタープライズ バ...

React+Typescriptはカウントダウンフックメソッドを実装します

まず、setIntervalはフックとしてカプセル化されます👇 'react' から...