検索エンジンと同様の方法でページのソースコードを表示する

読了時間:3分
Wix サイトはサーバーサイドレンダリング(SSR)を使用して、ページの HTML コードを訪問者のブラウザに表示されるバージョンに変換します。
SSR は、検索エンジンがページのすべてのコンテンツをクロールし、インデックスに登録する際にも役立つ機能です。これには、ページのソースコードに存在するメタタグなど、SEO に役立つコンテンツが含まれます(これらのタグはレンダリングされたページでは表示されません)。
ブラウザの設定でユーザーエージェントを変更することで、検索エンジンと同様の方法でページのソースコードを表示することができます。ユーザーエージェントは、使用しているブラウザを特定するために役立ちます。Googlebot などの Web クローラーボットをユーザーエージェントに選択すると、ボットがクロールした内容を正確に閲覧することができます。
この記事では、下記の項目について説明します:

Google Chrome でページのソースコードを表示する

Google Chrome のデベロッパーツールを使用すると、検索エンジンと同じようにページのソースコードを表示できます。

Google Chrome でソースコードを表示する方法:

  1. Google Chrome でサイトの該当するページを開きます。
  2. ページのソースコードビューを開きます:
    • Windows:ページを右クリックし、「ページのソースを表示」(または「ソースを表示」)を選択します。または、キーボードの Ctrl + U キーを押します。
    • Mac:キーボードの「Cmd + Option + U」キーを押します。
  3. デベロッパーツールを開きます:
    • Windows:キーボードの「F12」キーを押します。
    • Mac:キーボードの「Cmd + Option + I」キーを押します。
  4. 右上の「Dev Tools のカスタマイズと管理」アイコン  をクリックします。
  5. その他のツール」にマウスオーバーし、「Network conditions(ネットワーク状況)」を選択します。
Google Chrome のデベロッパーツールで「その他のツール」を選択しています
  1. ユーザーエージェント」下の「ブラウザのデフォルトを使用」の選択を解除します。
  2. ドロップダウンメニューから「Googlebot」を選択します。
Google Chrome でユーザーエージェントとして Googlebot を選択しています
  1. ページを更新します。

Safari でページのソースコードを表示する

Safari の「開発」タブを使用すると、検索エンジンと同じようにページのコードを表示できます。

Safari でソースコードを表示する方法:

  1. トップメニューの「Safari」をクリックします。
  2. 設定」を選択します。
  3. 詳細」を選択します。
  4. Web デベロッパ用の機能を表示」チェックボックスを選択します。
「Web デベロッパ用の機能を表示」チェックボックスが選択された Safari の設定パネルのスクリーンショット。
チェックボックスを選択すると、トップメニューに「開発」が表示されます。
Safari ブラウザでトップメニューに「開発」が表示されたスクリーンショット
  1. Safari でサイトの該当ページを開きます。
  2. トップメニューの「開発」をクリックします。
  3. ユーザーエージェント」にマウスオーバーします。
  4. 下部にある「その他」を選択します。
  5. フィールド内のテキストを次のテキストに置き換えます:Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; Googlebot/2.1; +http://www.google.com/bot.html) Safari/537.36
  6. OK」をクリックして確定します。

お役に立ちましたか?

|