javascript - AJAXとブラウザの戻るボタン

Question

私はwww.darknovagames.comでブラウザベースのゲームを実行しています。最近、私はCSSを使用してサイトの再フォーマットに取り組んでおり、すべてのページをHTML標準に従って検証するようにしています。

私は、左側のAJAXにページのナビゲーションメニューを表示するというこのアイデアをいじっています（ユーザーを毎回別のページに移動するのではなく、タイトルとナビゲーションバーを再ロードする必要がありますが、ほとんど変更されません）。そうすると、ブラウザの[進む]/[戻る]ボタンが壊れてしまう可能性があることを知っています。私の質問は、サイトをAJAXして、ユーザーがゲームをプレイするためにサイトナビゲーションを使用する必要があるのか、それとも現在のサイトをそのままにして、ナビゲーションに標準のハイパーリンクなどを使用するのかということです。

私が推測する理由は、私がフォーラムシステムをサイトに組み込んだことであり、多くの場合、フォーラム内の特定のトピックにリンクしたいと思います。

提案も受け付けています。ユーザーがブックマークしたり、前後に移動したりできるようにURLを変更しながら、サイトの本文領域のみをリロードする標準的な（できれば従来のフレームなしの）方法はありますか？それは私の問題も解決する可能性があります。私はここで最善の解決策を求めているだけであり、特定の質問に対する答えではありません。^ _ ^

ありがとう

score 35 · Accepted Answer

全体ではなく、更新が必要なページの一部にajaxを使用します。そのためには、テンプレートを使用する必要があります。

ページ上のさまざまな状態の変化に備えて戻るボタンを保持したい場合は、それらを＃achorsと組み合わせて、URLを変更します（ブラウザーに別のGETを発行させることはありません）。

たとえば、Gmailは次のようになります。

mail.google.com/#inbox/message-1234

＃を超えるものはすべて、ajaxを介して発生したページ状態の変更でした。[戻る]を押すと、もう一度受信トレイに移動します（ここでも、別のブラウザを使用せずにGETします）

score 29 · Accepted Answer

AJAX を有効にする場合は、サイトのすべての重要なページへのアクセス可能な URL を犠牲にしてはいけません。これは、人々が使用できるナビゲート可能なサイトのバックボーンです。

すべての機能を AJAX 呼び出しとコールバックに押し込むと、基本的に、ユーザーが必要とする機能とコンテンツにアクセスするための単一のパスをユーザーに強制することになります。これは、Web の本来の機能に完全に反しています。人々はアドレスバーと戻るボタンを頼りにしています。すべてのリンクを上書きして、基本的にサイトが AJAX のみを介して更新される単一のページになるようにすると、ユーザーがサイトをナビゲートして必要なものを見つける能力が制限されます。また、ユーザーが見つけたものを共有することもできなくなります (これがポイントの一部ですよね?)。

サイトのユーザーのメンタルマップについて考えてみましょう。ホームページからアクセスしたことがわかっている場合は、何かを検索し、ゲームのページに行き、特定のゲームをプレイし始めます。これは、ユーザーが実行した 4 つの異なるアクション単位です。これらの各ページで、他のいくつかのより小規模で重要でないアクションを実行した可能性がありますが、これらは主要な単位です。[戻る] ボタンをクリックすると、来た道を戻ることを期待する必要があります。これらすべてのページを AJAX 呼び出しでロードしている場合、ユーザーの期待に反する機能を実行するサイトを提供していることになります。

サイトをすべての重要な機能 (検索、ホーム、プロフィール、ゲームなど) に分割します。これは、サイトの内容によって決まります。これらのページにリンクする場合は、通常のリンクと静的 URL を使用してください。

AJAXは問題ありません。しかし、その技術は、それをいつ使用し、いつ使用しないかを知ることです. 上でスケッチしたモデルを維持すれば、ユーザーはそれを高く評価するでしょう。

score 5 · Accepted Answer

reallysimplehistory をご覧ください。この wiki は 10 か月間更新されていませんでしたが、私は Ajax Experience 2008 に参加したばかりで、Brian Dillard によるプレゼンテーションを見ました。彼は、0.8 コードが彼のハードドライブにあると言っています。うまくいけば、すぐにダウンロードできるようになります。

score 4 · Accepted Answer

別の解決策：

AJAX ページネーションと戻るボタン

これは、JQuery & Mootools で動作する、最高のもののようです。

score 2 · Accepted Answer

ファンキーなJavascriptテクニックを使用してこの問題を解決する方法はたくさんありますが、多くの場合iframeが関係していますが、この状況では、なぜAJAXを使用しているのか疑問に思う必要があります。それは実際にサイトをユーザーにとって使いやすくするつもりですか？あなたがそれを使っているように私には聞こえますが、それは実際にあなたの訪問者に何らかの価値を追加するからではなく、それ自体がクールだと思います（それ自体は必ずしも悪いことではありません）。通常のWebサイトから、通常のハイパーリンクされたドキュメントは、ほとんどの場合、プライマリナビゲーションに適しています。それは人々が期待することであり、私はあなたがいくつかの素晴らしい技術に基づいてそれらの期待を破ることを回避することをお勧めしません。

AJAXは素晴らしく、多くの素晴らしいことを実行できます。Webサイトのナビゲーションを変更することはその1つではありません。

しかし、この問題をうまく理解できたのですが、AJAXを進めているだけで、これについても考えていないサイトがたくさんあります。

score 2 · Accepted Answer

このシンプルで軽量なPathJS ライブラリを試してください。リスナーをアンカーに直接バインドできます。

例：

Path.map("#/page").to(function(){
    alert('page!');
});

score 1 · Accepted Answer

AJAX は、まさにあなたが説明した理由から、ナビゲーションに最適なソリューションではありません。ブラウザーのナビゲーション UI を壊す手間に比べれば、ヘッダーとナビゲーションバーをリロードする手間は最小限です。

AJAX のより適切な例は、ユーザーがメインウィンドウでゲームをプレイできるようにし、ナビペインで他のコンテンツのリストを参照できるようにすることです。ゲームプレイを妨げることなく、AJAX を介してナビペインに追加の項目を読み込むことができます。

score 0 · Accepted Answer

私は単純なハイパーリンクに固執します。ページファニチャが HTML の大部分を占めるべきではないため、ページリクエストから除外しても大きなメリットにはなりません。各リソースをアドレス指定できるようにする (つまり、ユーザーが興味を持つ可能性のあるコンテンツの各ビットの URL) は、Web の重要な設計機能です。これは、キャッシュが機能することを意味し、ユーザーがブックマークを共有できることを意味します。Google だけでなく、ソーシャルブックマークサイトも機能します。

私の意見では、その後のページの変更から HTML バイトを数バイト削減することは、努力する価値がありません。

javascript - AJAXとブラウザの戻るボタン

8 に答える 8

Related

Reference