Blog zu den Themen Webentwicklung, technisches Online Marketing und Suchmaschinenoptimierung

100% tabellenloses Webdesign!? Bullshit!

Heute nehme ich mir mal wieder etwas Zeit, um mein Wort zum Sonntag zu tippen. Dies hat zwei Gründe: Zum einen eine kleine Fingerdehn-Übung, da ich direkt im Anschluss an meinem eBook (Infos in kürze) weiterarbeiten werde.

Zu dem habe ich mich zwecks Marketing-Vorbereitung für unser CMS fokus in den letzten Tagen durch etliche Webseiten deutscher Werbeagenturen geklickt. Dabei ist mir aufgefallen, dass immer noch viele das Attribut 100% tabellenloses Webdesign oder tabellenfreies Layout zu ihren Stärken zählen.

Für mich Grund genug, mal wieder einen Blogartikel einzureichen. Denn das Tabellen im Webdesign alles andere als böse sind und sich herrlich für den Transport von gezielten Informationen eignen, haben scheinbar noch nicht alle begriffen. Obwohl, man könnte besser sagen, haben einige noch nicht wieder begriffen – schlagen wir dazu in unserem Geschichtsbuch das Kapital tabellenloses Webdesign auf.

Woher stammt der Gedanke, Tabellen seien böse?

Tabellen waren nicht immer „böse“; ganz im Gegenteil: Noch vor wenigen Jahren galten sie als das ultimative Layout-Element im Webdesign. Auch in meinem Lernprozess kamen direkt nach den Frames die Tabellen-Layouts.

Es war zu einer Zeit, als die Cascading Stylesheets vielen kein Begriff waren. Das Aussehen, die Größe und das Box-Verhalten eines HTML-Elements über etwas anderes als die eigenen HTML-Attribute zu beschreiben, war ebenso fremd.

Die HTML-Tabelle – welche quasi das Grid Model 1.0 darstellt – kam da natürlich gelegen. Über tr und td, colspan und rowspan, width und height konnte man sich ein flexibles Layout zusammenstellen. Meistens reichte eine Tabelle nicht aus; am Ende hatte man im Idealfall 15 verschachtelte Konstrukte. Kam ein Änderungswunsch vom Kunden hatte man die Optionen zwischen vor den nächsten Zug springen oder alles neu schreiben…

Ich kann mich noch erinnern, als wäre es gestern gewesen: Von heute auf morgen kam die Revolution, das div-Element war erfunden. Im Zusammenhang mit CSS öffneten sich dem Webentwickler neue Welten. Logisch, dass die Layout-Tabelle recht schnell unter Beschuss geriet. Einschlägige Fachblogs riefen das Ende des table-Elements aus – wer es dennoch verwendete, wurde an den digitalen Pranger gestellt.

Zum Glück gab es sogar Programme, die den Foren-Alltag erheblich erleichterten: Einfach die URL der zu überprüfenden Webseite eintragen, die Anzahl der table-Tags wird ausgelesen und schwups ist ein qualitativer Faktor ermittelt – Wahnsinn!

Tabellen sind nicht böse!

Damit mich jeder auch versteht, werde ich in diesem Absatz den Einsatz sarkastischer Elemente zurückfahren.

Vorweg: Den Inhalt einer Webseite über Tabellen zu gestalten heiße ich keineswegs gut! Dennoch sollte man als Webdesigner und Webentwickler auf keinen Fall vollständig auf das wunderschöne table-Element verzichten. Deshalb würde ich meine Leistungen auch niemals als tabellenloses Webdesign verkaufen.

HTML bedeutet ausgeschrieben Hypertext Markup Language, also keine Programmiersprache, sondern ein Modell zur Auszeichnung von Inhalten. Semantik, die Beziehung zwischen Element und Inhalt, ist das Schlüsselwort.

