なぜデザインで<table>を使用することになっていないのですか？

テーブルを使用してWebサイトを設計するべきではない明確で論理的な理由は何ですか？利点はどこにありますか、このアイデアを業界で推進しているのは何ですか？テーブルを使用しても大丈夫ですか？

1）テーブルは次の理由でページレイアウトに使用しないでください。

• ブラウザがすべてではないにしても、適切にレンダリングするためにテーブルのほとんどをダウンロードする必要があるため、レンダリングが遅い

• 非テーブルレイアウトよりも多くのHTMLを必要とするため、読み込みとレンダリングが遅くなり、帯域幅の使用量が増加します

• 彼らはすぐに複雑になる可能性があるため、維持するのが悪夢になる可能性があります

• 彼らはテキストのコピーを破ることができます

• スクリーンリーダーに悪影響を及ぼし、一部のユーザーがコンテンツにアクセスできなくなる可能性があります

• 適切なセマンティックマークアップを使用するほど柔軟ではありません

• ページレイアウトに使用することを意図したものではありませんでした

• テーブルをレスポンシブレイアウトにすることは、制御が非常に困難です

2）表形式のデータには表を使用します。それがテーブルの目的です。

参照：なぜ人々はdivでテーブルを作成するのですか？

表は表形式データ用であり、設計用ではありません。多くの場合、ページを「テーブルなし」にする背後にある動機を誤解しています。

テーブルを使用してレイアウトを作成するのは間違っています。レイアウトには他の要素（div、リスト、セクション、記事、ヘッダー、フッター、サイドなど）を使用する必要があります。また、最小限のHTML / CSSで優れた効果を実現できます（意味的に意味のある軽量で保守しやすいコードを残します）。

もちろん、表形式のデータはテーブル要素内にある必要があります。必要に応じて、thead、tfoot、tbody、th、captionなどを追加することで、テーブルのセマンティクスを改善することができます。これらの要素はすべてテーブルで使用することを目的としています。 。

そのため、テーブルベースの設計ではなく、適合するHTML / CSSソリューションを使用してください。HTMLセマンティックマークアップから始めて、CSSでデザインを構築します。これにより、誰でも安全に保つことができます。これを経験則として使用してください。

テーブルには、デザイン要素ではなくデータが含まれることが想定されています。

テーブルは、表形式のデータを表示する場合にのみ使用してください。それ以外の場合、それらは通常、表示には適していません。

テーブルを使用しない本当の原因は次のとおりです。

テーブルのデフォルトのレイアウトは次のとおりです。 table-layout:fixed

これにより、ブラウザにテーブルを分析し、セルを修正してその中に要素を含めるように指示します。これには時間がかかります。（これが、テーブルが複雑なデータに非常に適している理由です）

一番下の行：テーブルは、たとえばDIV要素を使用する場合とは対照的に、テーブル内のすべてのコンテンツがレンダリングされた後にレンダリングされます。

私は固定式と混合した液体のウェブデザイン構造にテーブルを使用しています。多くの人がテーブルは初心者向けであり、他の人は古い学校の人向けであり、DIVSは常に最高だと言いますが、真実はテーブルがいくつかのものとDIVSのために優れていることを知っています別のもの。

<br>どちらが良い<p></p>ですか？同じこと

私と私の新しい2015年のWebデザインの古いテーブルは、幅が100％で、サイドコラムが2辺200pxの友好的なモバイルで、誰にでも尻を蹴ることができます。

明らかに、テーブルの内側はますます多くのテーブルを配置するのがいので、DIVSが便利です。テーブルはdivができないことを実行でき、divはテーブルができないことを実行できます。

デフォルトのテーブルレイアウトが固定されていると言っている人はいますか？例を挙げます

<table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="200">left</td>
    <td width="100%">middle</td>
    <td width="200">right</td>
  </tr>
</table>

あなたは今その可能性を見ていますか？PCと携帯電話でご覧ください。ああ、ブートストラップも必要ありません。

divで同じことを行うには、多くのCSSコードを記述して、align floatとcrapを表示する必要があります。誰がより少ないコードを書いたのですか？私！顧客には何が必要ですか？1年または1か月でページを終了する人？

divでデザインを改善しましょう

<div style="width:100%; min-width:1000px; height:200px;">top menu or nav</div>
<table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="200">left</td>
    <td width="100%">middle</td>
    <td width="200">right</td>
  </tr>
</table>
<div style="width:100%; min-width:1000px; height:200px;">top menu or nav</div>

とても美しい5列設計のdivとテーブルを使用したレイアウト。

あなたの答えは次のとおりです。両者は共により良く機能し、より高速であり、テレビや小型携帯電話でもどんなデザインでも見栄えがします。