Crawlable содержание Ajax. SEO-ing без hashbang. У меня все в порядке?

Question

Я собираюсь построить мое приложение на основе AJAX, и мои адреса являются чем-то вроде:

http://server.com/module/#function_name,param1,param2...etc 

После ссылки некоторые дискуссии по поводу предложения Google: (#!) Hashbang, это не трудно для меня, чтобы понять, что это было не лучшее решение. Существует несколько причин:

• URL-адрес довольно уродливый, во всяком случае.
• Это ужасно, если когда-нибудь Google (или некоторые другие поисковые системы) предлагают лучшее решение, отличное от hashbang. Я должен сохранить свой уродливый URL-адрес с hashbang или написать js-код, чтобы сделать ссылку на мою страницу еще живой.
• HTML5 pushState будет популярен когда-нибудь.

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

<a href="http://server.com/module/for-crawler/function-name/param1/param2/..."> 
Some text </a> 

И некоторые JQuery код сделает его способным загрузить АЯКС содержимое, а PAGE- изменить как обычную ссылку:

$(function(){ 
    $('a').live('click',function(e){ 
     var realURL = translateURL($(this).attr('href')) 
     loadContent(realURL); 
     e.prevetnDefault(); 
     return false; 
    }) 
}) 
/* -- the function translateURL will turn url like : 
..... http://server.com/module/for-crawler/function-name/param1/param2/... 
Into: 
..... http://server.com/module/#function-name/param1/param2/... 
    That's the real url I think all ajaxers are used to dealing with 
*/ 

Когда гусеничном читает мою страницу, она будет следовать URL в атрибуте «HREF», и я представлю его со статической без JS версии моей страницы только для Google, чтобы читать. Через несколько дней моя страница индексируется & пользователя увидит мою страницу на результатах Google, как это:

http://server.com/module/for-crawler/function-name/param1/param2/... 

Я собираюсь пользователь снова JS для перенаправления пользователя на мою обычную версию АЯКСА, я имею в виду, к реальному URL:

http://server.com/module/#function-name/param1/param2/... 

Это лучший подход, о котором я могу думать в настоящее время. Пожалуйста, дайте мне советы: должен ли я так поступать, или я могу сделать это лучше? Спасибо всем парням!

Answer 1

В зависимости от вашей аудитории я бы предложил использовать HTML5 PushState в любом случае.

Если клиент не поддерживает HTML5, PushState позволяет ему просто использовать ту же версию вашего приложения, что и сканеры. На мой взгляд, перезагрузка страницы не так уж плоха, как хешированный URL. Поскольку пользователи используют URL-адреса, ваш хешированный URL-адрес подвергается воздействию других пользователей. Этот URL-адрес не будет работать, скажем, предварительные просмотры Facebooks Link или любой другой клиент, который не поддерживает JavaScript.

Вместо этого я бы использовал приложение, удобное для искателя, в сочетании с HTML5 PushState. С помощью PushState вы всегда будете показывать один URL-адрес, независимо от поддержки JavaScript вашего клиента.

Во-первых, обнаружить, поддерживается ли PushState:

function supports_history_api() { return !!(window.history && history.pushState); }

Тогда ваш click-handler будет выглядеть примерно так:

$('a').live('click',function(e){ 
    var url = $(this).attr('href'); 
    e.preventDefault(); 
    loadContent(url); 
    history.pushState({"url":url}, $(this).attr('title'), url); 
    return false; 
})