Webstandard & Webdesign - CSS, HTML

NACHTRAG:
Heute zumindest nicht mehr. Früher war das alles anders *schwelg* ;)

Hallöchen Peter,

zugegeben, mein Pauschalurteil war ein wenig übertrieben, aber wenn im allgemeinen von Tabellendesign die Rede ist meint niemand eine kleine Ausrichtungstabelle mit 3 Spalten. Die Rede ist dann meiner Meinung nach eher von der Oldschool Variante mit den verschachtelten Tabellen.

Gegen eine 3-Spalten-Tabelle ist in der Tat nichts einzuwenden, da nicht visuelle Programme wie Suchmaschinen oder Screenreader ja problemlos noch Zusammenhänge der Informationen erkennen können, und darum geht es ja letztendlich.
Auch nach sämtlichen Accessibility Guidelines ist diese Technik zulässig, so lange man Datentabellen ordentlich kennzeichnet (z.B. mit Table Headern) und keine Zusammenhänge flöten gehen.

Im groben stimme ich deinen Ausführungen zu. Allerdings ist die Aussage dass du mit einer kleinen Layouttabelle weniger Code bzw schnellere Ladezeiten hast, meiner Meinung nach nicht ganz korrekt. Wenn man nur die Startseite einer Website betrachtet, mag das stimmen, aber wenn dies geschehen ist, liegt das Stylesheet bereits im Cache und muss für weitere Unterseiten nicht neu geladen werden. Und mal im Ernst, für ein drei Spalten Layout, von dem wir ja hier grad reden, benötigt man jetzt auch nicht gerade übermäßig viel Hacks oder dergleichen. Aber wie dem auch sei, das ist alles nur Kleinkram der eigentlich weniger von Belang sondern eher Geschmacksache ist und ist auch keine großartige Diskussion wert.

Na ja, aber um es nochmal zu sagen: Meine Aussage oben bezog sich eher auf so Modelle wie eine 10-Punkt Navigation in einer 10-spaltigen Tabelle zu verpacken.

@Peter: Screenreader können mit Tabellen umgehen. Ich habe auch nichts gegenteiliges behauptet, nur das ein CSS Layout von Vorteil ist. Der Stand der Browser und das Know-how der Entwickler sind soweit fortgeschritten in den letzten Jahren, das ein Rückgriff auf Tabellenlayout einem Rückschritt in Sachen Webentwicklung gleich kommen würde.

Formulare benötigen nun wirklich überhaupt keine Tabellen, dafür sind die entsprechenden Elemente vorhanden (fieldset legend, label etc.). Natürlich ergibt eine einfache Tabelle im vergleich zu einem Div Gewussel mehr Quellcode. Aber was ist das bitte für ein Vergleich??? Wenn eine einfache Tabelle den Inhalt präsentieren kann, benötigt man dafür auch kein Div-Gewussel, sondern allenfalls nur ein paar Zeilen. Ein aufäwndiges Design ist nicht mit ein paar Tabellen realisiert. Der Aufwand der dann mit Tabellen betrieben werden muss, erzeugt definitiv mehr Quellcode als der sinnvolle Einsatz von CSS und (X)HTML.

Schnell und einfach erstellen (erlernen) können? Wer sagt das dies der Fall sein soll? Sicherlich ist es erstrebenswert, schnell viel zu lernen. Natürlich kann man Webdesign oder Webentwicklung, je nach dem wie man es titulieren möchte, an Schüler vermitteln. Aber wer sagt das es einfach ist? Einfache Projekte können sicherlich schneller und unkomplizierter erstellt werden und mit Tabellen und WYSIWUG Editoren geht dies natürlich noch einfacher dem Anfänger zu vermitteln. Warum? Weil weniger Grundkenntnisse dazu gehören! Die hochwertigen und qualitativ guten Arbeiten im Web, werden zum Grossteil von Leuten erstellt, die jahrelange Erfahrung vorweisen können. Es fällt hier ebenso wenig ein Meister vom Himmel, wie in allen anderen Bereichen des Alltags.

Ich würde auch sagen "Tabellenfreie Layouts sind besser."
So ein Quelltext ist einfach übersichtlicher.
Die eingesparten KBs hole ich durch meine ausufernden CSS-Dateien locker wieder rein, dadurch geht mir auch das endlose Suchen nach Fehlern im Quelltext nicht verloren.

Früher hatte ich nach einiger Zeit Probleme meine Tabellenstruktur zu durchschauen, jetzt krieg' ich die Krise wenn ich's mal wieder nicht schaffe die DIVs so auszurichten, wie ich's gern hätte.

