Moin,
Thomas hat ja schon viel dazu gesagt.
Seite sind lauter solche Beispiele, wie ich es nach meinem
jetzigen Kenntnisstand machen würde:
-> http://www.stichpunkt.de/css/bereiche.html
Das ist richtig und das ist auch falsch. Es ist eigentlich viel einfacher, weil Du in die falsche Richtung denkst. Du gehst eine Website falsch an und verstehst es deswegen nicht. Bist aber in gute Gesellschaft damit 
Es ist so: HTML ist für die Semantik, CSS für das Aussehen. Das musst Du verinnerlichen, das ist dann, was Du oft als „Trennung von Inhalt und Layout“ liest.
Semantik ist die Bedeutung des Inhalts. Wenn Du also den HTML-Code schreiben willst, brauchst Du zwangsläufig vorher den Inhalt. Ohne Inhalt kannst Du (eigentlich) keinen HTML-Code schreiben. Verstehst Du? HTML legt die Bedeutung des Inhalts fest. Solange Du noch keinen Inhalt hast, kannst Du aber keine Bedeutung festlegen.
Deswegen sind solche Templates grundlegend erstmal falsch, weil sie eine Semantik aufsetzen zu einem Inhalt, der noch gar nicht bekannt ist. Und Leute, die es nicht besser wissen, ändern diese Templates nicht, wenn sie ihren Inhalt reinschreiben. Dann wird daraus meist eine div-Suppe, wie Thomas das schon geschrieben hat. Diese div-Suppe ist grundsätzlich erstmal um keinen Deut besser als Tabellenlayouts. Es ist im Prinzip das selbe, es werden Tags benutzt, die die Semantik nicht richtig wiedergeben.
Wenn Du also eine Website schreibst, musst Du (eigentlich) erst den Text schreiben. DANN erst darum das semantische Gerüst in HTML bauen. Und erst DANN geht es ans Layout. Wenn Du alles perfekt gemacht hast (wer kann das schon), müsstest Du jetzt im HTML-Code nichts mehr ändern. Tatsächlich aber wird es beim Layouten so sein, dass Du die ein oder andere Änderung in den HTML-Code einbaust, idR indem Du mehrere Elemente, die zusammen formatiert werden sollen, in eine Gruppe zusammenfasst. Das ist dann das . Manche optische Schmankerln lassen sich zudem nur durch div-Suppe realisieren, z.B. ein Rahmen aus verschiedenen Bildern, der sich noch der Größe des Contents anpassen soll. Das wird eine sehr wässrige Suppe, ist aber derzeit der einzige Weg.
- Ist meine Vermutung richtig, dass die Beispiele div-Suppen
sind? Sind schon ca. 5 div-Elemente echt eine div-Suppe?
Als „div-Suppe“ bezeichnet man eigentlich eine Seite, wo der Autor um alles und jedes Tag ein macht, ohne dabei zu berücksichtigen, dass das Tag eine Gruppe definiert. Ein
… ist also völlig überflüssig, weil in der Gruppe nur ein Element steht und das keine Gruppe ist! Viele machen das, weil sie glauben, CSS-Eigenschaften könnten nur auf divs angewendet werden, was natürlich falsch ist. Ein verhält sich zudem hier genauso wie das
, was man mit dem div machen wollte, kann man mit dem ul genauso machen.
- Wie würdet ihr allgemein mehrere Bereiche und besonders Drei
Spalten, Kopf- und Fußleiste, Inhaltspalte flexibel ohne
div-Elemente realisieren?
Vermutlich gar nicht. Es geht ja nicht darum, eine Seitenstruktur ohne divs zu machen, genausowenig wie Tabellen in HTML generell böse sind. Aber man setzt in HTML die Elemente eben dafür ein, wofür sie gedacht sind.
Ein dreispaltiges Layout kann man natürlich sehr wohl auch völlig ohne divs machen, der Header ist ein , eine Sidebar ist vielleicht ein Menü, das ist dann ein
. Je nachdem, was die andere Sidebar ist, findet sich da auch ein Tag für die richtige Bedeutung. Und der MainContent braucht auch kein div. Was dann nur wieder zur Folge hat, dass der Inhalt unter die Sidebars rutscht, sobald diese enden. Aber das kann ja auch gewünscht sein.
- Wenn mit div-Elementen gearbeitet wird, was sollte vermieden
werden und wie setzt man diese Elemente „richtig“ ein?
bedeutet „Gruppe“. Setze es also nur ein, wenn Du mehrere Elemente zu einer logischen Gruppe zusammenfügen willst.
Genauso wie bedeutet „wichtig“ und Du das nur für Textpassagen benutzt, die wichtig sind - keinesfalls nutzt Du das, wenn Du etwas kursiv darstellen willst, denn das Ziel erreichst Du mit CSS, HTML ist dafür nicht da.
Und wenn Du eine Adresse hast, z.B. im Imrpessum, dann bietet sich eben an.
- Als Verbesserung könnte ich mir vorstellen z.B. einen Header
mit
Auf jeden Fall. Ein Header ist ja eine Überschrift. Es als div auszuzeichnen macht es wiederum völlig unwichtig. Eine Suchmaschine oder ein Vorlesebrowser würden das Element als ziemlich unwichtig einstufen. Auch ein id=„header“ macht daraus keine Überschrift.
und Seitenbereiche mit Listen (bei Links,
Bilderliste…) zu machen
Eben. Das Wort sagt es ja schon…eine Bilderliste wird natürlich auch als Liste ausgezeichnet. Wie das dann später aussehen soll, ist ja für HTML erstmal völlig irrelevant.
aber für den mittleren Block und
den Footer würde ich divs nehmen, wie seht ihr das?
Für den MainContent bietet sich deshalb ein an, weil da ja mehrere Elemente drin stehen, die gruppiert werden.
Beim Footer ist sicher die falsche Wahl, denn Du wirst da Text drin haben, also ist in jedem Fall die bessere Wahl. Wenn Du natürlich viel mehr im Footer stehen hast, mehrere Elemente werden dann sicher auch gruppiert. Wenn da aber nur ne ©-Notiz drin steht, ist die beste Wahl. Ist ja schließlich ein Textabsatz und keine Gruppe.
-> http://de.selfhtml.org/html/tabellen/layouts.htm
- Das halte ich für den ersten Link für unbrauchbar, aber wie
seht ihr das?
Natürlich Tabellenlayouts sind Krampf. Man vermittelt den Vorlesebrowsern und Suchmaschinen, dass da jetzt tabellarische Daten kommen, was ja absolut nicht der Fall ist. Vorlesebrowser lesen komplexe Tabellenlayouts vor allem völlig falsch vor.
Da die div-Suppe hier so oft erwähnt wird, sollte ein
FAQ-Eintrag dazu gemacht werden 
Eigentlich nicht. Denn nicht zu verstehen, wann man einsetzt, heißt grundsätzlich einmal, dass man den Sinn von HTML schlichtweg nicht evrstanden hat. Da ist dann mehr Arbeit nötig, als man in einem FAQ-Eintrag schreiben kann. Da kann ich dann nur auf FAQ:1161 verweisen, wo ein Link drin steht zu einer HTML-Einführung, die HTML sehr gut erklärt.
Wenn jemand keine Ahnung vom Autofahren hat, dann muss ich ihm nicht erklären, was ein Drehzahlmesser ist. Der braucht da erst noch ganz andere Grundlagen.
Aber ich hoffe, meine ausführliche Erklärung öffnet Dir jetzt die Augen und Du verstehst, was HTML eigentlich ist, dass es gar nichts mit dem Aussehen oder mit Darstellung von Inhalten zu tun hat.
Dann bist Du auf dem richtigen Weg und alles wird auf einmal viel einfacher. Und Du verstehst dann auch, warum ich immer sage, dass man HTML in einer halben Stunde verstehen kann.
Liebe Grüße,
-Efchen
P.S.: (eigentlich) heißt, wenn Du die Vorgehensweise begriffen hast und Inhalt und Layout im Schlaf trennen kannst, dass Du auch anders an eine Website rangehen kannst, weil Du dann ja weißt, worauf es ankommt.