ほとんどの開発者は、利用者と末永く付き合ってゆけるように、いろいろな方法を探るものです。サイト利用者を確実に引き留めておく 1 つの方法は、利用者各個人の環境に常にマッチするクライアント・サイドの JavaScript を使ってサイトを開発することです。現在のように、さまざまなブラウザーやプラットフォームが存在し、画面 解像度にもかなりの幅があり、プラグインなどのテクノロジーも存在する状況においては、低レベルの環境にあるサイト利用者を閉め出さずに高レベルのサイトを提供することが、Web 開発者の大きな課題となっています。

利用者の必要に応える

開発者は予想されるあらゆる利用者の必要を満たすために、さまざまな技法を利用します。手間のかからない (しかし得られる利益も小さい) 方法は、最も低レベルの最大公約数的な利用者に合わせて設計することです。この場合、一部のサイト利用者にとって問題を引き起こす可能性のあるテクノロジーはすべて制限または除外します。あるいは、Web サイトを十分に楽しむためにどんなブラウザーやテクノロジーが必要であるかを最初の入り口ページに明記し、利用者が必要な機能をダウンロードするためのリンクを設定しておくという方法もあります。

このどちらの方法も有効ですが、洗練されているとは言えません。これらの方法の代わりに JavaScript を使用すると、サイト利用者のニーズを検出し、利用者を該当するページに誘導できます。利用者やサイトの潜在能力を十分に発揮させない手はありません。検出/誘導スクリプトは、あらゆるサイト利用者のブラウザーとスペックを判別 し、利用者を最も適切なページに誘導します。もちろん、利用者のさまざまなレベルに合わせてページを並列的に作成するには、開発者であるあなたの側により多くの計画と作業が必要になりますが、こうすることによって利用者の満足度はアップします。結局のところ、利用者が Web サイトに満足するならば、サイトを繰り返し利用してもらえるというのが、開発者の心得ておくべき鉄則です。

上に戻る

事前の計画

スクリプト作成に取りかかる前に、どんな利用者がサイトを閲覧すると予想されるか、またどんなコンテンツを予定しているかをしっかり把握することが重要です。開発者と開発チームは、利用者統計やサーバー統計の情報を丹念に調べてみる必要があります。そうすれば、ターゲットとする利用者についての予測を立てることができます。たとえば、ブラウザー、オペレーティング・システム、モニター解像度、プラグインなどについての予測です。(「最も低レベルの最大公約数 」を参照。)次に、そのような利用者のニーズをどうしたら満たすことができるか、どのように最高のビジュアル上/技術上の内容を提供することができるか、を決定します。(「コンテンツではなく、テクノロジーのための誘導 」を参照。)これをもとにして、整合性のある分かりやすい設計やテクノロジーの作成が可能になります。

サイトのコンテンツを決定するには、クライアント、組織、開発者仲間などと協議を重ね、そのサイトで何を成し遂げようとしているのかを理解する必要があります。具体的な目標が分かれば、どのようなオプションをスクリプトとして作成するかを決定できます。たとえば、Internet Explorer を前提にした DHTML をたくさん作るものの、IE を使用しないサイト利用者もサポートしなければならないという場合は、より融通 のきくページに IE 以外の利用者を誘導するスクリプトを計画できます。

サイトの目的や予想される利用者をはっきり理解して基本的な設計が決まったら、次に考慮するのは、どのような検出/誘導スクリプトを作る必要があるかという点です。たとえば、以下のような点を検討します。

• 設計中のサイトでは、予定される要素を所定の場所に確実に保持するために、表の幅を固定するでしょうか。もしそうであれば、解像度を検出するスクリプトが役立ちます。・ カスケーディング・スタイルシート (CSS) と Dynamic HTML を多用する場合には、ブラウザー別 に誘導を行うと、利用者はどんなブラウザーでもサイトを楽しめるようになります。
• HTML 4.0 に厳密に準拠したテクノロジーやブラウザー固有のテクノロジー (ActiveXコンポーネントなど) の使用を予定しているなら、ブラウザー別の検出/誘導が不可欠です。
• ブラウザー検出機能があれば、必要なプラグインを持たないサイト利用者を、そのプラグインを必要としないページや、そのプラグインに関する情報を提供するページに誘導することができます。

