ホームページ  >  記事  >  システムチュートリアル  >  フロントエンド SEO — 詳細な説明

フロントエンド SEO — 詳細な説明

WBOY
WBOY転載
2024-03-12 18:13:02714ブラウズ

フロントエンド SEO — 詳細な説明

1. 検索エンジンの動作原理

入力ボックスにキーワードを入力し、検索またはクエリをクリックすると、結果が得られます。その背後にあるストーリーを掘り下げてみると、検索エンジンは多くのことを行っています。

Baidu などの検索エンジン Web サイトでは、バックグラウンドで非常に大規模なデータベースがあり、多数のキーワードが保存されており、各キーワードは多くの URL に対応しています。これらの URL は、Baidu プログラムによって広大なインターネットから取得されます。 . 少しずつダウンロードされて収集されるこれらのプログラムは、「検索エンジン スパイダー」または「Web クローラー」と呼ばれます。これらの勤勉な「スパイダー」は、毎日インターネット上を巡回して、あるリンクから別のリンクに移動し、コンテンツをダウンロードし、分析して絞り込み、キーワードを見つけます。ユーザーにとって役に立たないものは、データベースに保存されます。逆に、「スパイダー」は、それがスパムまたは重複情報であると判断した場合、それを破棄し、最新の有用な情報を見つけるためにクローリングを続け、ユーザーが検索できるように保存します。ユーザーが検索すると、キーワードに関連する URL が取得され、訪問者に表示されます。

キーワード ペアでは複数の URL が使用されているため、並べ替えに問題が生じます。そのため、キーワードに最もよく一致する URL が最初にランク付けされます。 「蜘蛛」が Web コンテンツを巡回してキーワードを絞り込む過程で、「蜘蛛」がそれを理解できるかどうかという問題があります。 WebサイトのコンテンツがFlashやjsだと、理解できずわかりにくいですし、キーワードが適切であっても役に立ちません。同様に、Web サイトのコンテンツがその言語である場合、Web サイトはそれを理解でき、その言語は SEO です。

2. SEO の概要

正式名称: Search English Optimization、検索エンジン最適化。検索エンジンが存在して以来、SEO が誕生しました。

存在意義: 検索エンジンの自然検索結果における Web ページの数と順位を向上させるために行われる最適化動作。つまり、Baidu などの検索エンジンに、当社が注意深く作成した Web サイトがさらに含まれるようになり、他のユーザーが Web サイトにアクセスしたときに、その Web サイトが最初にランク付けされることを願っています。

カテゴリ: ホワイト ハット SEO とブラック ハット SEO。ホワイトハット SEO は、Web サイトのデザインを改善および標準化し、Web サイトを検索エンジンやユーザーにとってより使いやすいものにする役割を果たします。Web サイトは検索エンジンから適度なトラフィックを獲得することもでき、これは検索エンジンによって奨励され、サポートされます。ブラックハット SEO は、より多くのユーザー訪問を獲得するために検索エンジン ポリシーの欠陥を利用および増幅します。この種の行為のほとんどは検索エンジンを欺くものであり、一般的な検索エンジン会社によってサポートまたは推奨されていません。この記事ではホワイトハット SEO に焦点を当てていますが、ホワイトハット SEO では何ができるのでしょうか?

1. Web サイトの位置付けを反映し、検索エンジンが Web サイトの機能を理解できるように、Web サイトのタイトル、キーワード、説明を慎重に設定します。

2. Web サイトのコンテンツの最適化: コンテンツとキーワードの対応、キーワード密度の増加;

3. Web サイト上で Robot.txt ファイルを適切に設定します;

4. 検索エンジンに適したサイトマップを生成します;

5. 外部リンクを追加し、さまざまな Web サイトで宣伝します;

3. フロントエンド SEO
Web サイトの構造レイアウト設計と Web ページ コードの最適化により、フロントエンド ページはブラウザ ユーザーと「スパイダー」の両方が理解できるようになります。

