Wieso keine Tabellen ?

[agetek]

In diesem und in anderen Foren haben Leute gepostet man solle doch keine Tabellen mehr benutzen.

Warum eigentlich nicht?

Und warum benutzten dann www.heise.de, www.slashdot.org,
www.freshmeat.net und selfhtml.teamone.de alle Tabellen?

[Southmedia]

Hallo Agetek,

die Antwort ist eigentlich ganz einfach:
Weil Tabellen nicht dazu da sind visuelle Effekte zu erzielen. Sie sind da um tabellarische Daten korrekt darzustellen, für alles andere gibt es CSS.

Vielleicht sollte die Frage aber auch einfach anders gestellt werden: "Warum CSS?"

Wenn du mehr dazu lesen willst:
https://www.swissolution.ch/keine_tabellen.cfm
https://www.style-sheets.de/guide/grundlagen/warum_css
https://css.fractatulum.net/warum_css.htm
https://www.strohhalm.org/.someon?actio ... &id=205428
https://css-discuss.incutio.com/?page=WhyCss
https://diveintoaccessibility.org/
https://www.camalott.com/~jtpolk/whycss.html
https://www.techieswithcats.com/other/whycss.shtml

Wenn du wirklich tief einsteigen willst in die Materie:
https://www.webwriting.de/css-design/index.php
https://www.css4you.de

Ach ja, die von dir genannten Seiten sind mit Tabellen weil bis vor einiger Zeit wichtiger war überhaupt eine Webseite zu haben, auf Nutzbarkeit oder Barrierefreiheit wurde kaum geachtet. Schau dir stern.de an oder aol.com, die großen Seiten stellen so langsam auch auf CSS um. Die Vorteile liegen klar auf der Hand: Geschwindigkeit, Kostenersparnis, etc...

[Fruetel]

Ich schätze, dass Heise bald auf CSS umsteigen wird, und für Slashdot hatte irgendwer mal eine Beispielrechnung gemacht was die dort an Traffic einsparen könntne, wenn sie sich von dem veralteten Layout trennen würden. War was in der Grössenordnung von mehreren Gigabyte.
Southmedias Links zum Thema möchte ich noch mit folgendem Ergänzen:
Why tables for layout is stupid

Gruss,
Thomas

[agetek]

der code wird mit CSS übersichtlicher und flexibler das stimmt schon.
Aber was mich dabei so arg stört ist, dass die sache sehr sehr unansehlich wird wenn man entweder eine geringe Auflösung hat oder nicht den ganzen Bildschirm für das Browserfenster benutzt. Gerade letzteres könnte bei meiner Seite öfters vorkommen, da man ja die texte einer anderen Nachrichtenquelle neuformuliert zusammenfasst. Da ist es geschickt zwei Fenster offen zu haben.

Für Beispiel hier klicken...

[Southmedia]

Das ist nicht bei allen Seiten so - da hat Michael Charlier bei CSS-Design wohl nicht so genau aufgepasst. Schreib ihm doch mal ne böse Email, er ist eigentlich einer der stärksten Verfechter von CSS-Layouts hier in Deutschland!

Es geht auch anders:

• https://www.stern.de
• https://www.southmedia.de/ - meine eigene Seite

Geniale und absolut hübsche Beispiele für CSS-Layouts findest du zum Beispiel hier:

• https://www.cssvault.com/
• https://www.csszengarden.com/

PS: Hau mal jemand die Programmierer dieses Forums für die besch***ene Implementierung von Listen in den bbcode...

[Jörg]

ich bin zwar auch erst noch am üben mit css-layout (siehe die seite in meiner signatur), aber ich denke auch, flexible breiten sind durchaus ohne überlappende layer möglich ... wenn man die seiten mit verschiedenen fensterauflösungen testet, und entsprechend alle layer mit entsprechenden breitenangaben versieht. das ist in dem angeführten beipiel offensichtlich nicht geschehen

[agetek]

Nein, nein, ich glaube der Code von Michael Charlier ist absolut in Ordnung. Das hat wohl eher das W3C Mist gebaut als die beschlossen haben wie CSS interpretiert werden sollen. Den Browserherstellern kann man mal ausnahmsweise wohl keinen Vorwurf machen, da der Effekt bei allen in ähnlicherweise Auftritt. Allerdings tritt sowas am deutlichsten bei Browsern zutage für die die Seiten nicht optimiert wurden.

