Eine grundlegende Frage bezüglich der HTML Programmierung ist mit welchen HTML Elementen eine Webseite gebaut werden soll. Jeder Programmierer hat eine Meinung diesbezüglich, jedoch müsste man sich objektiv alle Vor- und Nachteile gut überlegen, um zu entscheiden mit welchen HTML Containern zu arbeiten. Wichtig ist auch anzumerken, dass das auch von der jeweiligen Aufgabe und Umfang der Arbeiten sehr oft abhängt.
Wir versuchen nachfolgend kurz zu beschreiben welche Vorteile und welche Schwierigkeiten ein Programmierer mit Tabellen oder Div Ebenen haben wird und dann ziehen wir ein Schlussstrich, der uns die Antwort auf die Frage gibt, wie HTML korrekt programmiert werden soll.
HTML Webdesign mit einer Tabelle (
Tag)
Es ist richtig zu sagen, dass alle Programmierer, die schon ein Paar Jährchen HTML bauen und diverse Webdesigns umgesetzt haben, grundsätzlich mit Tabellen angefangen haben. Das ist auch Browserbedingt so gewesen, denn die Browser haben nicht alle moderne HTML und CSS Elemente in der Vergangeheit unterstützt. Die Tabelle war straightforward, verständlich und man konnte große und schöne Webseiten bauen. Nun betrachten wir die Vorteile bei der Programmierung mit Tabellen:
Einfaches Bauen von Spalten-orientierten Layouts in Tabellen mit sehr nüzlichen Features wie colspan und rowspan, die bestimmte Zellen gemerged darstellen konnte.
Bestimmung von der Breite der ersteb Zelle bestimmt die Breite aller nachfolgenden Zellen
Höhe gleich 100% für die komplette Tabelle, falls einer der Spalten diese nach unten drückt.
Features wie cellpadding und cellspacing für eine einfache Bestimmung der Abstände in den Zellen
Wichtigster Vorteil - sehr angenemme Dastellung von Tabellen mit einem guten Aussehen bei wenig Programmieraufwand
Leider das ist wirklich alles, was dafür spricht - viel mehr spricht dagegen. Nachfolgend bertrachten wir die Nachteile bei der Programmierung mit Tabellen:
Browserunterstützung - man kann sich nie auf eine gleiche und einheitliche Darstellung einer Tabelle mit allen Browsern, insbesondere wenn die Tabelle für Layouttechnische Umsetzung benutzt wird
Die Breite der Tabelle und der einzigen Spalten spannt sich durch den Content und ist keine verlässliche Programmierung. Genauso wenig verlässlich ist die Höhe der Tabelle
Kein Overflow (ergibt sich aus dem obigen Nachteil)
Großer Codeanteil und dadurch schwerere Seiten
Keine Unterstützung für CSS3 - Rundungen und Schatten usw.
Keine absolute Positionierung und andere HTML Einschränkungen
u.v.m.
Webdesign mit Tabellen ist eine veraltete und einschränkende Sache. Wir wollen aber nicht sagen - nie wieder mit Tabellen arbeiten. Betrachten wir nun die andere Variante - Div Ebenen.
Webdesign mit Div Ebenen (
Tag)
Eine Div Ebene ist eine sehr feine und gute Sache, mann muss nur wissen wie man damit umgeht. Die Div Ebenen brauchen keine Spalten, Zeilen oder sonstige Container, können beliebig oft verschachtelt werden und sind vom Codemenge her viel leichter. Nun die Vorteile bei der Programmierung mit Div Ebenen:
CSS3 Unterstützung und alle Schönheiten, die dazu gehören
Absolute Positionierung, was die Arbeit massiv erleichtert
Höhe- und Breitenangaben, auf die man sich verlassen kann
Perfekte Kompatibilität mit verschiedenen Browsern
Einfache Referenzierung mit Javascript für DHTML
Sehr logische und einfache Layoutstruktur, die sich leicht anpassen lässt
u.v.m.
Man sieht, dass die Vorteile ganz viel sind und viel für die Arbeit mit Div Ebenen spricht. Es gibt aber ein Paar Nachteile, auch wenn sie ganz wenig sind:
Nicht so gute Unterstützung bei älteren Browsern
Mühsames Bauen von Tabellenstrukturen
Ich denke der letzte Nachteil sagt alles, nun unser Fazit:
Fazit - Tabelle oder Ebene
Und die Antwort - keine der beiden ausschließlich, sondern beide zusammen. Es ist ganz simple - bauen Sie Ihr Webdesign Layout, die Haupstruktur der Seiten, die ganzen Widgets und die interaktiven Elemente mit Div Ebenen und bauen Sie Ihre Tabellen, die im Inhalt der Seite und nicht in der Struktur vorkommen, mit
Tags - diese sind und waren immer dafür eigentlich gedacht.
Deutsch
