GoogleのAJAX crawl対応はhashbangを増やさず通常URLとHTMLを用意する

公開日：2015年12月16日執筆：佐藤

AJAXで表示を切り替えるサイトを検索へ出したいなら、_escaped_fragment_を増やさず、読者が直接開くURLと主要な内容を先に整えます。GoogleはAJAX crawling schemeを推奨しなくなりました。ただし、既に動いている仕組みを今日すぐ止める必要はありません。次の更新や作り直しのときに、検索専用の逃げ道を足すのではなく、読者にも検索エンジンにも同じ入口を渡せる形へ直します。

AJAXは、一覧の絞り込みや並び替えを画面遷移なしで行うための手段です。検索で見つけてほしい内容をどのURLで開かせるかは、別に決めます。この二つを混ぜると、見た目は動いていても、読者が後で同じ表示へ戻れない、リンクとして渡せない、検索用だけに別のHTMLを用意する、といった構造になりやすくなります。

GoogleはAJAX crawling schemeを推奨しなくなった

Googleの2015年10月の案内は、2009年に示したAJAX crawling proposalを以後は推奨しないと説明しています。GooglebotがJavaScriptとCSSを取得できれば、現在はウェブページをレンダリングして理解できる場合があるためです。技術ガイドラインでも、JavaScriptとCSSをGooglebotから禁止しないよう案内しています。

この案内は、JavaScriptを使えば必ず検索結果へ出るという保証ではありません。Googleが勧めるのはprogressive enhancementです。先に内容とリンクを使える形にし、その上へJavaScriptの便利な操作を加えます。表示のためにJavaScriptを使うことと、内容の入口までJavaScriptだけに任せることは同じではありません。

たとえば、商品一覧で色や価格帯を絞り込む画面を考えます。絞り込み操作はAJAXで行ってかまいません。一方、検索から来てほしい商品詳細は、固有のURLを直接開いたときに、商品名、説明、購入または問い合わせ先が分かるページにします。分類一覧も、読者が共有する必要がある状態なら、どの条件を見ているかが分かるURLを持たせます。画面だけが切り替わり、URLが何も示さない状態を検索用の入口にしません。

役割	先に決めるもの	AJAXで補うもの
商品や記事の詳細	直接開けるURL、見出し、主要な本文	画像の切り替え、関連情報の追加表示
分類や検索の一覧	読者が再訪できる条件とリンク	絞り込み、並び替え、件数の即時更新
申込みや問い合わせ	入力先、送信先、送信後の案内	入力途中の補助、候補の表示

URLを設計するのは検索対策だけの作業ではありません。読者がブックマークし、メールで渡し、社内で確認するための入口を残す作業です。検索用の別URLと読者用のURLを二重に持つより、一つの入口へ情報を集めた方が、更新する人も何を直すかを追えます。

`#!`と`_escaped_fragment_`は役割を分けて扱う

AJAX crawling schemeでは、#!を含むURLと、検索エンジン向けの_escaped_fragment_を組み合わせる方法が使われてきました。Googleの案内では、既存の_escaped_fragment_対応があるサイトが直ちにインデックスされなくなるわけではないと説明しています。現在の構成が動いているなら、慌ててURLを置き換えるより、次の改修へ入るときに新しい_escaped_fragment_を作らないことが先です。

また、_escaped_fragment_をやめることだけを目的にして、読者の画面とGooglebotへ別の内容を返してはいけません。Googleは、サーバーで事前に生成したページを使う場合でも、Googlebotへ出す内容と、普通の読者が見る内容の見た目と操作が一致するよう求めています。検索エンジンだけへ違う内容を見せる方法は、cloakingとしてガイドラインに反します。

移行を考えるときは、URLを三つに分けて棚卸しします。第一に、検索から直接開いてほしい詳細ページ。第二に、読者が条件を変えて比較する一覧ページ。第三に、古い#!や_escaped_fragment_のURLです。第三のURLを消すか残すかは、第一と第二が読者に使える状態になってから決めます。リンク元、サイトマップ、内部リンクを確認せずに古いURLだけを止めると、入口を失うことがあります。

まず一画面で確かめる

全ページを一度に作り替える前に、検索から来てほしい代表ページを一件選びます。商品詳細、事例、記事など、内容を読ませたいページが向いています。そのページで次の順に確かめます。

URLを新しいブラウザのタブへ貼り、画面操作をしなくても何のページか分かる見出しと本文が出るかを見る。
そのページで使うJavaScriptとCSSのURLを調べ、robots.txtで取得を止めていないかを確認する。
一覧からAJAXの絞り込みや並び替えを行い、読者がその状態を開き直す必要があるかを決める。必要なら、状態を表すURLまたは通常のリンクを用意する。
#!または_escaped_fragment_が残る場合は、そのURLがどこから使われているかを記録する。内部リンク、外部広告、メール、サイトマップを同じ扱いにしない。
JavaScriptを使わない画面、JavaScriptを使う画面、検索用に返すHTMLの内容を比べ、読者によって説明や操作が変わっていないかを見る。

ここで重要なのは、Googlebotがどこまでレンダリングできるかを推測で決めないことです。まず読者の入口としてURLと内容を整え、JavaScriptとCSSを取得できるようにし、実際の公開画面を確認します。検索順位を約束する手順ではありませんが、検索用だけに複雑なURLと別ページを増やすより、更新と検証を続けやすくなります。

最初の一手は、検索から来てほしいページを一件選び、そのURLを直接開くことです。内容が読め、必要な操作へ進めるなら、AJAXはその入口を便利にするために使えます。