Ich benutze fast immer den Opera, aber es kommt schon hin und wieder vor, dass ich eine mit CSS erstellte Seite im IE öffnen muss weil ich sonst den Inhalt nicht lesen kann.

Der Effekt tritt bei nicht fixierten Seiten immer auf! man muss nur das Fenster schmal genug oder die Wörter lang genug machen.



Klar man kann natürlich die Größe feststellen dann taucht der effekt nicht mehr auf ... aber dafür gibt es dann einen unschönen weißen Rand, den man andernfalls sinnvoll mit Skyscrapern hätte nutzen können ))

[Southmedia]

Naja, das ist halt dann die Frage ob man liquid-Layout (also eines dass sich der größe des Browsers anpasst) will. Ich arbeite lieber mit festen Breiten, ist einfacher zu planen und zu basteln, man hat mehr Einfluss auf das Aussehen der Seite.

Jörg und auch Michael hätten (rein technisch gesehen) min-width (Info zu min-width) nutzen können, nur interpretieren das die doofen Browser mal wieder nicht, wie man auf der Infoseite sieht.

Aber mal ehrlich, wer surft schon mit 50 Pixel breitem Fenster Ich mag es auf jeden Fall wenn meine Seiten halb so groß sind wie vergleichbare Tabellenkonstrukte und dann sogar auf nem PDA gescheit funktionieren, optimal sind für Suchmaschinen und sogar semantisch-logisch einiges hergeben (korrekte Reihenfolge der Inhalte und so weiter...).

Also: Nimm CSS, in Zukunft werden die Tabellenlayouts immer mehr verschwinden und Tabellen endlich das tun was sie sollen: tabellarische Daten darstellen.

[Jörg]

@agetek

wenn du opera benutzt, und die fenster so schmal stellen musst, kannst du auch auf benutzer modus umschalten oder noch besser den small screen view (shift+f11) verwenden

@southmedia

ja, der ie kann kein min-width - aber vielleicht bau ich's noch ein für die browser die's können

[Southmedia]

Oh, gecko und Opera 7 verstehen das ja, sind dann ja fast alle Browser - MSIE ausgenommen. Ich bin nach den Farben gegangen und da sah das überwältigend rot aus Also rein mit min-width... muss ich mir auch merken für zukünftige Sachen. Der IE muss ja auch irgendwann nachziehen, dann passt das.

PS: Ich habe oben die große Grafik entfernt und durch einen Link zu ihr ersetzt, das Forenlayout hat das (aus welchen Gründen auch immer, die Grafik war eigentlich nicht zu breit...) nicht mitgemacht. Nun passts wieder.

[Jörg]

ja, ich hab ja auch die fixe navigationsleiste drin für opera und gecko (das "position:fixed für alle" ist mir zuviel gefrickel, und führt m.e. vom sauberen code wieder weg) - von daher ist es dann auch konsequent, wenn ich für die beiden min-width einsetze

edit: wollte *eben mal kurz* noch das min-width einbauen, aber ist doch nicht so einfach: der navigationslayer überlappt sich dann zwar nicht mehr mit dem hauptlayer, aber da ich ersteren mit position:absolute; left:81% positioniert habe, führt das beim horizontalen scrollen zu dem lustigen effekt, dass der hauptlayer nach links außerhalb des schmalen fensters verschoben wird naja, werd mich ein ander mal drum kümmern, ist schon spät

[toc]

also nachdem ich mich jetzt ein paar tage lang durch diverse dinge gelesen habe, fühle ich mich bekehrt. ich habe CSS bis dato immer nur für schriften genommen, weil es eben die problematik der browser gab/gibt. aber wenn man sich da mal ein gutes konzept macht, is eigentlich alles halb so wild und die tabellenfummlerei hat endlich ein ende

[Matthias]

aber was ist nun mit alten browsern die kein css unterstützen?

[stalker]

in der neuen PAGE ist übrigens nen guter Aritkel über das Thema

[Southmedia]

Matthias, sowas gibts fast nicht. Sogar der uralte Netscape kann ja CSS, wenn auch nur rudimentär. Und selbst wenn, gute Seiten nach Webstandard sind auch ohne Layout gut zu nutzen.