AJAX и кнопка возврата браузера - PullRequest
32 голосов
/ 02 октября 2008

Я запускаю браузерную игру на www.darknovagames.com. Недавно я работал над переформатированием сайта с помощью CSS, пытаясь заставить все его страницы проверяться в соответствии со стандартом HTML.

Я играю с этой идеей иметь меню навигации слева на AJAX страницах (вместо того, чтобы каждый раз выводить пользователя на отдельную страницу, требуя перезагрузки заголовка и навигационной панели, которые почти никогда не меняются) ) и я знаю, что если я это сделаю, я, вероятно, сломаю кнопки «Вперед» / «Назад» в браузере. Мой вопрос, который я предполагаю, состоит в том, должен ли я идти вперед и AJAX сайт, таким образом требуя, чтобы пользователь использовал навигацию сайтов, чтобы играть в игру, или я должен покинуть сайт в его нынешнем виде и использовать стандартные гиперссылки и другие вещи для навигации?

Причина, по которой я спрашиваю, я полагаю, состоит в том, что я встроил систему форумов в сайт, и много раз я хотел бы связать свою тему с темой форума.

Я также открыт для предложений. Существует ли стандартный (желательно без традиционных фреймов) способ перезагрузить только область тела сайта, при этом изменяя URL-адрес, чтобы пользователи могли делать закладки, пересылать / назад и т. Д.? Это также может решить мою проблему. Я просто прошу здесь лучшее решение, а не ответ на конкретный вопрос. ^ _ ^

Спасибо

Ответы [ 8 ]

34 голосов
/ 02 октября 2008

Используйте ajax для частей страницы, которые нужно обновить, а не для всего. Для этого вам следует использовать шаблоны.

Если вы хотите сохранить кнопку «Назад» для различных изменений состояния на странице, объедините их с # achors, чтобы изменить URL-адрес (не заставляя браузер вводить еще один GET).

Например, gmail выглядит так:

mail.google.com / # Входящие / сообщение-1234

все, что за # было изменением состояния страницы, которое произошло через ajax. Если я нажму «Назад», я снова попаду в папку «Входящие» (опять же, без другого браузера GET)

26 голосов
/ 02 октября 2008

Если вы собираетесь включить AJAX, не делайте этого за счет наличия доступных URL-адресов для каждой важной страницы вашего сайта. Это основа навигационного сайта, который могут использовать люди.

Когда вы объединяете все свои функции в вызовы и обратные вызовы AJAX, вы в основном вынуждаете своих пользователей к единому пути доступа к нужным функциям и контенту, что полностью противоречит принципам работы Интернета. Люди полагаются на адресную строку и кнопку возврата. Если вы переопределяете все свои ссылки, так что ваш сайт представляет собой единственную страницу, которая обновляется только через AJAX, вы ограничиваете возможность пользователей перемещаться по сайту и находить то, что им нужно. Это также не дает вашим пользователям возможности делиться тем, что они находят (что является частью сути, верно?).

Подумайте о ментальной карте пользователя вашего сайта. Если они знают, что заходили через домашнюю страницу, то они что-то искали, затем они попадали на страницу с играми, затем они начинали играть в определенную игру, то есть четыре отдельных действия пользователя. Они могли бы сделать несколько других более мелких, более незначительных действий на каждой из этих страниц - но это основные единицы. Когда они нажимают кнопку «Назад», им следует ожидать возврата по пути, по которому они пришли. Если вы загружаете все эти страницы с помощью вызовов AJAX, вы предоставляете сайт, функциональность которого не соответствует ожиданиям пользователя.

Разбейте свой сайт на все важные функции (например, поиск, домашняя страница, профили, игры - это будет зависеть от того, чем занимается ваш сайт). Везде, где вы ссылаетесь на эти страницы, делайте это с помощью обычной ссылки и статического URL.

AJAX в порядке. Но искусство этого - знать, когда его использовать, а когда нет. Если вы придерживаетесь модели, которую я набросал выше, ваши пользователи это оценят.

5 голосов
/ 13 января 2012

Другое решение:

Кнопка AJAX Pagination & Back

Это, похоже, лучший вариант, работает с JQuery & Mootools.

5 голосов
/ 02 октября 2008

Проверьте действительно простая история . Вики не обновлялась в течение 10 месяцев, но я был на Ajax Experience 2008 и увидел на ней презентацию Брайана Дилларда. Он говорит, что код 0.8 находится на его жестком диске. Надеюсь, скоро он будет загружен.

2 голосов
/ 19 апреля 2012

Попробуйте этот простой и легкий PathJS lib. Это позволяет привязывать слушателей непосредственно к якорям.

Пример:

Path.map("#/page").to(function(){
    alert('page!');
});
2 голосов
/ 02 октября 2008

Существует множество способов решить эту проблему, используя прикольные приемы Javascript, часто с использованием iframes, но я думаю, что в этой ситуации вам нужно задаться вопросом, почему вы используете AJAX. Собственно ли это сделает сайт более удобным для пользователя? Мне кажется, что вы используете его, потому что вы думаете, что это круто (что само по себе не всегда плохо), а не потому, что это на самом деле добавит ценность вашим посетителям. С любого обычного веб-сайта нормальные документы с гиперссылками почти всегда подходят для основной навигации. Это то, чего ожидают люди, и я бы не советовал вам нарушать эти ожидания из-за какой-то необычной технологии.

AJAX великолепен и позволяет вам совершать много замечательных вещей, не меняя навигацию по сайтам.

Тем не менее, вы отлично справились с этой проблемой, есть много сайтов, которые просто используют AJAX и даже не думают об этом!

1 голос
/ 02 октября 2008

AJAX - не лучшее решение для навигации именно по той причине, которую вы описываете. Попытка перезагрузить заголовок и панель навигации минимальна по сравнению с хлопотами по взлому пользовательского интерфейса браузера.

Более подходящим примером AJAX было бы предоставление пользователям возможности играть в игру в главном окне, в то время как они могут просматривать список другого контента в навигационной панели. Вы можете загружать дополнительные элементы в навигационной панели через AJAX, не нарушая игровой процесс.

0 голосов
/ 02 октября 2008

Я бы придерживался простых гиперссылок. Мебель для вашей страницы не должна составлять большую часть HTML-кода, поэтому ее нельзя исключить из запросов страниц. Обеспечение адресации каждого ресурса (то есть URL-адреса для каждого бита контента, который может заинтересовать пользователя) является ключевой особенностью веб-дизайна. Это означает, что кэширование может работать, и означает, что пользователи могут делиться закладками. Это заставляет работать Google, а также сайты социальных закладок.

По моему мнению, экономия нескольких байтов HTML при последующих изменениях страницы не стоит усилий.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...