2008-10-02 165 views
32

我在www.darknovagames.com上運行基於瀏覽器的遊戲。最近,我一直在努力用CSS重新格式化網站,試圖根據HTML標準來驗證其所有頁面。AJAX和瀏覽器後退按鈕

我一直在玩這個想法,讓左側的AJAX導航菜單位於頁面中(而不是每次都將用戶帶到單獨的頁面,需要重新加載標題和導航欄,這幾乎從不改變),我知道如果我這樣做,我可能會在瀏覽器中打破前進/後退按鈕。我想我的問題是,我應該繼續AJAX網站,因此要求用戶使用網站導航來玩遊戲,還是應該離開網站,並使用標準超鏈接和導航內容?

我問我推測的原因是我建立了一個論壇系統進入該網站,很多時候我想鏈接說在論壇內的一個特定主題。

我也樂於提供建議。有沒有一個標準(最好沒有傳統的框架)的方式來使網站重新加載的身體區域,同時仍然改變網址,以便用戶可以書籤和前進/後退等?這也有可能解決我的問題。我只是要求最好的解決方案,而不是對特定問題的回答。^_^

感謝

回答

26

如果您打算啓用AJAX,請不要在網站上的每個重要頁面都有可訪問的網址的情況下執行此操作。這是人們可以使用的可導航網站的支柱。

當您將所有功能都剷除到AJAX調用和回調函數中時,基本上迫使您的用戶進入一條訪問他們想要的功能和內容的路徑 - 這完全違背了Web的功能。人們依靠地址欄和後退按鈕。如果您覆蓋所有鏈接,以便您的網站本質上是隻通過AJAX更新的單個頁面,則會限制用戶瀏覽網站並找到所需內容的能力。它也會阻止你的用戶分享他們發現的東西(這是關鍵的一部分,對吧?)。

想想用戶的網站的心理地圖。如果他們知道他們是通過主頁進入的,那麼他們會去搜索某些東西,然後他們登陸游戲頁面,然後他們開始玩特定的遊戲,這是用戶採取的四個不同的行動單位。他們可能在每個頁面上都做了其他一些更小,更微不足道的行爲 - 但這些是主要單位。當他們點擊返回按鈕時,他們應該期望回到他們進入的路徑。如果您通過AJAX調用加載所有這些頁面,則會提供一個功能與用戶所期望的功能相反的網站。

將您的網站分成每個重要功能(即搜索,家庭,個人資料,遊戲 - 它將由您的網站的所有內容決定)。在鏈接到這些頁面的任何地方,請通過常規鏈接和靜態URL進行操作。

AJAX很好。但它的藝術是知道什麼時候使用它,什麼時候不使用。如果你堅持我上面勾畫的模型,你的用戶會很感激。

34

對於需要更新,而不是整個事情的部分頁面使用AJAX。爲此,你應該使用模板。

如果您仍想保留頁面上各種狀態更改的後退按鈕,請將它們與#achors組合以更改網址(不會強制瀏覽器發出另一個GET)。

例如,Gmail的是這樣的:

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

一切都會過去的#是一個頁面的狀態變化通過AJAX所發生。如果我按回來,我會再次進入收件箱(再次,沒有另一個瀏覽器GET)

+0

真棒提示...謝謝。 – dacracot 2008-10-02 18:22:09

2

有很多方法解決這個問題,使用時髦的Javascript技術,通常涉及iframe,但我認爲在這種情況下,你需要質疑爲什麼你使用AJAX。它實際上是否會讓用戶更容易使用該網站?這聽起來像你使用它,因爲你認爲它很酷(本身並不總是一件壞事),並不是因爲它實際上會爲訪問者增加任何價值。從任何普通的網站,正常的超鏈接文檔幾乎總是正確的主導航。它是人們所期望的,我不會推薦你去打破基於某些奇特技術的期望。

AJAX很棒,可以讓你做很多很棒的事情,改變一個網站導航不是其中之一。

雖然在這個問題上做得很好,但是有很多網站只是繼續使用AJAX,並沒有考慮到這個問題!

+0

該網站此刻已經在使用AJAX。它是一款瀏覽器遊戲,每隔15分鐘就會在服務器上更新每個人的統計信息,因此根據他們所在的頁面,我在新信息中使用AJAX,因此該頁面已經準確無誤。 – 2008-10-02 17:54:23

+0

因此,您已經在絕對有意義的地方使用它,我不認爲以這種方式擴展它也是有意義的。 – roryf 2008-10-02 18:14:31

1

對於您所描述的原因,AJAX不是導航的最佳解決方案。與打破瀏覽器導航UI的麻煩相比,重新加載標題和導航欄的命中率很低。

AJAX更合適的例子是允許用戶在主窗口中玩遊戲,同時他們可以瀏覽導航窗格中的其他內容列表。您可以通過AJAX在導航窗格中加載其他項目,而不會影響遊戲玩法。

0

我會堅持簡單的超鏈接。你的頁面傢俱不應該佔HTML的很大一部分,所以它不是一個很大的勝利,從頁面請求中排除它。使每個資源可尋址(即用戶可能感興趣的每一位內容的URL)是網絡的關鍵設計特徵。這意味着緩存可以工作,並且意味着用戶可以共享書籤。它使谷歌工作,以及社會書籤網站。

在我看來,削減後續頁面更改中的幾個HTML字節是不值得的。

5

結賬reallysimplehistory。維基百科尚未更新10個月,但我只是在2008年阿賈克斯體驗中看到布賴恩迪拉德的presentation。他說0.8代碼在他的硬盤上。希望它很快就會下載。

2

喲可能想看看; 「真正簡單的歷史」通過布拉德紐伯格...

2

試試這個簡單的&輕量級PathJS lib。它允許將監聽器直接綁定到錨點。

例子:

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