(1) Web サイトの構造とレイアウトの最適化: できるだけシンプルかつ要点を簡潔に伝えるように努め、フラットな構造を推奨します。

一般的に、作成する Web サイト構造のレベルが少ないほど、「スパイダー」によってクロールされやすくなり、組み込まれやすくなります。一般に、中小規模の Web サイトのディレクトリ構造は 3 レベルを超えており、「暗闇で迷ったらどうしよう」と「蜘蛛」が這い降りようとはしません。関連する調査によると、訪問者が 3 回ジャンプしても必要な情報が見つからなかった場合、その場を離れる可能性が高くなります。したがって、3 層のディレクトリ構造も経験を必要とします。このためには次のことを行う必要があります:

1. ホームページのリンク数を制御する

Web サイトのトップページは最も重要な場所であり、トップページのリンクが少なすぎて「橋」が存在しない場合、「クモ」が内部ページまで這い続けることができず、Web サイトに直接影響を及ぼします。含まれる Web サイトの数。ただし、ホームページ上のリンクが多すぎてはいけません。リンクが多すぎると、実質的なリンクがなくなり、ユーザーエクスペリエンスに影響を与えやすくなり、Webサイトのトップページの重量が減り、インクルージョン効果が低下します。良くないよ。

したがって、中小企業の Web サイトの場合、ホームページ リンクは 100 個以下にすることをお勧めします。リンクの性質には、ページ ナビゲーション、ボトム ナビゲーション、アンカー テキスト リンクなどが含まれます。ユーザーの優れた経験に基づいて、ユーザーが情報を入手できるように誘導する必要があります。

2. ディレクトリ階層を平坦化し、「スパイダー」が Web サイト内の任意の内部ページに 3 回までジャンプできるようにします。 「植物」 --> 「果物」 --> 「リンゴ」、「オレンジ」、「バナナ」などのフラットなディレクトリ構造。レベル 3 を通過するとバナナを見つけることができます。

3.ナビゲーションの最適化

ナビゲーションは可能な限りテキストベースにするか、画像ナビゲーションと組み合わせることができますが、画像コードを最適化する必要があります。フロントエンド SEO — 詳細な説明 タグには、検索エンジンに情報を伝えるために「alt」属性と「title」属性を追加する必要があります。画像が正しく表示されない場合でも、ユーザーはプロンプト テキストも表示できるように、ナビゲーションの位置を調整します。

第二に、パンくずリスト ナビゲーションをすべての Web ページに追加する必要があります。利点: ユーザー エクスペリエンスの観点から、ユーザーは現在の位置と Web サイト全体における現在のページの位置を把握できるため、ユーザーは組織形態をすぐに理解できます。ウェブサイトの「スパイダー」は、位置情報をわかりやすくし、各ページに戻るためのインターフェースを提供してユーザーの操作を容易にします。「スパイダー」は、ウェブサイトの構造を明確に理解することができ、また、クローリングしやすいように多数の内部リンクを追加します。直帰率を下げてください。

4. Web サイトの構造レイアウト -- 無視できない詳細

ページ ヘッダー: ロゴ、メイン ナビゲーション、およびユーザー情報。

ページの本文: 左側にブレッドクラム ナビゲーションとテキストを含むメイン テキスト、右側に人気記事と関連記事。利点: 訪問者を維持し、より長く滞在させることができます。「スパイダー」の場合、これらの記事は次のとおりです。ページの関連性を高める関連リンクは、ページの重要性も高めることができます。

ページの下部: 著作権情報とフレンドリーリンク。

特に注意: ページング ナビゲーションの書き方 推奨の書き方: 「ホームページ 1 2 3 4 5 6 7 8 9 ドロップダウン ボックス」で、「スパイダー」が対応するページ番号に従って直接ジャンプできるようにします。ドロップダウン ボックスで、ジャンプするページを直接選択します。次の書き方は推奨しません。「ホームページ、次のページ、最後のページ」、特にページ数が特に多い場合、「蜘蛛」は這う前に何度も這い降りる必要があり、非常に疲れるし、与えやすくなります。上。

