表面的なウェブデザイン

表面的なウェブデザイン
<br />私はいつもYahooのウェブデザインが素晴らしいと信じてきました。しかし、このサイトよりも見栄えの良いウェブサイトはたくさんあるので、具体的な理由を述べることはできません。良いと思う理由は、世界最大のサイトであり、世界レベルのデザイナーが数え切れないほどいるからです。このようなデザインは、長年の蓄積の結果です。したがって、Yahoo のデザインに共感することは、実際には権威に対する盲目的な崇拝なのです。私たちの周りには同様のウェブサイトがたくさんあります。
2004年と2005年にウェブ標準化の考え方が中国に導入されたとき、私はウェブページのコード実装を本当に気にし始めました。以前は、Fireworks と Photoshop がこれらの作業に役立っていました。知識を深めるにつれて、Web デザインは、とても軽く、エレガントで、自由で、柔軟になり得ることがわかりました。このアイデアは、テーブル レイアウトを放棄することから始まりました。今回改めてYahooのサイトを見ると、その素晴らしさが改めて実感できます。

その後、Ajax の導入により、ユーザー エクスペリエンスという用語が業界で広まり始め、Web の実践者たちは新たなブレインストーミングを開始し、Web に対する理解は見た目の良さから使いやすさへと高まりました。今回改めてYahoo!を見てみると、今まで気づかなかった細かい部分が目に見えないところで便利さを提供してくれていることに気づき、デザイナーが一生懸命考えたデザインなのだと実感します。今、私が以前 Yahoo について理解していたことを振り返ってみると、それは実に表面的なものでした。
今のところ、ユーザー エクスペリエンスに対する理解はまだ表面的です。この用語はチャーハンと同じくらい一般的ですが、実際にそれを本当に理解している人はほとんどいません。そして、私はそれがデザイン後の修正だけだと誤解していたほどです。数日前まで、「ユーザー エクスペリエンスの要素」で提案されたユーザー エクスペリエンス モデルを見ていました。このモデルでは、ユーザーのニーズ、機能、情報アーキテクチャ、ビジュアル デザインがユーザー エクスペリエンスに関係しているとされていました。この頃、ユーザーエクスペリエンスの概念が徐々に明確になっていきました。しかし同時に、Web デザインの表面的な理解も露呈してしまいます。
図を見ると問題がよくわかるはずです:
ユーザーエクスペリエンスの要素
写真から、私たちが最も気にしていたビジュアルデザインが、実は最上位レベルにあることがわかります。根底にあるユーザーのニーズ、情報アーキテクチャなどが基礎となります。基礎がしっかりしていなければ、どんなに美しいウェブページであっても、単なる装飾になってしまいます。しかし、このエリアのコンテンツは現在基本的に空白であり、利用できるのは散在した未熟な断片だけです。さらに重要なのは、これらのコンテンツは、どこにでも適用できる Web 標準の概念とは非常に異なっていることです。これらのコンテンツの存在を認識することは概念的な承認に過ぎず、他の人の方法は参考としてしか役立ちません。実際に理解を繰り返すには長いプロセスが必要であり、そうでなければ単なる空論になってしまいます。
我が国のウェブデザインと海外のウェブデザインとのギャップは、あらゆる面でかなり大きいです。しかし現時点では、最大のギャップはユーザー エクスペリエンスの最下層にあるように思われます。これには、ユーザーニーズ分析と情報アーキテクチャが含まれます。千鳥氏は、我が国と海外との格差は約 5 年だと述べました。皆さんは同意しないかもしれませんが、Case Digital Web Redesign とその 2002 年のレベルを見て、それを現在のレベルと比較すると、5 年の格差が理にかなっていることがわかります。

<<:  MySQL の高度な機能 - データ テーブル パーティショニングの概念とメカニズムの詳細な説明

>>:  Nginx 構成の実装 HTTPS セキュリティ認証

推薦する

ローカルストレージにブール型の値を保存する際の落とし穴を解決する

LocalStorageはブール値を保存します今日、ブール値データを保存するために localsto...

MySQL 5.7.21 winx64 グリーンバージョンのインストールと設定方法のグラフィックチュートリアル

この記事ではMySQL 5.7.21のインストールと設定方法を記録しています。具体的な内容は以下のと...

WeChat公式アカウントでReactプロジェクトを実行する方法

目次1. a タグを使用して PDF をプレビューまたはダウンロードします。書き方は、携帯電話でクリ...

hr 水平線スタイルの例コード

コードをコピーコードは次のとおりです。 <hr style="width:490px...

MySQLが数十億のトラフィックをサポートする方法

目次1 マスター・スレーブの読み取り・書き込み分離1.1 コア2 マスタースレーブレプリケーション2...

CSS3で実装された読み込みアニメーション

成果を達成する実装コード <h1>123WORDPRESS.COM</h1>...

CSS を使用して半透明の背景と不透明なテキストを実現する例

この記事では、CSS を使用して半透明の背景と不透明なテキストの効果を実現する方法の例を紹介します。...

docker-compose ポートと expose の違いの詳細な説明

docker-compose でコンテナ ポートを公開する方法は、ports と expose の ...

Vue はグラフィック検証コードログインを実装します

この記事では、グラフィック認証コードログインを実装するためのVueの具体的なコードを参考までに紹介し...

MySQL 5.7.17 インストール グラフィック チュートリアル (Windows)

最近データベースを学び始めたのですが、とても興味深いコースだと感じていますが、含まれる内容の多くは私...

MySQL データベース 8 - データベース内の関数の適用の詳細な説明

データベースの組み込み関数の使用この記事では、主に日付関数、文字列関数、数学関数など、データベースの...

モバイルデバイス用のメタタグ設定の完全なリスト

序文以前フロントエンドを勉強していたとき、メタタグに対する私の理解はこの一文だけでした。 <メ...

Linux カーネル デバイス ドライバー システム コールに関する注意事項

/**************************** * システムコール**********...

Ubuntu 20.04 IPアドレスを変更する方法の例

例:本日、前回のオフィスコラボレーションプラットフォーム実験の続きをしていたところ、仮想マシンは以前...

Linux netfilter/iptables の知識ポイントの詳細な説明

ネットフィルターNetfilter は、パケット フィルタリング、転送、およびアドレス変換 NAT ...