<p class="sycode"> </p> <p class="sycode"> </p> <p class="sycode"> DIV+CSS 3 行 2 列のクラシック レイアウト </p> <p class="sycode"> 2004 年に Shi Ajie が「Web Designer」で公開した非常にクラシックなレイアウトで、IE、Mozilla、Opera ブラウザーのアダプティブで中央揃えと高さを実現できます。完全なコードは次のとおりです (Ajie のコードに基づいて部分的に変更されています): <br> <br> </p> <p class="sycode"> <br></p> <br><meta http-equiv="Content-Type" content="”text/html;"> <title>SEO リファレンス: XHTML の古典的な 3 行 2 列のレイアウト</title> <br><style type="”text/css”"> <br />body { <br />background: #999; <br />text-align: center; 333; <br />フォントファミリー: Verdana、Arial、Helvetica、サンセリフ; <br />#header { <br />margin-right: auto; <br />width: 776px; : #EEE; <br />テキスト整列: 左; <br />マージン右: 自動; <br /> <br />#mainbgフロート: 左; <br />幅: 776ピクセル; <br /> <br />#右 { <br />マージン: 2ピクセル 0ピクセル; <br />幅: 5 74ピクセル; <br />背景: #ccd2de; <br /> <br />#left { <br />マージン: 2px 2px 0px; <br />背景: #F2F3F7; ; <br />テキスト整列:左; <br />#フッター { <br />クリア: 両方; <br />マージン-左: 自動; <br />幅: 776ピクセル; : 60px; <br />} <br /> <br />.text {margin:0px;padding:20px;} <br />＜/style＞ <br /> <br />＜/head＞ <br /> <br />＜body＞ <br /> <br />＜div id=”header”＞header ＜/ div＞ <br /> <br />＜div id=”contain”＞ <br />＜div id=”mainbg”> <br />＜div id=”right”> <br />＜div class=”text”＞＜p＞コアコンテンツ＜/p＞＜/ div＞ <br />＜/div＞ <br />＜div id=”left”＞ <br />＜div class=”text”＞left＜/div＞ <br />＜/div＞ <br />＜/div＞ <br />＜/div＞ <br /> <br />＜div id =” footer”＞footer＜/div＞ <br /> <br />＜/body＞ <br />＜/html＞ <br /> <br /> <br />効果のデモンストレーション画像: <br /> <br /> <br /> <br />以下は、SEO の観点からこのレイアウトの利点を分析します: <br /> <br />まず Web デザインを見てみましょうページ上のコンテンツの分布を見てみましょう。一般に、上部 (領域 A) はサイト ナビゲーション、下部 (領域 D) は補助ナビゲーションと著作権情報など、左側 (領域 B) には検索が含まれます。リスト、ランキング、その他の機能。コアコンテンツは右側 (領域 C) に集中しています。 <br /> <br />上のロゴに示されているように、従来のレイアウトによると、コードの記述順序は「A->B->C->D」ですが、これは「関数->関数->」としても理解できます。 ;コアコンテンツ -> ;機能」。 <br /> <br /> 検索エンジンのスパイダーがクロールするとき、ページ コードの順序で上から下にクロールすることは誰もが知っていますが、この場合、スパイダーがコア コンテンツにできるだけ早くクロールするのは困難です。ページのコードが多すぎると、クローラーがコア コンテンツにクロールしない場合、他のページと同じ機能のコンテンツがクロールされると、このページは同様の Web ページになります。 <br /> <br />この状況を回避するために、Sina、Sohu、NetEase (そしておそらくあなたも ^_^) を含む多くの Web サイトは、デザイン中にページ内の領域 B と領域 C を交換しました。 <br /> <br />このレイアウト方法を改めて見てみると、ページコードの並びは「A->C->B->D」となっており、コンテンツの分布によれば「機能->コアコンテンツ->」と理解できます。 ;function->function" とすると、ページ表示を変更せずに、コアコンテンツ部分を前面に配置します。 <br /> <br />このようにして、スパイダーはクロール時に最短時間で Web ページのコアコンテンツのインデックスを作成できます。 <br /> <br /> XHTML 標準設計コードの単純さの利点と組み合わせると、スパイダー クローリングの効率と品質が非常に高くなり、スパイダーの人気がさらに高まります。 <br /> <br /> <br /> <br /></style>
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
