Должен ли я загрузить всю HTML-страницу с помощью AJAX? - PullRequest
11 голосов
/ 31 мая 2011

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

Решения, которые мне не понравились и почему;

  • Только загрузкаdiv для контента с помощью ajax: Google не будет видеть никакого контента, то есть сайт никогда не будет найден, или только те части, которые получены ajax, которые вообще не являются полными страницами
  • , показывают переходный эффектзатем, после этого, «перенаправьте» пользователя на назначенную страницу (запишите событие щелчка элемента): эффект почти такой же, как просто ссылка на другую страницу, например.пользователь по-прежнему будет видеть, что страница перезагружается

Я подумал об одном возможном решении: когда посетитель нажимает на ссылку, захватывает событие, загружает цель с помощью ajax, покажет эффект перехода, а затемпросто переписать весь документ с содержимым, полученным с помощью запроса ajax.

По крайней мере, это будет работать и иметь некоторые преимущества;перезагрузка страницы будет выглядеть безболезненно, независимо от того, насколько медленным будет ваше интернет-соединение, Google на самом деле не будет возражать, потому что контент ajax представляет собой полноценную HTML-страницу, и его можно сканировать как есть, даже не-JavaScript-браузеры (мобильные телефоны и др..) не возражаю, они просто перезагружают страницу.

Моя нерешительность в реализации этого метода заключается в том, что я бы перезагрузил всю страницу, используя ajax.Мне интересно, если это то, для чего предназначен ajax, если это замедлит процесс.Прежде всего, есть ли лучшее решение, например.мое первое «плохое» решение, но немного другое, так что Google понравилось бы (аналитика тоже)?

Спасибо за ваши мысли по этому поводу!

Ответы [ 4 ]

10 голосов
/ 01 июня 2011

Краткий ответ: я бы не рекомендовал загружать всю страницу таким образом.

Длинный ответ: не рекомендуется. хотя это и не является целью XHR / Ajax. По сути, вы копируете нативное поведение браузера. Некоторые из проблем, с которыми вы столкнетесь:

  1. Поддержка Назад / Вперед кнопка. Вам понадобится схема URI # решить.
  2. Браузер должен разобрать вся страница через AJAX. Это замедлит ход событий. Например. если вы загружаете блок HTML в браузер, затем замените DOM это, только тогда будут любые скрипты, CSS или содержащиеся в нем изображения начинаются загрузка.
  3. Память - браузер не меняет страницы. Над время (в зависимости от браузера), я бы ожидать увеличения использования памяти.
  4. Доступность. Программы чтения с экрана нужно будет получать уведомления всякий раз, когда содержание страницы обновлено. Может быть не беспокоиться о вас, но стоит упоминая.
  5. Кэширование. браузер не знал бы, какую страницу кэшировать (за пределами начальной нагрузки).
  6. Разделение интересов - ваш взгляд по существу разбит на серверные части для рендеринга содержимое страницы вместе со статическим HTML для рамки страницы и наконец, JS объединил сервер кусок с браузером кусок. Это сделает обслуживание со временем проблематично и сложно.
  7. Интеграция с другими компонентами - вы уже видите проблемы с Гугл Аналитика. Вы можете столкнуться проблемы с другими компонентами, связанными к времени, когда DOM построен.

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

3 голосов
/ 31 мая 2011
  1. вы можете иметь AJAX и SEO: предложение Google .

  2. я думаю, вы можете кое-что узнать изДизайн Gmail.

2 голосов
/ 31 мая 2011

Google Analytics может отслеживать события JavaScript, как если бы они были просмотрами страниц - проверьте здесь для реализации:

http://www.google.com/support/googleanalytics/bin/answer.py?hl=en-GB&answer=55521

2 голосов
/ 31 мая 2011

Это может быть немного странно, но у меня есть идея для этого.

Подготовьте свои страницы для загрузки с параметром GET 'ifarme'.

  • Когда есть 'iframe 'загрузите его с помощью некоторого javascript для запуска родительского show_iframe_content ()
  • Когда нет' iframe ', просто загрузите страницу со скрытым элементом iframe под названием' preloader '

Ваша цель - убедиться, что каждая из ваших ссылок открыта в «preloader» с дополнительным параметром get «iframe», и когда загрузка iframe заканчивается, и она вызывает show_iframe_content (), вы копируете контент на родительскую страницу..

Например: ссылка нажата -> переход к фазе загрузки -> загружен iframe -> вызван show_iframe_content () -> содержимое iframe скопировано обратно в родительский -> переход к нормальной фазе

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

Это всего лишь набросок, но я уверен, что это можно сделать правильно.

РЕДАКТИРОВАТЬ: На самом деле вы можете сделать это с помощью простого AJAX, без iframe, дело в том, что вы должны изменить страницу после того, как она была загружена в браузере, чтобы загрузить связанный контент с помощью AJAX.Также сканеры должны видеть ссылки.

Пример скрипта:

$.fn.initLinks = function() {
    $("a",this).click(function() {
        var url = $(this).attr("href");
        // transition to loading phase ...
        // Ajax post parameter tells the site lo load only the content without header/footer
        $.post(href,"ajax=1",function(data) {
            $("#content").html(data).initLinks();
            // transition to normal phase ...
        });
        return false;
    });
};

$(function() {
   $("body").initLinks();
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...