Warum nicht Tabellen für das Layout in HTML verwenden?

Question

Es scheint die allgemeine Meinung dass Tabellen nicht für das Layout in HTML verwendet werden sollten.

Warum?

Ich habe noch nie (oder nur selten, um ehrlich zu sein) gute Argumente dafür gesehen. Die üblichen Antworten sind:

• Es ist gut, dass Inhalt vom Layout trennen
  Aber das ist ein trügerisches Argument; Klischee-Denken . Ich denke, es stimmt, dass die Verwendung des Tabellenelements für das Layout wenig mit tabellarischen Daten zu tun hat. Aber was soll's? Ist es meinem Chef egal? Interessiert es meine Benutzer?

  Vielleicht interessiert es mich oder meine Entwickler-Kollegen, die eine Webseite pflegen müssen... Ist eine Tabelle weniger wartungsfreundlich? Ich denke, eine Tabelle zu verwenden ist einfacher als mit divs und CSS.

  Übrigens... warum ist die Verwendung eines Divs oder eines Spans eine gute Trennung von Inhalt und Layout und eine Tabelle nicht? Ein gutes Layout mit nur divs erfordert oft eine Menge von verschachtelten divs.

• Lesbarkeit des Codes
  Ich denke, es ist genau umgekehrt. Die meisten Leute verstehen HTML, nur wenige verstehen CSS.

• Für SEO ist es besser, keine Tabellen zu verwenden
  Warum? Kann jemand einen Beweis dafür vorlegen, dass es so ist? Oder eine Aussage von Google, dass von Tabellen aus SEO-Sicht abgeraten wird?

• Die Tische sind langsamer.
  Es muss ein zusätzliches tbody-Element eingefügt werden. Für moderne Webbrowser sind das Peanuts. Zeigen Sie mir einige Benchmarks, bei denen die Verwendung einer Tabelle eine Seite erheblich verlangsamt.

• Eine Überarbeitung des Layouts ist ohne Tabellen einfacher, siehe css Zen-Garten .
  Die meisten Websites, die ein Upgrade benötigen, brauchen auch neue Inhalte (HTML). Szenarien, in denen eine neue Version einer Website nur eine neue CSS-Datei benötigt, sind nicht sehr wahrscheinlich. Zen Garden ist eine nette Website, aber ein bisschen theoretisch. Ganz zu schweigen von seiner missbrauchen von CSS.

Ich bin wirklich an guten Argumenten für die Verwendung von Divs + CSS anstelle von Tabellen interessiert.

Answer 1

Ich denke, es stimmt, dass die Verwendung des Tabellenelements für das Layout wenig mit tabellarischen Daten zu tun hat. Aber was soll's? Ist es meinem Chef egal? Interessiert es meine Benutzer?

Google und andere automatisierte Systeme hacer und sie sind in vielen Situationen genauso wichtig. Semantischer Code ist für ein nicht-intelligentes System leichter zu analysieren und zu verarbeiten.

Answer 2

Nachdem ich mit einer Website arbeiten musste, die 6 Ebenen von verschachtelten Tabellen enthielt, die von einer Anwendung generiert wurden, und die ungültiges HTML generierte, war es in der Tat eine 3-stündige Arbeit, um den Bruch für eine kleine Änderung zu korrigieren.

Dies ist natürlich der Ausnahmefall, aber ein tabellenbasiertes Design ist nicht wartbar. Wenn Sie CSS verwenden, trennen Sie den Stil heraus, so dass Sie sich beim Fixieren des HTML weniger Sorgen machen müssen, dass er kaputt geht.

Versuchen Sie dies auch mit JavaScript. Verschieben Sie eine einzelne Tabellenzelle von einem Ort zu einem anderen Ort in einer anderen Tabelle. Ziemlich kompliziert durchzuführen, wo div/span einfach durch Kopieren und Einfügen funktionieren würde.

"Kümmert es meinen Chef"

Wenn ich Ihr Chef wäre. Es würde Sie interessieren ;) Wenn Sie Ihr Leben schätzen.

Answer 3

Flexibilität im Layout
Stellen Sie sich vor, Sie erstellen eine Seite mit einer großen Anzahl von Miniaturbildern.
DIVs :
Wenn Sie jedes Thumbnail in ein DIV setzen, das nach links verschoben ist, passen vielleicht 10 davon in eine Reihe. Verkleinern Sie das Fenster, und BAM - es sind 6 in einer Reihe, oder 2, oder wie viele auch immer passen.
TABELLE:
Sie müssen ausdrücklich angeben, wie viele Zellen sich in einer Zeile befinden. Wenn das Fenster zu schmal ist, muss der Benutzer horizontal scrollen.

Instandhaltbarkeit
Gleiche Situation wie oben. Jetzt möchten Sie der dritten Zeile drei Miniaturbilder hinzufügen.
DIVs:
Fügen Sie sie hinzu. Das Layout wird automatisch angepasst.
TABELLE: Fügen Sie die neuen Zellen in die dritte Zeile ein. Ups! Jetzt gibt es dort zu viele Artikel. Schneiden Sie einige aus dieser Reihe ab und legen Sie sie in die vierte Reihe. Jetzt gibt es dort zu viele Gegenstände. Schneide einige aus dieser Reihe ab... (usw.)
( Wenn Sie die Zeilen und Zellen mit serverseitigem Skripting generieren, ist das wahrscheinlich kein Problem. )

Answer 4

Ich denke, das Schiff ist abgefahren. Wenn Sie sich ansehen, in welche Richtung sich die Branche entwickelt hat, werden Sie feststellen, dass CSS und offene Standards die Gewinner dieser Diskussion sind. Das wiederum bedeutet, dass die Designer für die meisten HTML-Arbeiten, mit Ausnahme von Formularen, Divs anstelle von Tabellen verwenden werden. Mir fällt das schwer, weil ich kein CSS-Guru bin, aber so ist es nun einmal.

Answer 5

Vergessen Sie auch nicht, dass Tabellen auf mobilen Browsern nicht besonders gut dargestellt werden. Sicher, das iPhone hat einen tollen Browser, aber nicht jeder hat ein iPhone. Das Rendern von Tabellen kann für moderne Browser Peanuts sein, aber für mobile Browser ist es ein Haufen Wassermelonen.

Ich persönlich habe die Erfahrung gemacht, dass viele Menschen zu viele <div> Tags, aber in Maßen kann es sehr sauber und leicht zu lesen sein. Sie erwähnen, dass es den Leuten schwerer fällt, CSS zu lesen als Tabellen. In Bezug auf den "Code" mag das stimmen, aber in Bezug auf das Lesen von Inhalten (Ansicht > Quelle) ist es verdammt viel einfacher, die Struktur von Stylesheets zu verstehen als von Tabellen.