Benutzen wir also Tabellen in ihrer semantisch korrekten Ursprungsform – nämlich zum Transport und Vergleich gezielter Informationen – spricht absolut gar nichts gegen eine Verwendung. Im Gegenteil: Kein anderes HTML-Element bietet von Haus aus vergleichbarer Eigenschaften um Inhalte gegenüberzustellen. Sowohl in Punkto Semantik als auch bei der visuellen Darstellung.

Tabellen sind also nicht von Haus aus böse und sollte in jedem guten Webdesign ihren Einsatz finden – sofern der zu tragende Inhalt es verlangt!

Dieser Artikel wurde am 15.05.2011 veröffentlicht

Wer schreibt hier?

Torben Leuschner - Webentwickler

Hi, ich bin Torben und baue leidenschaftlich gerne Webseiten. Also habe ich mein Hobby zum Beruf gemacht und bin seit 2008 als Webentwickler Selbständig tätig. Obwohl ich schwerpunktmäßig für Kunden arbeite habe ich auch sehr viel Freude an der Realisierung eigener Projekte. Daraus resultierend hat sich eine große Affinität zu den Themen Online Marketing und Suchmaschinenoptimierung entwickelt. Gelegentlich schreibe ich auf Twitter, viel aktiver bin ich allerdings auf Facebook. Gerne können wir uns dort vernetzen!