どのようなスクリプトが必要かが分かれば、次に、それらのスクリプトを自分で作るか、それとも既製のスクリプト (参考資料 を参照) を改良するかを決定します。

上に戻る

コンテンツではなく、テクノロジーのための誘導

利用者についてあまりに予測し過ぎるのも危険です。予測の間違いのために、利用者に不満を与えてしまうおそれがあるからです。一部の Web サイトでは、誘導スクリプトの機能が過剰なために、コンテンツそのものにバリアが張り巡らされているようです。たとえば、職場で Windows マシンを使っているサイト利用者が、自宅にある家族の Macintosh コンピューターに関する情報を捜しているとしましょう。Windows マシンを使っている利用者は Windows の情報にしか興味がないと、サイト開発者が決め込んでしまうとすれば、これは勇み足と言えます。利用者の選択の多様性を狭めるような管理をするのではなく、利用者のニーズに合わせるようにすべきです。利用者を誘導する時は、利用者がどんなコンテンツを見たいかを予想して誘導するのではなく、技術的に何をサポートしているかに基づいて誘導すべきだということです。

上に戻る

既製のスクリプトを探すか、それとも自前のスクリプトを使うか

既製のスクリプトを使用するか、それとも独自のスクリプトを開発するかは、開発者としてのニーズ、時間の有無、開発者や開発チームのスキルによって決まります。既製のスクリプト (参考資料 を参照) の中に適当なものがあって、それが無償で手に入るならば、自分で作る手間が省けます。既存のスクリプトは、特定のニーズに合わせていつでも調整できます。しかし、非常に特殊なニーズに合わせる場合であれば、独自の検出スクリプトをコーディングしたほうがよいかもしれません。

次に、検出/誘導スクリプトの機能を分かりやすく示すために、スクリプトの簡単な例をいくつか示します。

上に戻る

詳細を検出する

この詳細なスクリプトは、JavaScript によってどんな情報を収集できるかを具体的に例示します。まず分かりやすく説明するために、いくつかの部分に分けてみます。それから、実際に使用できる形に合成してみましょう。

まず Listing 1 のように、このスクリプトはオペレーティング・システムを検出して、その情報を保管します。

Listing 2 は、ブラウザーから得られる情報をスクリプト結果に割り当てるための変数を定義した部分です。

Listing 3 は、4.0 ブラウザーのみから得られる追加情報を収集します。ここで集めるのは、より詳細な情報のごく一部です。(cookie は、Internet Explorer 4.0 以降に対してのみ反応し、Navigator の場合は CPU テストで不明 (unknown) が戻されます。)

このスクリプトをテストするには、Listing 4 の内容を HTML 文書の本文に追加して、その HTML 文書をいろいろなブラウザーで表示してみます。ここでは、戻りコードの見栄えをよくするために少しの HTML を付け加えました (図 1 と図 2 のような粗い画像でも判読できるようになっています)。

完全な HTML 文書の中でのスクリプト全体は、Listing 5 のようになります。

図 1 と図 2 は、Listing 4 のスクリプトの結果のページを、それぞれWindows の Internet Explorer 5.0 と Macintosh の Netscape Navigator に読み込んだ様子です。このスクリプトは、JavaScript を使ってどんな情報を検出できるかを詳細に示しています。

上に戻る

ブラウザー・タイプ別の誘導

このような検出スクリプトの最も一般的な使い方は、ブラウザーのタイプに合わせてそれぞれ違ったページに誘導することです。Listing 6 に示す非常に簡単なスクリプトは、Netscape か Internet Explorer かを検出して、それぞれのブラウザー専用に設計されたページに誘導します。こうしてブラウザー固有のテクノロジーを使用して、利用者の期待に応えるとともに、一部の利用者に不満を与えないで済みます。

