Web サイトにおける div と table の使いやすさの比較

ページレイアウトでは div と table がよく使われますが、ページ内での div と table の使いやすさの比較について説明します。興味のある方は以下をご覧ください。見て。

DIV と TABLE 自体には利点も欠点もありません。いわゆる Web 標準では、タグの正しい使用のみが推奨されています。たとえば、DIV はレイアウトに使用されますが、TABLE は本来 2 つの変換に使用されます。 -次元データ。 TABLE にやるべきことをやらせても、ページに表示されなければ、TABLE がそれほど優れているとは言えません。

植字に DIV を使用する利点は、私が言うことはありませんが、誰もがそれを明確にすべきであるということです。 DIV は標準であり、一般的な傾向ですが、すべてのページが使用に適しているという意味ではありません。

中国のポータルと外国のポータルには大きな違いがあります。中国のネットユーザーは、YAHOO が中国に到着すると、ページの内容が大幅に変更されました。その後、訪問数が大幅に減少したため、数日以内に元に戻りました。捜狐や新浪のようなポータルが作成されたのは、公式には中国の国情によるものです。

なぜ DIV が適していないのか、いくつかの側面から 1 つずつ説明します。

簡略化されたコード:

誰もがレイアウトだと言います。 DIV のコードは合理化されていますが、TABLE の代わりに DIV を使用して保存されたコードは CSS (スタイル) によって占められており、これらのスタイルのほとんどは DIV のレイアウトを制御するために使用されます。次に、CSS は外部で再利用できると言うでしょう。この質問に対する答えを知りたい場合は、以下をお読みください。

再利用性とダウンロード量:

.css スタイル シート ファイルを統一的に使用すると、一度変更すればサイト全体を変更できる効果が得られるため、メンテナンス コストが削減されます。 。しかし、別の観点から考えてください。ロード時にすべてのページがファイルにアクセスする必要がある場合、特に捜狐と新浪の Web サイトプラットフォームでは、このファイルのダウンロード数は数億に達することになります。フロントエンド Web サーバーがサポートを提供するため、バックエンドのコストも大幅に増加しました。背景の対応がしっかりしていないとページがぼやけて見えてしまい、これまでの作業が無駄になってしまいます。多くの人が尋ねるでしょうが、その可能性は非常に低いです。私たちが行っている作業は、これら 2 つの事故を回避することです。事故が発生すると、ポータルに悲惨な結果が生じます。

HTTP 通信:

統一スタイル シート ファイルは外部呼び出しの形式を採用しているため、単一のページが読み込まれるたびに、サーバーへの http リクエストが行われます。応答を一度増やすと、フロントエンド Web サーバーで大量のコストが消費されます。長い間、css と js は外部呼び出しの形式ではなく、ページのフロントエンド (sohu と sina のページを見ると、ほとんどがこの形式を使用しています) に記述されていたことがわかりました。サーバーに追加のコードを追加しないようにするためです。

ページ キャッシュ:

ユーザーがページにアクセスするたびに、ユーザーが確実にアクセスできるようにするために、ページが一定期間ブラウザのキャッシュに保存されます。次回のページ表示速度を改善します。変更を加えるたびにページが再ダウンロードされ、CSS ファイルが変更されると、Web サイト上でアクセスしたすべてのページが再ダウンロードされます。ページは変更されただけです。ページを再度ダウンロードする必要があります。

互換性:

すべてのブラウザのすべてのバージョンが CSS (スタイル シート) を十分にサポートしているわけではありません。たとえば、IE5 より前のブラウザでは CSS が十分にサポートされていません。とても良い。現在、IE5 より前のブラウザを使用しているユーザーは少なくありません。これは、ページの作成プロセス中に、互換性を確保するためにさまざまなブラウザのバージョンをテストする必要があることを意味し、これにより (少なくとも私が連絡する開発者にとっては) 多くの作業負荷が追加されます。 . div ページの作成にかかる標準時間は、table ページの作成時間よりも長くなります。

クロスカッティングと延性:

クロスカッティング - 従来のレイアウト方法では、ページのダウンロードを高速化するためにページを上から下にいくつかのブロックに分割します。この状況は、レイアウトに DIV を使用するページでよく発生します。各ブロックの中央の列またはその他の列のコンテンツ項目の数が固定されていないため、両側の列が同時に適応されず、空白が表示されます。

対照的に、従来のテーブル方式では、そのような状況を回避するのが簡単です。

上記では、特定の分野における特定のテクノロジーの利用可能性についてのみ説明し、テクノロジー自体については説明しませんでした。

とはいえ、これは DIV のレイアウト方法が良くないと言っているわけではありません。他人の意見に従うのではなく、大規模なコンテンツベースのポータルにおける Table の役割を正しく認識する必要があるということです。大規模な Web サイトで DIV レイアウト方法が使用されないのは、技術が遅れているからポータルが DIV を使用しないという意味ではなく、内部の人々が先進的ではないためですが、さまざまな理由で決定されます。 NetEase がすべて DIV を使用する理由は、コンテンツが主な焦点ではないためです。他のポータルの場合、そのような決定は検証の時間に依存します。ただ、今はまだ機が熟していません。 ?

以上がWeb サイトにおける div と table の使いやすさの比較の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。