2011-10-07 29 views
15

我已閱讀了大量關於javascript模板和搜索引擎優化的討論。儘管如此,我還沒有找到令人滿意的答案(無論是記錄不完整還是過時)。Handlebars.js和SEO

目前我正在研究handlebars.js作爲客戶端模板解決方案,因爲我喜歡創建幫助函數的可能性。但是,搜索引擎的索引呢?機器人會根據預期的內容對生成的內容進行索引,或者僅使用醜陋的JavaScript僞變量對其進行索引?我知道有很多關於這個問題的線索,但我覺得沒有人確切知道答案。

如果像Google這樣的引擎不能正確地爲這些模板建立索引,爲什麼人們會在公共網站上使用它呢?

在這種情況下的另一個問題:是否有可能在服務器端渲染Handlebar.js模板,然後將它們呈現在客戶端?顯然要避免所有這些搜索引擎優化的討論。

回答

22

對於DOM搗弄客戶端,大多數網絡機器人(即谷歌和其他人)不解釋在飛行中js和解析索引新呈現的內容。相反,谷歌(現在冰)支持「谷歌AJAX檢索機制」(https://developers.google.com/webmasters/ajax-crawling/docs/getting-started) - 這基本上是說,如果你想呈現的DOM內容JS來進行索引(即呈現Ajax調用的結果),你必須能夠:

  1. 觸發異步JS通過使用hashbangs #!的URL渲染(即http://www.mysite.com/#!my-state)和
  2. 能夠滿足您的網站的預渲染的DOM快照要求JS修改後。

如果使用客戶端MVC框架(如Backbone.js或Spine) - 如果您希望您的Web應用程序編入索引,則需要提供此服務。

一般來說,這意味着你攔截由網絡機器人進行的請求(上面的鏈接解釋),並且使用無頭瀏覽器(即QT + capybara-webkitHtmlUnit等)刮你身邊服務器端,然後提供所生成的回到正在請求的機器人。

我已經開始了一個寶石在https://github.com/benkitzelman/google-ajax-crawler

做到這一點的紅寶石(現在正在引入請求)它這樣做是因爲機架中間件使用水豚,WebKit的(很快phantomjs

+0

UPDATE:創業板已經公佈了RubyGems的,可以由任何機架應用程序可以作爲中間件'創業板安裝google_ajax_crawler'說明和示例使用的是在上述 – Ben

+0

GitHub的鏈接,這樣,如果你使用Backbone.js的你將不得不確保你使用的是路由器? – unclejam

+0

你如何構建你的JS應用程序基本上是不重要的。你可以使用主幹路由器,或者,你可以不使用任何框架來操縱DOM - 當你在網頁中模擬瀏覽器已經達到了一個再現狀態,所以你是在正確的時間拍攝快照棘手位被確定。大多數快照框架爲您的頁面添加了某種形式的信號傳遞,這個想法就是您在頁面完成加載/渲染時調用它。 – Ben

1

我不知道Handlebar.js,但對我的理解SEO有一些與內容在JAVASCRIPT的問題。確保您的內容對搜索引擎可見(使用Spyder模擬器進行一些測試)。避免spyder陷阱一般是要走的路。希望它可以幫助你。

-2

機器人是根據醜陋的JavaScript僞變量來索引生成的內容(如預期的)還是隻有源代碼?

既不是,因爲索引器機器人不運行JavaScript,也不提供模板作爲HTML文檔。

建立一個沒有JavaScript的網站,然後build on top of it

+0

我同意,用JS是修改DOM像jQuery在瀏覽器更好的工作。所以你可以從JS和語義html內容中獲得最大的效果。 – GibboK

+2

「有越來越多的證據Googlebot就可以執行JavaScript和解析阿賈克斯生成的內容要求,以及」 http://en.wikipedia.org/wiki/Googlebot –

+0

直到HTML5從文檔應用程序感動了我們這是真實的。 – Lodewijk

1

搜索引擎不運行JavaScript,所以如果你希望你的內容編入索引,你需要渲染你的服務器上的模板也。當頁面請求來自蜘蛛時,您可以使用Node中的句柄(服務器端JS)在那裏呈現您的模板。這是更多的工作,但它是可能的。 Github,Google plus和twitter都做類似的事情。

-1

你可以使用Distal templates這使模板爲HTML的搜索引擎優化的一部分。