Startseite arrow Tipps & Tricks arrow Es waren einmal: Tables

Es waren einmal: Tables

(2 Bewertungen)
Mittwoch, 6. Februar 2008
Geschrieben von Armin Vieweg
Den zweiten Teil der Doku-Reihe "Es waren einmal" widme ich mich den Tabellen. Auch wenn sie noch allgegenwärtig sind verlieren sie zunehmend an Bedeutung. Hier erfahrt Ihr weshalb.

Manche fragen sich vermutlich, was die Tabellen in einer Dokumentation zu suchen haben, die sich mit Vergangenem beschäftigt. Diese Frage ist berechtigt, denn auch heute noch finden Tabellen rege Verwendung in der Erstellung von Internetseiten.

Was sich aber im Laufe der Zeit geändert hat, ist der primäre Verwendungszweck.



Tabellen als grundlegendes Element
Eine Tabelle besteht aus Zeilen und Spalten. Und verglichen mit einer Website sind die Ähnlichkeiten durchaus signifikant. Der klassische Websiteaufbau ist ein Header, links das Menü und rechts der Inhalt.

Dieser Aufbau kann mit einer Tabelle ganz leicht nachgebaut werden. 2 Zeilen, 2 Spalten und die Zellen in der ersten Zeile miteinander verbunden und fertig ist das Grundgerüst.

Gerade in WYSIWYG-Editoren, wie z.B. Dreamweaver sind die Einstellungsmöglichkeiten dort sehr einfach, übersichtlich und intuitiv gehalten.

Diese Tatsache und noch ein paar andere Vorteile, die sich durch Tabellen ergeben sind der Grund warum vor 5 Jahren ca. jede Website mit einer Tabelle erstellt wurde. Auch heute laufen Websites frisch vom Stapel, in denen eine Tabelle das Grundgerüst festhalten.


Tabellen & CSS - Ein Wiederspruch in sich
Die Idee von Stylesheet (CSS) ist es die Inhalte und das Aussehen in einer Website zu trennen. In der HTML-Datei stehen alle Informationen, wie Überschriften, Texte, Verlinkungen, etc.  und in der CSS-Datei steht, wie diese aussehen sollen und wo sie positioniert sind.

Tabellen greifen einem CSS dort hinein. Denn sie bringen im Gegensatz zu jedem anderen, bekannten Element innerhalb von HTML eine Struktur hinein. Es ist zum Beispiel nicht möglich nur mit HTML einen zwei Texte nebeneinander auszurichten, ohne Tabellen zu verwenden.

Und genau dort liegt das Problem. Verwende ich eine Tabelle dafür, anstatt es mit DIVs und Float zu lösen, ist der Text unwiderruflich permanent nebeneinander. Ich kann an dieser Tatsache mit keinem CSS-Befehl irgendetwas ändern.

Habe ich aber von vornherein alles mit CSS umgesetzt, ist der Flexibilität keine Grenzen gesetzt und wir haben vollen Spielraum bei der Umsetzung.



Übersicht ade
Tabellen zerstören nicht nur den Grundgedanke von CSS, sondern sind darüberhinaus auch noch ziemlich unübersichtlich im Quellcode. Eine Fehlersuche besonders bei extrem verschachtelten Internetseiten zur Qual für jeden Webdesigner werden.

Oft in solchen Layouts findet man eine Tabelle, in einer Tabelle, welche sich wiederum in einer Tabelle befindet.


Schuster bleib bei deinen Leisten!
Ganz schlecht sind Tabellen natürlich auch nicht. Für das, wofür sie ursprünglich konzipiert wurden, sind sie wunderbar zu gebrauchen. Wo von die Rede ist? Na von Tabellen natürlich.

Die klassische Tabelle wie wir sie z.B. aus Excel kennen, die kann man getrost mit dem <table>-Tag umsetzen. Es gibt auch mittlerweile sehr ansprechende JavaScripts mit denen die Tabellen optisch und funktionell aufgewerten werden können.



Aber ProfessorWeb benutzt ja auch Tabellen!
Ja ich weiß und bin auch nicht glücklich darüber. Das kommt noch von dem Grundgerüst des CMS Joomla. Die vor zwei Wochen veröffentlichte Version hat komplett auf die Verwendung von Tabellen verzichtet, diese hier jedoch leider nicht. Aber spätestens bei einem Redesign von ProfessorWeb wird auch die letzte Tabelle weichen müssen ;)


Jetzt habe ich einen ganzen Artikel aufgewendet um die Nachteile von Tabellen aufzuzählen, doch kaum ein Wort für die einzig richtige Alternative. Das wird aber folgen: Eine Einführung in DIV und Floats zum Grundaufbau von Websites.



  Kommentare (4)
 1 Geschrieben von: Kaede, am 06.02.2008 um 19:30
[b]Wenn's mal wieder schnell gehen soll...[/b] 
...benutzen auch die besten Webdesigner leider immer wieder Tabellen. Denn dauernd Browserfixes für gewisse Browser mit I und E sind oft zeitaufwendig und nervig... 
Daher wird man wohl Tabellen niemals "endgültig" aus dem Design entfernen können. Leider :(
 2 Geschrieben von: Armin Vieweg, am 06.02.2008 um 23:16
Ich nehme mir einfach die Zeit. Die halbe Stunde mehr Aufwand ist es wert, wenn Du mich fragst. 
 
Aber irgendwann (so Gott will) sind die Browser alle geeicht. Und dann bedürfen diverse Browser keine Extrabehandlung mehr ;)
 3 Geschrieben von: hellmike, am 20.12.2008 um 18:15
wie schauts mit wirklich komplexen sites aus die gesliced sind 
und optisches theater etc... ich red ja net von seiten wie 
das übliche... so wie spiegel.de oder oder. 
ein header oben etwas texterle und wahllos bilder- websites die 
ausgucken das da grausst- das ist sicher easy mit-css-schmäh 
und ehrlich-egal welcher browser-das hat zum funktionieren wie 
tv-einschalten-gucken-und net-vorführeffekt und herumschisteln 
ich will als user, schnell, cool und net basteln--kappieren das die 
entwickler einmal-und verstehn die das sie und das ganze marketing 
mehr geld machen täten wenn einfach nur= es geht?
 4 Geschrieben von: teceumel, am 20.12.2008 um 18:24
genau! 
Webdersign hinkt hinter dem echten Leben, wenn man es mit 3d und dem Krempel 
der in und um Hollywood verwendet wird immer weiter zurück. es gibt billionen 
Websiten, aber wenn du Glück hast, findes 30-40, die es wert sind länger als 3 milisec 
dran zu bleiben. Gelabere, fades Design und was auch immer. Und oft sind die Macher 
gezwungen, den größten Müll zu basteln. Mir is es wurscht ob ich Tabellen oder in Zukunft 
was auch immer verwende, ich will als Kreativer frei arbeiten und mich net im Raster be- 
wegen und 90% der Zeit an Lösungen basteln um 10% meiner Idee zu bekommen. 
Machts eine Norm, verbindlich, ein Spielfeld, ein base-usage, dann würde da mehr sein 
und mehr anlocken. na ja.... wer gegen den Wind schreit...
Letzte Aktualisierung ( Montag, 10. November 2008 )
 
< Zurück   Weiter >




Professor Web - Webdesign Blog - RSS-Feed

Professor Web Blogroll

Alternativer Webdesign-Blog
www.daswebdesignblog.de

Blog für Dies und Das
www.moes-blog.de