Wie Layoutet Ihr? Tabellen / Div-Tags?

[Jeena Paradies]

Hallo,

was ist das für ein unterschied: 1000 Zeilen in der Html datei mit 50 Zeilen im CSS File oder 50 Zeilen in der HTML-Datei mit 1000 Zeilen im CSS File? KEINEN!

Dass das CSS nur ein einziges mal geladen wird wohingegen das HTML jedes mal?

Denn mit CSS kann man auch "zu viel" definieren!

Ja.

<table>
<tr>
  <td>
    <h1>Eine Überschrift</h1>
    <p>Etwas Text</p>
// WIESO DAS? Wenn der td richtig definiert ist (Schrift, farbe usw (in verbindung mit .table, .body) braucht es den P-Tag nicht, finde ich eh einen sch**** Tag, da er viel arbeit mit sich bringt aber kaum was nützt! Um H1 kommst aber so oder so nicht herum (suchmaschinenfreundlichkeit!)
  </td>
</tr>
</table>

Ähm direktvergleich:

<table>
 <tr>
  <td>
   <h1>Eine Überschrift</h1>
   Etwas Text
  </td>
 </tr>
</table>

Ich zähle 88 Zeichen für die Tabellenlösung

<h1>Eine Überschrift</h1>
<p>Etwas Text</p>

Ich zähle 44 Zeichen für die "Sauberes Markup"-Lösung, also hat man dem User schon mal 50% des Downloads gespaart.

3. Hast du ein konkretes Bsp. für ein Layout nur via css, würde mich sehr interessieren wie ihr bilder, navigation usw ausrichtet ohne 1000 Zeilen CSS schreiben zu müssen! Thx

http://jeenaparadies.net/ sind 248 Zeilen CSS, diese werden auf über 200 Seiten benutzt nachdem sie ein einziges mal heruntergeladen wurden.

4. Grundsatz des semantisches Markup stimme ich absolut zu, nur beinhalten gewisse Element viele Nachteile

Konkret welche? Ich hatte noch nie wirklich Probleme mit Markup.

(meist nur durch Überdimensionierte CSS-Scripts zu lösen), und solange jeder sofort weiss um was es geht, no Problem, siehe dazu auch bsp. ganz unten.

CSS hat nun mal den sehr großen Vorteil, dass bei einem Redesign (theoretisch) nur eine einzelne CSS Datei bearbeitet werden muss um das Design komplett umzubauen (prominentestes Beispiel). Bei einem mit Tabellen umgesetzten Layout muss man, falls man die linke spalte nach rechts haben möchte alle (wie bei mir oben über 200) Dateien bearbeiten. Und nein, es ist kein Argument anzumerken, dass heutzutage alle Seiten per CMS zentral generiert werden.

// Arbeite sehr viel mit Smarty und PHP (darum auch HTMl-Layout), hatte noch NIE Probleme deswegen, musst nur sauber und strukturiert arbeiten / programmieren (-; (was auch schnell geht)

Nein hier wiederspreche ich energisch. Ich arbeite mit einer Firma zusammen, die vor mir einen Tabellenlayoutdesigner hatte. Der Meinung der Entwickler dort sparen sie sehr viel Zeit und dadurch Geld, dass keine tausendfach verschachtelten Tabellen über mehrere dutzend einzelne Templatedateien richtig zusammengesetzt werden müssen. (weitere Informationen zu diesem Thema)

// Sauber= W3c und CSS konform, und gut lesbar (siehe 6)

W3C konform, was bedeutet das? In   wird konkret davon gesprochen dass Tabellen nicht zum Layouten misbraucht werden sollten:
--------------
Tables should not be used purely as a means to layout document content as this may present problems when rendering to non-visual media. Additionally, when used with graphics, these tables may force users to scroll horizontally to view a table designed on a system with a larger display. To minimize these problems, authors should use style sheets to control layout rather than tables.
--------------

Und ein konkretes Gegenbeispiel zu "gut lesbar" hast du ja gerade in deinem Beispiel aufgezeigt, da blickt nämlich - außer vielleicht dir - niemand durch. Schau mal in den Quellcode meiner Seite, dieser wird zwar automatisch generiert ist dennoch durchaus lesbar und nachvollziehbar für jeden der ein bischen HTML kennt.

10)Optimierung auf Handheld usw:
Via Browser-Grösse-Checker (JS oder PHP), ich frage z.b. die Grösse des Browseres ab und je nach dem wird ein anderes css angezogen.

JS kann aus sein, bzw. gar nicht unterstützt werden und dieses PHP-Ding, naja ich bitte dich, das ist doch keine Alternative, was machst du mit den Browsern die du nicht kennst?

a) die Tabellen-Breite usw oder TD-Breite ist je nach Auflösung anders,

Ja genauso wie bei einer CSS Lösung, hier gibt es also noch keinen Vorteil.

somit sind sie immer neben einander.

Ähm das ist doch gerade der Nachteil von dem ich sprach. Auf einem schmalen Display zwei Spalten Text zu quetschen ist einfach nicht schön, weil dann mindestens eine Spalte viel zu dünn wird und pro Zeile nur ein Wort zulässt. Das gleiche gilt für den Druck.

(Schriftgrösse usw passt sich ja auch an, siehe 10)

Ja genau wie bei einem CSS Layout, also auch hier kein Vorteil

b) grosse Bilder, welche mit der Funkt. nichts zu tun haben (also reiner schnigg schnagg, lasse ich weg

Ja genau so wie bei einem CSS Layout, also auch hier kein Vorteil,

Oh ähm schon schluss? Ok dann haben wir einen Nachteil und keine Vorteile für die Tabellenlayoutlösung, hm.

c) Thematik Bilder finde ich wesentlich problematischer,da eine dynamisierung ohne verluste nicht geht.

Bei mir funktioniert img { max-width: 90%; } prima, bis auf den IE.

Hier noch kurz ein bsp. für ein übersichtliches und sauberes layout:

[Schrekliches Beispiel entfernt]

Mensch da haste ja was wirklich sinnloses hingelegt. Die ganze Tabelle nur für Layout und dann kommt noch das ganze CSS dazu. Alles noch völlig ohne Inhalt und schon so megagroß und mega unübersichtlich.

Grüße
Jeena Paradies