JSON-LDをJavaScriptを介してページに動的に挿入します。Googleの構造化データテストツールを使用してページをテストすると、予期した出力が表示され、製品要素がレンダリングされていることがわかります。
ただし、JSON-LDコンテンツのフェッチを担当するスクリプトのロードを延期してから、関数を呼び出してウィンドウの「ロード」イベントリスナーに挿入すると、構造化データテストツールにコンテンツが表示されなくなります。
簡単に言うと、これを実行すると、テストツールにマークアップが表示されます...
<script src="https://example.site.com/rich-snippet/dist.js"></script>
<script>
richSnippet();
</script>
しかし、私がこれをするときではありません。
<script src="https://example.site.com/rich-snippet/dist.js" defer=""></script>
<script>
window.addEventListener('load', (event) => {
richSnippet();
});
</script>
これはテストツールの欠点なのか、それとも遅延/オンロードアプローチがGoogleがコンテンツをインデックスに登録できるという点で一歩遠すぎるのかと私は尋ねていると思います。
<script src="https://example.site.com/rich-snippet/dist.js" defer=""></script>
<script>
window.addEventListener('load', function() {
richSnippet();
});
</script>
ES6構文を削除すると問題が解決するようですが、渡されるイベントのコンテキストが原因です。
このマークアップをJavaScriptで追加する理由は何ですか? > HTMLコードに含めるのが最も簡単な方法であり、検索エンジンに採用される可能性が最も高いようです。
JavaScriptやその他の言語を使用しないのはなぜですか?ハードコードされたHTMLを持つことは、頭に浮かぶすべてのケースで直感に反します。
構造化データテストツールは、JavaScriptを処理する機能が非常に制限されています。
ただし、Googlebotとその他のテストツール(URL検査、リッチリザルトテストツール、モバイルフレンドリーテスター)はすべて、最新バージョンのChromeを使用してページをレンダリングするため、JavaScriptを非常にうまく処理します。
リッチリザルトテストツールが、使用する構造化データについて直接報告しない場合は、レンダリングされたHTMLをSDTTにコピーします。