Update unseres Shopsystems (Seite 2)

Hallo Matthias

Ich möchte erstmal auf deinen Code eingehen.

Zum einen würde es reichen eine id zu verwenden für das div Element in der höchsten Ebene.

div#t>div und div#t * div oder div#t>div>div sollten dann auch die unteren Ebenen ansprechen können.

Nur Zahlen sollten in class oder id Attributen nicht erlaubt sein. Du scheinst aber noch nicht viel mit id Attributen gearbeitet zu haben, denn diese sind nur einmal pro Seite erlaubt wenn das Dokument dann valide sein soll.

Zum anderen eine Tabelle die auch inhaltlich einer Tabelle entspricht sollte man auch weiter so aufbauen aus Gründen der Semantik.

Es geht hier an der Stelle nicht um mehr oder weniger Quellcode sondern um die Trennung von Struktur und Design. Also um die Unterstützung der Barrierefreiheit dadurch das das Design ins CSS verlagert wird. Und theorethisch könnte man es schaffen da muss ich dir recht geben ein Tabellenlayout so aufzubauen das das komplette Design in CSS verschoben worden ist.

Nur jetzt eine Seite nur mit div Container statt mit einer Tabelle auf zu bauen ist auch nicht der richtige Schritt meiner Ansicht nach.

Eine Liste sollte dann halt eben auch die HTML Elemente für eine Liste verwenden.

Die Steigerung ist meiner Ansicht nach eine höhere Semantik noch zu erreichen durch die neuen Elemente in HTML5.

Gruß
Jörg

masa8 schrieb:

wenn ich ehrlich bin, sehe ich keinen wirklichen Vorteil vom CSS gegenüber Tabellen.
Wo ist die Einsparung gegeben, wenn die Tabelle sauber per CSS formatiert ist?
Im Idealfall:

xxx

yyy

Vielleicht hab ich da etwas grundlegend nicht verstanden, aber Tabellen verursachen bei richtiger Handhabung weniger Quellcode.
Gruß Matthias

Hallo Matthias,

wo ist denn in Deinem Idealfall bei den Tabellen die CSS-Formatierung? Die kommt doch auch noch dazu und damit benötigst Du mehr Code.
Ich habe ja geschrieben, dass es auf die Seite ankommt und bei dem Shop von Stefan kommt da einiges zusammen.

Gruß
hansen

Dass der Code verringert werden soll, kann ich nicht ganz zustimmen.

Aber:

masa8 schrieb:

Im Idealfall:

xxx

yyy

Wie bekommst du nun die zweite Zelle unter die erste, anstatt neben dran? Bei Kleineren Bildschirmen kann dies vonnöten sein.

Mit divs wäre das kein Problem, aber mit Tabellen...

Deshalb sollte man Tabellen auch nicht für Layouts verwenden.

Raptor schrieb:

Dass der Code verringert werden soll, kann ich nicht ganz zustimmen.

Hallo Flo,

hast Du Dir den Quellcode von Stefans Shop mal angesehen:

[HTML]

[/HTML]
Davon hat jede Menge drin, ebenso solche Relikte aus der Table-Hochära:

[HTML]
NEU
[/HTML]

Selbst wenn Du 2 Tage exzessiv gefeiert hast, reduzierst Du noch diesen Code auf ein Minimumm.

Gruß
hansen

joerg schrieb:

Es geht hier an der Stelle nicht um mehr oder weniger Quellcode sondern um die Trennung von Struktur und Design. Also um die Unterstützung der Barrierefreiheit dadurch das das Design ins CSS verlagert wird. Und theorethisch könnte man es schaffen da muss ich dir recht geben ein Tabellenlayout so aufzubauen das das komplette Design in CSS verschoben worden ist.

Hallo Jörg,

genau das meinte ich, wenn ich die Tabellen-Elemente in der CSS sauber definiere, habe ich die Trennung von Inhalt und Design.

Für die Trennung muss ich sowohl die HTML-Elemente, wie auch die DIV\'s, in der CSS definieren.

Meiner Meinung nach kommen Tabellen bei der Byte-Zählerei einfach besser weg.

hansen schrieb:

Hallo Matthias,

wo ist denn in Deinem Idealfall bei den Tabellen die CSS-Formatierung? Die kommt doch auch noch dazu und damit benötigst Du mehr Code.

Hallo Hannelore,

das mehr an Code gibt es sowohl wenn ich Tabellen in der CSS definiere, als auch, wenn ich mit DIV\'s verwende.

Vermutlich wird die CSS, bei der Verwendung von ID\'s, etwas weniger Bytes aufweisen, doch das dürfte marginal sein.

Raptor schrieb:

Wie bekommst du nun die zweite Zelle unter die erste, anstatt neben dran? Bei Kleineren Bildschirmen kann dies vonnöten sein.

Hallo Flo,

.table {width: 100px;} (kleiner als 199 px)
.td {width: 100px;}

und schwupps sind die Zeilen untereinander. Doch darum geht es doch garnicht. Es funktiniert beides, wenn man will, und die Möglichkeiten nutzt.

Hier noch ein paar Gedanken zu Byte-Sparerei:

www.alles-mit-links.de/index.php/2011/06/mit-bits-und-bytes-den-datentransfer-eingrenzen/

Habe die letzte Analyse kopiert, und warte nun bis nach dem Update... Mal sehen was sich alles ändert!

Ich bin mit dem Shopsystem eigentlich zufrieden, und auch die Anbindung an google finde ich ok...

Habe schon einige Systeme getestet, und das von HE ist für mich momentan die beste Wahl!

Deshalb kann ich auch so manche Aussagen nicht ganz verstehen (Es schadet dem guten Ton in einem Forum)und ist völlig überflüssig...

Gruß, Stefan

Hallo Matthias,

masa8 schrieb:

Doch darum geht es doch gar nicht. Es funktioniert beides, wenn man will, und die Möglichkeiten nutzt.

funktionieren tut Beides, das ist richtig und wurde zumindest von mir auch gar nicht angezweifelt. Es gibt auch noch genügend Seiten, die mit dieser Methode hervorragend im Web platziert sind.

Aber Dein Eingangsbeispiel als Gegenüberstellung zu div (bitte korrigiere mich, aber Dein Table-Beispiel sind 2 Zeilen), ist unvollständig.

masa8 schrieb:

xxx

yyy

Alle nachfolgenden Beiträge ignorierend müsste doch Dein Vergleich
so aussehen:

xxx

yyy

Dem gegenüber div (auch 2 Zeilen):

xxx

yyy

oder

xxx

yyy

Oder übersehe ich auf die Schnelle etwas?

Gruß
hansen

Hallo Matthias

Was die Struktur einer Seite angeht.

Du verpackst deinen Inhalt in jedem Fall in eine Struktur.

Tabellenlayout: Eigentlich hat eine Tabelle eine semantische Funktion.

Div Container: Sind grundsätzlich ohne semantische Funnktionen. Man erreicht halt eben mit Zusatzangaben in id oder class Attributen etwas Semantik wenn man es geschickt anstellt.

Neue Elemente in HTML5 besitzen dann wieder eine semantische Funktion.

An der Stelle hört für mich aber die Byte Zählerei auf. Wenn ich eine bessere Struktur erreichen kann nehme ich auch ein paar Bytes mehr mit.

Weihnachtsgeschenke verpackt man in der Regel ja auch nicht in Butterbrotpapier.

Gruß
Jörg