Es gibt Dinge die mit CSS2 einfach bei 90% der Besucher nicht gehen. Eine vertikale Zentrierung mit CSS. Theoretisch einfach praktisch machbar, aber schon mal auf einem IE auf MAC gesehen?
Wer weiterhin auch auf Steinzeitbrowsern gut aussehen will muss sich wohl auf Kompromisse einlassen.
Und manche Tricks lassen sich nicht von Tabellen auf Listen oder Divs importieren (colspan, rowspan).

Ich versuche meine Designs auch immer mit so wenigen Divs wie möglich zu erstellen und wenn ich mir dann vorstelle was das an Tabellen gewesen wäre. 50% Arbeit gespart. Aber man muss halt sicherer in CSS und kreativer sein.

Und Formulare schreien einfach zu oft nach einfachen Tabellen.
1. meist tabellarische Daten (Beschriftung, Feld)
2. mit CSS kann man noch keine "TABULATOREN" einfügen die an bestimmten Stellen (z.b. nach 200px von linken Rand) einrasten.

Ich sage dazu:
Jeden das seine, aber wer sich gerne mehr Arbeit macht.

@Scheuert: Tut mir leid, aber die Seite von Frank Hares ist kein gutes Beispiel für die Vorteile von tabellenlosem Design - eher im Gegenteil. Versuche mal, die Seite mit höherem Zoom anzusehen: sie wird völlig unbrauchbar. Nur weil eine Seite tabellenlos gebaut ist und XHML strict verwendet, wird sie eben noch nicht barrierefrei und gut benutzbar.

Mit einer Tabelle würde der Inhalt auch in hohen Zoomstufen lesbar bleiben. Sorry, der Punkt geht an die Tabelle :-)

Selbstverständlich muss man für Formulare keine Tabellen einsetzen, aber man darf, wenn man denn will. Es spricht keine Norm dagegen: weder XHML noch CSS noch irgendein Standard noch die BITV oder die WAI. Auch hier gilt wieder, dass die Tabelle nicht verschachtelt werden darf: eine lineare Tabelle ist erlaubt. Semantisch ist es auch in Ordnung: die linke Spalte dient als Label, ganz so, wie es bei Tabellen auch vorgesehen ist.

Ich erstelle Formulare (meist) ohne Tabellen und halte das auch für richtig, aber nur deswegen, weil ich im Falle eines Redesigns flexibler bin, vor allem, weil meine Seiten praktisch alle via PHP erstellt werden. Je weniger Markup im HTML, desto pflegeleichter. Aber das hat nichts mit Usability oder Barrierefreiheit zu tun - aus dieser Sicht gibt es keine Argumente gegen eine Tabelle. Wer also will, kann eine Tabelle verwenden und verstößt weder gegen Standards, noch baut er Barrieren auf.

@Heikew: wie schon mehrmals beschrieben: mit Tabellen muss man keine Besucher ausschließen, wenn man es richtig macht. Solange man sich nach den Vorgaben der BITV und der WAI richtet, sind Tabellen barrierefrei. Nach meiner Erfahrung ist es eher umgekehrt: sehr elaborierte CSS-Designs schließen oft ziemlich viele Anwender aus und sind darauf auch noch stolz: Zu cool für IE, sage ich nur. Kurioserweise sind mache CSS-Seiten leichter von Blinden zu konsumieren als von Schwersichtigen, weil zwar ein Screenreader berücksichtigt wurde, aber beim Browserzoom alles durcheinander purzelt ...

"Tabellen zu Layoutzwecken sind nicht mehr standardkonform". Ich lese das ziemlich oft. Zu welchem Standard?

Das kenne ich:

* 5.3 Do not use tables for layout unless the table makes sense when linearized. Otherwise, if the table does not make sense, provide an alternative equivalent (which may be a linearized version). [Priority 2]
5.4 If a table is used for layout, do not use any structural markup for the purpose of visual formatting. [Priority 2]

http://www.w3.org/TR/WCAG10-HTML-TECHS/

Also demnach sind Layout-Tabellen nicht generell ausserhalb des Standards. Gibt es irgendwo eine striktere Richtlinie? (Das soll keine rhetorische Frage sein - es würde mich wirklich interessieren, ich finde nämlich nichts anderes bei w3.org).