具体的な方法は次のとおりです。

1. Netscape Navigator 用のページを設計します。サンプル・スクリプトでは、nn_index.html という名前になっています。
2. Internet Explorer 用のページを設計します。サンプル・スクリプトでは、msie_index.html という名前になっています。
3. 検出/誘導スクリプトを含んだ索引ページを作成します (Listing 6 を参照)。インデックス・ページの本文にはまだ何も入れません。

このサンプル・サイトのインデックス・ページを Microsoft Internet Explorer で読み込むと、ただちに IE 用のページに誘導されます (図 3 を参照)。

上に戻る

ページを画面解像度に合わせる

画面解像度を検出して誘導するには、Listing 7 のスクリプトを利用します。もちろん、まずは、サポートしたい解像度ごとに別 々のページを作成する必要があります。それぞれの解像度専用のページに名前を付けて識別 する必要はありません。このスクリプトが自動的に識別します。その後、空の HTML 文書を作成して、Listing 7 を冒頭部分に組み入れます。

HTML 文書の本文開始タグに、次のステートメントを追加します。<body onload="redirectPage()">

そのページをデフォルト・ページまたはインデックス・ページとして保管します。その後、画面 の解像度を変更してページを読み込むテストを何度か繰り返します。このスクリプトを使用すると、利用者の解像度に合わせて最適化された設計が可能になります。

上に戻る

スクリプトのテスト

最後に、スクリプトをスムーズに、整合性のある形で提供することが重要です。自前のスクリプトであれ、ライブラリーから選んだスクリプトであれ、すべてのスクリプトをさまざまなブラウザーやコンピューターの環境で何度もテストして、正しく動作することを確認してください。

上に戻る

要約

確かに、さまざまな利用者のためにカスタマイズされたページをいくつも余分に作るのは時間と労力を要する作業です。開発者の中には、予想される利用者やサイトの目的を把握した上で、このステップを省略する人もいることでしょう。そうした決定にも確かに一理あります。しかし、利用者のことをよく考えずに最先端のテクノロジーを活用しようとするのは、お客様に対して失礼だと言わざるを得ません。JavaScript による検出/誘導機能を利用すれば、高レベルの利用者に合わせた設計という目標をあきらめることなく、すべての利用者にとって満足できるサービスを提供できます。

参考文献

• さまざまなブラウザーやテクノロジーの現在の利用状況に関する統計
  
  
• 既製の検出スクリプトを探す:
  • DevHead ライブラリー
  • Cut n' Paste JavaScript (ニュース、サポート・フォーラム、話題のスクリプト)
  
  
  
• 検出スクリプトを独自にコーディングする方法を学ぶには Joe Burns's HTML Goodies JavaScript Tutorials
  
  
• JavaScript を独自に作成したい方は、ぜひ「JavaScript: The Definitive Guide」(David Flanagan 著、O'Reilly & Associates 社出版) を読んでみてください。この本を買うときには、Flanagan 氏のもう 1 つの著書「JavaScript Pocket Reference」も合わせて購入してください。これは JavaScript 開発者には欠かせない一冊です。
  
  
• Danny Goodman 著「The JavaScript Bible」(IDG ブックス出版) は非常に人気があります。ビジュアルに学習したい方には、「Peachpit's Visual Quickstart Guide」シリーズの中の「JavaScript for theWorld Wide Web」(Tom Negrino、Dori Smith 共著) がお勧めです。最後に、Joe Burns 著「JavaScript Goodies」(Que 社出版) は、検出/誘導機能をはじめとする JavaScript の幅広い情報が満載されている便利な一冊です。
  
  

著者について

この記事を評価する

コメント

上に戻る

目次

• 利用者の必要に応える
• 事前の計画
• コンテンツではなく、テクノロジーのための誘導
• 既製のスクリプトを探すか、それとも自前のスクリプトを使うか
• 詳細を検出する
• ブラウザー・タイプ別の誘導
• ページを画面解像度に合わせる
• スクリプトのテスト
• 要約
• 参考文献
• 著者について
• コメント