3

data-id ="{somenumber}"属性を持つ75のdivがあると仮定します。残念ながら、全体のページサイズは非常に大きくなっています。

私のHTMLドキュメントには、画像タグやリンクなどの反復的なHTMLスニペットがたくさんあります。これらの画像/リンクの唯一の変更部分はIDです。

HTMLドキュメントは非常に長く、これらのスニペットはドキュメントの全体的なサイズに影響します。

domの準備ができたらjavascriptを実行できますが、ユーザーエクスペリエンスは次のようになります。-ページが読み込まれるのを待ち、ノードなどが表示されるようになります。--ページが読み込まれます。--追加のスニペットが表示されます。

ページが読み込まれるまでトップコンテナのDIVを非表示にすることはできますが、Google検索ボットがdivが非表示になっていることを認識し、コンテンツをスキップする可能性があるのではないかと心配しています(またはそうしますか?)。ページを読み込んでいます。

理想的なのは、グーグル検索ボットのマークアップをあまり追加せずにページをHTMLでロードし、JavaScriptでロードしている間に要素を追加することです。

これを達成するために私が試すことができるトリックはあなたの頭に浮かびますか?

ありがとうございました。

4

2 に答える 2

2

最高のパフォーマンスとユーザー エクスペリエンスは、サーバー上でできるだけ多くの作業を行い、効率的な HTML を送信して、ブラウザーが受信したページをそのまま表示できるようにすることです。たとえば、単一の DIV コンテナーを送信してから、スクリプトを使用して 70 回または 80 回クローンを作成すると、処理が遅くなります (一部のユーザーにとってはかなり遅くなる可能性があります)。

スクリプトが終了するまでコンテンツを完全に非表示にすることは、最悪の解決策です。ユーザーは空白の (または最小限のコンテンツの) ページを残され、何かが起こるのを待っています。

ほとんどのページの大部分はスクリプトと画像であり、HTML をスクリプトに置き換えることは、実際には余白で行われています。たとえば、このページには 90KB の HTML と 264KB のスクリプト、画像、CSS があります。Apple のホームページには、12KB の HTML と、約 800KB のスクリプト、CSS、および画像があります。

ブラウザーは、コンテンツを受信すると徐々に表示します。これは、ブラウザーが Web 上で何年にもわたって進化してきた方法だからです。ユーザーは、何も表示されないよりも何かが表示されることを好み、残りのコンテンツが読み込まれている間にコンテンツの表示を開始します (派手なレイアウトや効果ではなく、コンテンツがすべてです)。ブラウザーの動作や機能に反対するのではなく、それらと連携するようにしてください。

画像のサイズを指定し、効率的なレイアウトを設定することで、ブラウザーを大きく支援できます。そうすれば、新しいコンテンツを受け取ってもレイアウトはあまり変わりません。

于 2012-08-28T23:28:55.470 に答える
0

他のページ コンテンツによっては、onload ではなく DocumentReady でスクリプトを実行できます。

DocumentReady は、ページがダウンロードされて DOM がレンダリングされた後、画像が取得される前に実行されます。

公式の DocumentReady イベントがどこかにあると思いますが、それでもページでIE6をサポートする必要があるため、ビジー ループを使用して DOM を監視します。

于 2012-08-28T23:07:04.580 に答える