Mein Fazit:
Ich finde CSS-Design auch besser, aber nur dann, wenn es richtig eingesetzt wird, nämlich mit dem Ziel einer größeren Barrierefreiheit und leichterer Pflegbarkeit. Und wenn im Einzelfall eine Tabelle einfacher umzusetzen ist, nun, dann nehme ich halt eine Tabelle. Im Beispiel von frank-hares.de halte ich eine Tabelle für die sauberste Lösung.

Sehen wir das ganze doch mal logisch: Tabellen hin oder her. Wie soll man es doch auch anders lernen? Die meisten Anfänger, die ihre erste Homepage gestalten wollen möchte einfach nur Zeit sparen. Ein Hobby aufbauen, aber keine Zeit investieren.

Dazu kommen halt noch die schönen Editoren alá FrontPage, oder auch Dreamweaver die doch wirklich nur einladen Tabellen zu benutzen.

Tabellen sind einfach zu Dick aufgetragen, sie werden immer wieder neu geladen - auch die Styleangaben, bzw. Subangaben wie

cellspacing="" cellpadding"" border"" color=""

usw..Nicht wirklich doll für User die noch mit Modem rumsurfen (die gibt es noch!). Ein Stylesheet wird nur einmal geladen und in der Cache gespeichert. Wird es verändert gibt es auch noch F5.

Dann noch das Argument: Schonmal was von Textbrowsern gehört? Mit Tabellen kommen diese Browser garnicht zurecht. Sieht wirklich unschön aus. XHTML/CSS-Lösungen sind in diesem Bereich auch viel besser.

Diese Ausreden, und auch Argumente für das Tabellenlayouten sind für mich einfach nur, wie soll ich sagen..faul. Man möchte nicht zuviel Zeit investieren und sich nicht rumschlagen, wenn man mal ein Problem mit CSS hat. Aber für mich ist das gerade der Reiz am schreiben von XHTML und CSS...Tabellen, ach da nehm ich nen WY..-Editor und fertig.

Und: Immerwieder das Argument, es sieht in allen Browsern gleich aus. Habt ihr schonmal was von Browserweichen gehört? Klar, wieder etwas Zeit die drauf geht für ne "iefix.css". Aber die besteht meistens nur aus wenigen Zeilen, wie z.B. die Breitenangabe. Aber es ist mit CSS eben alles möglich.

Ich verfolge diese allgemeine CSS/ Table diskussion schon seit geruamer Zeit und mein Fazit lautet wie folgt:

Alles im Überfluss ist ungesund ;)
CSS ist modern. Und wohl auch die Zukunft. Allerdings empfinde ich seine Anwendung als weitaus komplizierter als das Erstellen eines (simplen) Tabellenlayouts.

Außerdem wird doch in der Regelalkles kombiniert? Reine Tabellenlayouts gibts doch so gut wie gar nicht.

Übersichtlicher ist der Code von sind CSS Layouts definitiv nicht. Um ein solches Layout nachzuvollziehen muss man immer mit zwei Dateien gleichzeitig hantieren.

Ich weiss nicht, all diese Gründe für ein Tableless Layout - Sie sind irgendwie nicht vollends überzeugend. Eine simple Grundtabelle und dann die Optik mit CSS mach tmeines Erachtens am meisten Sinn.

Die DIv Suppe schmeckt mir noch nicht. Und diese Hacks sind eine Zumutung. Möglicherweis eist CSS noch nicht so weit an die Ergonomie von Grundtabellen heranzukommen.

P.S. hat irgendeiner von euch diese vielbeschworenen "Screenreader" jemals in AKtion erlebt??? Wisst Ihr überhaupt wofür Ihr da optimiert und wie oft so etwas angewand wird?

Es klingt hart aber ich glaube Blinde haben kaum ein Interesse daran eine Seite über Webdesign "screen zu readen". Für Behörden und NAchrichtenseitne ist Css wohl ein Muss aber fürs Hobby und Sonstiges erscheint mir eine CSS/Table Kombination wohl noch am ergenomomischsten.

arg der code wird hier ja gleich umgewandelt

< table>
< tr>
< td>Bild< /td>
< td>Text< /td>
< /tr>
< tr>
< td>Bild< /td>
< td>Text< /td>
< /tr>
< tr>
< td>Bild< /td>
< td>Text< /td>
< /tr>
< tr>
< td>Bild< /td>
< td>Text< /td>
< /tr>
< /table>

Das ganze soll ja auch exakt untereinader stehen, also in dem fall immer links ein bild (eventuell verschieden breit) und rechts daneben text, eine bezeichnung und darunter eine erklärung

das ganze befindet sich in einem fieldset