Примечание: ниже перевод статьи «Ajax Best Practices: Don't Break Bookmarks», посвященной решениям, позволяющим пользователям корректно добавлять в закладки страницы сайта, сделанного при помощи AJAX-методов. Я постарался дополнить ее по мере сил, опираясь на обсуждение предыдущей статьи из серии.
Статья является второй из серии (здесь первая), посвященной устранению критики, которую сейчас так много адресуют использованию AJAX, и обзорам методов, которые помогут сделать ваш сайт чуточку лучше.
В предыдущей статье, «Что делать с кнопкой «назад» в браузерах» вводились такие понятия, как «горизонтальные» и «вертикальные» ссылки. Если вы не читали ее, пожалуйста, ознакомьтесь перед дальнейшим изучением этой.
Итак, вертикальные ссылки не только делают несостоятельной кнопку «назад» в браузерах, но и возможность браузера сохранить ссылку на данную страницу в закладках. Это очень похоже на проблему невозможности сохранения HTTP POST запросов тем же способом, что и HTTP GET просто потому, что они не отправляют данные в адресной строке (прим.: имеется в виду, конечно же, «полное» сохранение результатов POST запроса, потому что сейчас большинство таких запросов являются комбинированными, когда на какую-то определенную (GET) строку отправляются POST данные. В таком случае мы можем сохранить только результирующий URL, но никак не те данные, что мы отправили POST'ом на него.)
Данная проблема затрагивает не только пользователей, которые захотят прийти еще раз к вам на сайт, она также касается больших сложности либо полной невозможности проиндексировать внутренние страницы сайта поисковыми машинами так, чтобы в в результатах поисковых запросов можно было выдавать корректную ссылку на ресурс (прим.: данная проблема очень схожа с проблемой frame'ов, поднимаемой несколько лет назад: поисковые машины замечательно индексировали сайт, но в качестве ссылки выдавали главную страницу, и не всегда было понятно, как же на этом сайте получить ту информацию, за которой пришел. Я считаю, что данная проблема сейчас не актуальна, ибо сами ссылки по сайту прописываются статичными, если при переходе по ним пользователь получается какую- то новую информацию, либо вообще не приписываются, если на них предполагается «повесить» динамические обработчики).
В предыдущей статье делался обзор методов, которые позволяют сохранять историю в браузере, часть из них позволяет работать и с закладками.
Прим.: суть решения: при каждом вызове AJAX к URL'у страницы в качестве якоря добавляется флаг, являющийся ключом текущей страницы. При добавлении ее в избранное, страница добавляется вместе с якорем. Затем, при открытии страницы приложение проверяет якорь-флаг и перегружает требуемое содержание.
Использование скрытых iframe'ов в данном случае, как я считаю, совсем не оправдано, ведь в закладки попадает та же основная страница, а не та, которая грузится в iframe. Да и как было справедливо замечено berszbersz, у некоторых iframe'ы могут автоматически «резаться» как рекламосодержащие.
Чуть дальше поясняется, почему первое решение не всегда подходит.
Хотя не существует идеального решения, которое бы обеспечивало пользователя ссылкой на текущую страницу со всеми GET параметрами, можно частично преодолеть эту проблему за счет ухудшения поддержки самой возможности добавлять страницу в закладки. Например, этот подход используется в Google Maps. Если пользователь ищет какой-либо адрес, то URL страницы остается тем же самым (http://maps.google.com), однако при нажатии на ссылку «Link to this page», запрошенный URL преобразуется, чтоб отображать текущее местоположение уже с учетом GET параметров (например, http://maps.google.com/maps?f=q&hl=en&geocode=&q=Moscow&ie=UTF8&z=17&om=1).
Этот подход позволяет, на самом деле, создать горизонтальную интерпретацию вертикальной ссылки, которая бы вела на текущую страницу. При использовании этого решения следует иметь в виду некоторые аспекты:
В ближайшее время хочу выложить небольшую инструкцию по устранению описанных в этих статьях проблем, а также некоторых других аспектов. Если у вас есть ссылки на примеры в сети, пожалуйста, поделитесь ими. Я постараюсь сделать обзор всех этих подходов. Большое спасибо всем, кто принимает активное участие в обсуждении моих материалов. Я ценю ваше мнение и ваш взгляд на заявленную проблему.
Web Optimizator: проверка скорости загрузки сайтов
Статья является второй из серии (здесь первая), посвященной устранению критики, которую сейчас так много адресуют использованию AJAX, и обзорам методов, которые помогут сделать ваш сайт чуточку лучше.
Суть проблемы
В предыдущей статье, «Что делать с кнопкой «назад» в браузерах» вводились такие понятия, как «горизонтальные» и «вертикальные» ссылки. Если вы не читали ее, пожалуйста, ознакомьтесь перед дальнейшим изучением этой.
Итак, вертикальные ссылки не только делают несостоятельной кнопку «назад» в браузерах, но и возможность браузера сохранить ссылку на данную страницу в закладках. Это очень похоже на проблему невозможности сохранения HTTP POST запросов тем же способом, что и HTTP GET просто потому, что они не отправляют данные в адресной строке (прим.: имеется в виду, конечно же, «полное» сохранение результатов POST запроса, потому что сейчас большинство таких запросов являются комбинированными, когда на какую-то определенную (GET) строку отправляются POST данные. В таком случае мы можем сохранить только результирующий URL, но никак не те данные, что мы отправили POST'ом на него.)
Данная проблема затрагивает не только пользователей, которые захотят прийти еще раз к вам на сайт, она также касается больших сложности либо полной невозможности проиндексировать внутренние страницы сайта поисковыми машинами так, чтобы в в результатах поисковых запросов можно было выдавать корректную ссылку на ресурс (прим.: данная проблема очень схожа с проблемой frame'ов, поднимаемой несколько лет назад: поисковые машины замечательно индексировали сайт, но в качестве ссылки выдавали главную страницу, и не всегда было понятно, как же на этом сайте получить ту информацию, за которой пришел. Я считаю, что данная проблема сейчас не актуальна, ибо сами ссылки по сайту прописываются статичными, если при переходе по ним пользователь получается какую- то новую информацию, либо вообще не приписываются, если на них предполагается «повесить» динамические обработчики).
Решение первое: используйте специальную AJAX-библиотеку
В предыдущей статье делался обзор методов, которые позволяют сохранять историю в браузере, часть из них позволяет работать и с закладками.
Прим.: суть решения: при каждом вызове AJAX к URL'у страницы в качестве якоря добавляется флаг, являющийся ключом текущей страницы. При добавлении ее в избранное, страница добавляется вместе с якорем. Затем, при открытии страницы приложение проверяет якорь-флаг и перегружает требуемое содержание.
- Подход Mike Stenhouse'а. Демо-версия предельна проста и работает почти во всех браузерах. Демо-версия этого решения можно посмотреть по этой ссылке и проследить, что происходит с URL'ом страницы, когда вы кликаете по ссылкам, затем сохранить ссылку как закладку. При открытии закладки происходит перегрузка содержание.
- Подход Brad Neuberg'а. Демо-версия. Эта библиотека пытается быть максимально кроссбраузерной без лишнего усложнения кода.
- Подход mikage'а с использованием библиотеки jQuery можно посмотреть здесь.
Использование скрытых iframe'ов в данном случае, как я считаю, совсем не оправдано, ведь в закладки попадает та же основная страница, а не та, которая грузится в iframe. Да и как было справедливо замечено berszbersz, у некоторых iframe'ы могут автоматически «резаться» как рекламосодержащие.
Чуть дальше поясняется, почему первое решение не всегда подходит.
Решение второе: используйте специальные ссылки
Хотя не существует идеального решения, которое бы обеспечивало пользователя ссылкой на текущую страницу со всеми GET параметрами, можно частично преодолеть эту проблему за счет ухудшения поддержки самой возможности добавлять страницу в закладки. Например, этот подход используется в Google Maps. Если пользователь ищет какой-либо адрес, то URL страницы остается тем же самым (http://maps.google.com), однако при нажатии на ссылку «Link to this page», запрошенный URL преобразуется, чтоб отображать текущее местоположение уже с учетом GET параметров (например, http://maps.google.com/maps?f=q&hl=en&geocode=&q=Moscow&ie=UTF8&z=17&om=1).
Этот подход позволяет, на самом деле, создать горизонтальную интерпретацию вертикальной ссылки, которая бы вела на текущую страницу. При использовании этого решения следует иметь в виду некоторые аспекты:
- предварительное добавление в закладки — этот подход не будет работать, если пользователь добавил данную страницу в закладки перед тем, как кликнул по специальной ссылке (прим.: имеется в виду, наверное, то, что при изменении якоря у страницы браузер не может ее сохранить как новую в закладках, это справедливо для IE, у него не учитывается различие закладок по якорям, однако, в Firefox 2 и Opera 9 каждая страница с другим якорем сохраняется как новая закладка);
- кодирование URL — если данные, описывающие текущее состояние, содержат специальные символы (например, символы табуляции, проценты, амперсанды), они должны быть закодированы (URL encoded), когда создается ссылка для закладки;
- приватные данные — если данные для текущего состояния содержат какую-либо приватную информацию (например, пароль пользователя), не следует их включать в качестве GET параметров строки запроса. (Однако, если данные для текущей страницы содержат приватную информацию, то, в первую очередь, не стоит вообще делать возможным сохранение такой страницы в закладках.)
В ближайшее время хочу выложить небольшую инструкцию по устранению описанных в этих статьях проблем, а также некоторых других аспектов. Если у вас есть ссылки на примеры в сети, пожалуйста, поделитесь ими. Я постараюсь сделать обзор всех этих подходов. Большое спасибо всем, кто принимает активное участие в обсуждении моих материалов. Я ценю ваше мнение и ваш взгляд на заявленную проблему.
Web Optimizator: проверка скорости загрузки сайтов
