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

StackOverflow https://stackoverflow.com/questions/163610

質問

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

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

私が推測する理由は、サイトにフォーラムシステムを構築したことです。多くの場合、フォーラム内の特定のトピックに発言をリンクさせたいと思います。

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

ありがとう

役に立ちましたか？

解決

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

すべての機能をAJAX呼び出しとコールバックにシャベルすると、基本的にユーザーは単一のパスに移動して、必要な機能とコンテンツにアクセスします。これは、Webの機能とはまったく異なります。人々はアドレスバーと戻るボタンに依存しています。すべてのリンクをオーバーライドして、サイトが本質的にAJAXを介してのみ更新する単一のページになるようにすると、ユーザーがサイトをナビゲートして必要なものを見つける能力が制限されます。また、ユーザーが見つけたものを共有できないようにします（これはポイントの一部ですか？）。

サイトのユーザーのメンタルマップについて考えてください。ホームページからアクセスしたことがわかった場合、何かを探しに行き、ゲームページに行き、特定のゲームをプレイし始めました。これは、ユーザーが行った4つの異なるアクションユニットです。彼らはこれらの各ページで他のいくつかの小さな、より重要でないアクションを行ったかもしれません-しかし、これらはメインユニットです。 [戻る]ボタンをクリックすると、元のパスに戻ることが期待されます。これらすべてのページをAJAX呼び出しを介してロードする場合、ユーザーが期待する機能とは逆の機能を実行するサイトを提供します。

サイトをすべての重要な機能（つまり、検索、ホーム、プロファイル、ゲームなど）に分割します。これは、サイトの内容によって決まります。これらのページにリンクする場所はどこでも、通常のリンクと静的URLを使用して行います。

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

他のヒント

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

ページのさまざまな状態変更に対して戻るボタンを保持したい場合は、それらを＃achorsと組み合わせてURLを変更します（ブラウザに別のGETを強制的に発行させないでください）。

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

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

＃以降のすべては、ajaxを介して発生したページ状態の変更でした。 [戻る]を押すと、再び受信トレイに移動します（再度、別のブラウザーGETなしで）

reallysimplehistory をご覧ください。 wikiは10か月間更新されていませんが、私はちょうどAjax Experience 2008にいて、ブライアンディラードによるプレゼンテーション。彼は、0.8コードがハードドライブにあると言います。うまくいけば、すぐにダウンロードできるようになります。

別の解決策：

AJAXページネーション＆amp;戻るボタン

これは、JQueryおよびMootools。

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

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

この問題を解決するための準備は完了しましたが、AJAXを使用するだけでこれについても考えないサイトがたくさんあります！

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

例：

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

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

AJAXのより適切な例は、ユーザーがメインウィンドウでゲームをプレイできるようにし、ナビゲーションペインの他のコンテンツのリストを閲覧できるようにすることです。ゲームプレイを妨げることなく、AJAX経由でナビゲーションペインに追加のアイテムをロードできます。

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

その後のページの変更から2、3バイトのHTMLバイトを削除することは、努力する価値はありません、

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top