0

HTML のレイアウトにテーブルを使用することは避けるべきであるという一般的なコンセンサスがあります。しかし、すべての規則には例外があります。デスクトップ アプリケーションで使用されるレイアウトに似たページを使用して、SPA (シングル ページ アプリケーション) を設計しています。

明らかに、HTML はこれらのタイプのページには適していませんが、他に選択肢はほとんどありません。DIV を使用してこれらのレイアウトを実装することは、CSS トリック、ハードコーディングされた値、さらにはサイズ変更イベントでの JS 計算の組み合わせを必要とする、まったくの地獄です。最近、グリッド フレームワークを使用してこれらのレイアウトを実装することについて、この質問をしました。

しかし、テーブルベースのレイアウトが適切かどうかを再考するために立ち止まりました。典型的な批判は、SPA のユニークなケースには当てはまらないようです。

  • レイアウトからのコンテンツの分離 — SPA は実際にはコンテンツではない (AJAX で埋められたデータを含むスケルトンにすぎない) ため、この議論は当てはまりません。これは単なるインターフェースです。私は、Google がそれをインデックスに登録することを期待していません。

  • テーブルは保守性が低い— この場合はそうではありません。これを DIV で実装するために経験しなければならない CSS 地獄は、はるかに高いメンテナンス コストを伴います。

  • テーブルはレンダリングに時間がかかります — もちろん、代替手段を使用して作成する複雑なレイアウトでは、レンダリングにテーブルよりもさらに多くの計算が必要になります。通常は、JS のサイズ変更イベントを使用して固有の制限を補っています。ブラウザーがレンダリング エンジン内でネイティブにこれを行う方がはるかに効率的です。

これらの議論に照らして、テーブルベースのレイアウトは SPA の特定のケースに適しているのでしょうか、それとも他の重要な要素を考慮していないのでしょうか? さらに良いオプションはありますか？

4

1 に答える 1

1

人々はテーブルについて間違っていました。何も知らなかった多くの人々がテーブル レイアウト以外のイベントを推進しましたが、当時はまったく意味がありませんでした。多くの誤解がありました。そのグーグルはセマンティックコードを気にかけています。人々はそれを誤解し、あなたはそれを説明することができないので、それは決してありませんし、今後もありません。

しかし、ついに、テーブルを使用しない実際の理由があります。

メディア クエリとレスポンシブ デザイン

レスポンシブ デザインでは、2 つの列がある場合、小さな画面では 1 つの列を一番下にドロップするのが理にかなっています。たとえば、電話画面で複数の列を 1 つの列にすることができます。

テーブルではこれを行うことはできません。

私の意見では、これがテーブルの最も重要な問題の 1 つです。他のほとんどの議論は、精神的なマスターベーションにすぎません。

石積みのような他のレイアウトもあり (たとえば、http: //masonry.desandro.com/を参照)、テーブルだけでは実現が難しいと思います。しかし、完全な高さの列の古典的な問題については、表を偽装するためだけに壊れやすいマークアップと css を大量に追加する恐ろしい回避策をほとんどの人が好んだにもかかわらず、表は適切な解決策でした。

ただし、テーブルでは応答性に必要な柔軟性が得られないため、状況は異なります。

于 2013-07-31T08:15:27.143 に答える