Wie stehst du dazu?

  1. Entschuldigung, aber ich muss da mal harte Kritik an diesem Artikel ausüben.

    Für mich klingt es so, als würdest du hier die Wörter ein wenig verdrehen.

    Es ist völlig korrekt, seine Werke als „tabellenloses Design“ zu verkaufen. Im Content-Teil meiner Webseite darf ich trotzdem Tabellen nutzen, wenn dies die Semantik erfordert. Am wichtigsten wird es, wenn es um das Thema Barrierefreiheit geht. Screenreader können Tabellen korrekt wieder geben, wenn diese auch korrekt definiert wurden. Das ist aber auch nur dann möglich, wenn eben das DESIGN/LAYOUT frei von Tabellen ist und nur die erforderlichen INHALTE mit Tabellen definiert(ich schriebe extra nicht „gestaltet) werden.

    Daher finde ich den Titel des Eintrages schon recht irreführend. Denn die beiden Gebiete werden strikt getrennt und genau das ist es, worum es bei „tabellenlosen Designs“ geht.

  2. Hallo Michael,

    vielen Dank für dein Feedback. Natürlich ist der Titel provokant gewählt, die Aussage sollte sich aber mit deiner Meinung decken:

    „wenn eben das DESIGN/LAYOUT frei von Tabellen ist und nur die erforderlichen INHALTE mit Tabellen definiert(ich schriebe extra nicht “gestaltet) werden.“ Genau dies habe ich versucht im Artikel zu kommunizieren.

    Es ist aber leider so, dass viele Webdesigner und -entwickler Tabellen GENERELL meiden. Einfach weil bei ihnen im Hinterkopf schwebt, Tabellen seien als solches schlecht. Mit diesem Beitrag wollte ich lediglich vermitteln, dass semantisch korrekt verwendete Inhalts-Tabellen durchaus ihre Berechtigung haben.

    Falsch das bei Dir so nicht angekommen ist, habe ich mich wohl schlecht ausgedrückt.

    Gruß,
    Torben

  3. Hallo Thorben,

    es ging mir dabei daher eher um den Titel und den ersten Absatz. Weil eben dort immer vom Design die Rede ist. Den Provokationsversuch hab ich erkannt, fand ihn an der Stelle aber unspassend und auch irreführend.

    Einen einfacher, lehrreicher Artikel hätte ich da besser gefunden. Erster Absatz raus, Überschrift ändern (z.B.: „Tabellen sind böse? Stimmt gar nicht!“ o.ä.) und fertig.

    Aber das ist meine Meinung ;)

    Gruß zurück,
    Micha

  4. Guten Morgen,

    die Tabellen sind so in Verruf geraten, weil sie eigentlich ein wenig mehr Speicher als ein DIV Layout verwenden. Daher haben viele Webdesigner und SEO´s lautstark in die Öffentlichkeit geprült, dass Tabellenlayouts im eigentlichen Sinne schlecht sind.

    Dies liegt aber daran, dass Google die Größe einer Homepage berücksichtigt und dadurch gegebenenfalls den ein oder anderen Vorzug gibt, wenn man ein DIV Layout verwendet aufgrund der Größe.

    Ich muss dazu sagen, ich verwende bei mir in den meisten Fällen Tabellenlayouts, man muss halt auch in der Lage sein alle anderen Elemente klein und schlank zu halten. Dann hat man im Regelfall auch keine Probleme mit der Suchmaschinenoptimierung, größtenteils meiner Projekte werden alle sehr schnell geladen und ich kenne viele Webseiten mit DIV Layouts, die bedeutend langsamer ausgeliefert werden.

    Das umgestalten einer Tabelle ist normalerweise nicht allzu schwer und ist im Verhältnis zu einen DIV Layout identisch. Vorausgesetzt man hat ein PHP Template, wo man nicht jede einzelne Seite bearbeiten muss.

    Ansonsten wenn es eine rein statische Seite ist die auf Tabellen basiert und der Kunde Änderungswünsche hat, dann wünsche ich den Webdesigner viel Spaß. Dies dauert sehr lange alle einzelnen Unterseiten zu überarbeiten.

    Liebe Grüße Nico

  5. Also ich fände es ziemlich merkwürdig, wenn ein „Webdesiger“ 100% tabellenloses Webdesign verspricht und es auch so meint, wie du es darstellst.

    Selbstverständlich kommt man hier und da nicht um eine Tabelle herum. Das hat aber weniger mit Webdesign selbst zu tun, sondern soll dazu dienen, Inhalte darzustellen.

  6. Hi…

    Oh mann wie alt diese Diskussion ist ;)

    Aus diesem Artikel als auch aus den Kommentaren geht hervor, dass man ja ruhigen Gewissens Tabellen für Layoutzwecke verwenden soll. Dies ist faktisch einfach falsch und das sollte ein gewissenhafter Webdeveloper nicht tun. Es gibt dafür genau KEINEN Grund.

    Michael Walter hat im übrigen die Begründung dafür schon gegeben, aber wie meistens in Blogs, Foren oder sonstwas, schreibt eh nur jeder seinen eigenen Quark dazu und geht nicht auf die Thematik ein.

    Natürlich MUSS man Tabellen verwenden, wenn es eben tabellarische Daten sind. Egal ob eine Fußballergebnisstabelle oder eine Tabelle der Umsätze eines Unternehmens sind. Dann aber auch bitte mit colgroups, thead, tbody, tfoot, colgroups, header, id (je nach Komplexität der Tabellen) usw.

    ABER man verwendet sie eben nicht für Layoutzwecke, egal wieviele (vor allem die Jüngeren) Webdesigner zu faul sind sich mit der Technik der sich gegenseitig aufziehenden Dreispalter zu befassen. Das scheint mir der einzige Grund zu sein, warum es immer noch Webdeveloper gibt, die meinen das wäre eine gute Idee… Lasst Euch gesagt sein, nein, ist es nicht! Es gibt Mittel und Wege…

    Und auch aus Deinen Kommentaren geht hervor, dass Du es eben schon so gemeint hast (siehe Kommentar über mir).

    Über T3N hier gelandet ;)

    So long… Matthias

  7. kinders kinders, das web besteht aus mehr als tables und divs.
    nach vorne blicken ist angesagt, nicht auf veralteten best practices herum reiten.

    tabellarische daten in eine tabelle ist genauso semantisch korrekt, wie header, article und wie die neuen elemente alle heissen, solange der entwickler weis was er tut..

Schreibe einen Kommentar zu Hamza Antworten abbrechen

Deine E-Mail-Adresse wird nicht veröffentlicht.

* Die Checkbox für die Zustimmung zur Speicherung ist nach DSGVO zwingend.

Ich stimme zu.