5. ページのサイズを制御し、http リクエストを減らし、Web サイトの読み込み速度を向上させます。

1 ページあたり 100k を超えないようにするのが最善です。大きすぎると、ページの読み込み速度が遅くなります。速度が非常に遅い場合、ユーザーエクスペリエンスは良くなく、訪問者を維持することができず、タイムアウトが発生すると「スパイダー」も去ってしまいます。

(2)Webページのコード最適化

1. タイトル: 重要なポイントのみを強調します。重要なキーワードは前に置くようにします。キーワードは繰り返し使用せず、すべてのページに含めるようにしてください。タイトルに同じ内容を設定しないでください。

2. タグ: キーワード。複数のページの重要なキーワードをリストします。詰め込みすぎないように注意してください。

3. タグ: Web ページの説明。Web ページのコンテンツの概要を示す必要があります。長すぎたり、キーワードを詰め込みすぎたりしないように注意してください。各ページは異なるものである必要があります。

4. タグ: コードをセマンティックにし、適切な位置で適切なタグを使用し、適切なタグを使用して適切な処理を行うようにしてください。ソースコードの読者と「スパイダー」の両方に対して明確にしてください。例: h1 ~ h6 はタイトル クラスに使用されます。

5. ハイパーリンク タグ: ページ内リンクの場合、訪問者や「スパイダー」にわかるように説明する「title」属性を追加します。他の Web サイトにリンクする外部リンクについては、el="nofollow" 属性を追加して、「スパイダー」が外部リンクをクロールすると戻ってこないため、「スパイダー」にクロールしないよう指示する必要があります。

6. テキスト タイトルに h1 タグを使用します。「Spider」はそれが最も重要だと考えています。h1 が気に入らない場合は、CSS を通じて h1 のデフォルト スタイルを設定できます。本文のタイトルには h1 タグ、字幕には h2 タグを使用するようにしてください。ただし、それ以外の場所で h タイトル タグを安易に使用しないでください。

7. 改行タグ: テキストコンテンツの改行にのみ使用されます

8. 表では表タイトル タグを使用する必要があります

9. 画像は「alt」属性を使用して記述する必要があります

10. 太字の強調タグ: 強調が必要な場合に使用します。太字タグは検索エンジンで高く評価されます。キーワードを強調表示し、重要な内容を表現できます。強調タグの強調効果は太字タグに次ぐものです。

10. テキストのインデントには特殊な記号を使用せず、CSS を使用して設定する必要があります。著作権記号には特殊記号 © を使用せず、直接入力方法を使用して「banquan」と入力し、シリアル番号 5 を選択して著作権記号 © を入力できます。

12. CSS レイアウトを上手に利用し、重要なコンテンツの HTML コードを前面に配置します。前面のコンテンツは最も重要であると考えられ、コンテンツのキーワードを捕捉する「スパイダー」に優先的に読まれます。

13.「スパイダー」が認識しないため、重要なコンテンツの出力に JS を使用しないでください。

14. 通常、「スパイダー」はコンテンツを読み取らないため、iframe の使用はできるだけ少なくしてください。

15. 表示したくないテキスト コンテンツについては、z-index を設定するか、ブラウザ表示の外側に設定する必要があることに注意して、display: none を使用します。検索エンジンは、display:none のコンテンツを除外するためです。

16. コードを継続的に簡素化する

17. js コードが DOM 上で動作する場合は、body 終了タグの前、html コードの後に​​配置する必要があります。

------------------------------------------------- --- ------------------------ ウェイター、車輪を 2 つください。

以上がフロントエンド SEO — 詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はlinuxprobe.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。