Langsam wird es hier mal wieder Zeit für ein neues Design. Zwei Probleme stellen sich mir.
Erstens habe ich meine kreative Phase hinter mir gelassen und mir will nichts geniales einfallen.
Zweitens kann man ja im Prinzip nur noch mit einem locker-leichten CSS-Design Eindruck machen. Tabellen sind so Nineties. Leider bin ich mit meinem HTML-Wissen knapp vor dem Jahr 2000 stehen geblieben. Und auf das Umlernen meiner gesammelten Table-Hacks in CSS-Hacks hab ich garkeinen Bock.
Für die Grundlagen:
http://www.freimark.de/referenzen/2001-drweb2.html
bzw.
http://www.freimark.de/referenzen/2001-drweb2-text.html
omg. dr.web is nun wirklich das letzte, was ich in diesem fall empfehlen würde. mein tipp: mal die weblog-landschaft durchforsten und nach ein paar netten CSS-Sites Ausschau halten. Gibt da paar ganz gute.
Ich habe den oben verlinkten Artikel für das 2. Dr. Web-Buch geschrieben.
Stefan der erste:
Es wäre sinniger gewesen, im obigen Artikel zu betonen, daß CSS ohne HTML auch nix ist.
<div class=”ueberschrift”>test<div> sagt überhaupt nichts über den Inhalt des Elements aus. Auf den semantischen Wert von HTML-Elementen wie zum Beispiel <h1> zu verzichten ist da irgendwie dämlich.
Mist. Dadurch, daß ich HTML angebe, zerstöre ich das ganze Layout und die Beispiele werden nicht angezeigt. Flo – kannst Du die spitzen Klammern durch Entities ersetzen?
@ Tim: Ja, der Artikel ist nicht perfekt, ich weiß.
:-)
Man soll <h1> auch nicht durch <div class=”ueberschrift”>test</div> ersetzen, das habe ich auch nie behauptet, auch nicht im o.g. Artikel. Das wäre genauso sinnlos wie, leider nach wie vor verwendete, <font>-Orgien.
Eine einzige Ausnahme erlaube ich mir in meinem Weblog (my-two-cents.de), wenn ich eine längere Passage zitiere, da verwende ich DIV, weil CITE keinen eigenen Block bildet.
In dem Artikel geht’s darum, Layout mit blinden Tabellen durch Layout mit DIV-Layern zu ersetzen.
@Tim: weil du es bist ;-)
So ein paar divs krieg ich ja hin, das ist ja auch nicht das Problem. Das Problem sind diese Massen an Browser-Hacks, unterschiedliche Box-Models, etc.
Als ich dieses Layout entworfen hab, hatte ich auch versucht alles per CSS zu machen, aber irgendwann hab ich aufgegeben.
Zudem denke ich beim Designen komplett in Tabellen. Das ist so in mein Hirn gebrannt ;)
@Flo:
Box-Model ist eigentlich kein Problem mehr. Sogar der IE auf Windows schafft das jetzt.
Das Denken in Strukturen ist da schon etwas schwieriger. Mir hat bei dem Wandel diese Vorgehensweise geholfen:
Man schreibt erst eine Beispielseite nur mit semantische Auszeichnung in HTMl, überhaupt keine visuelle Formatierung. Dann erstellt man iterativ die Formatierung in CSS und ab und an, wenn es unbedingt benötigt wird, steckt man einzelne Bereiche in ein semantikloses
<div>, um diese gesammelt formatieren zu können.@Stefan:
Das
<cite>-Element ist auch nicht zur Auszeichnung von Zitaten zuständig, sondern zur Auszeichnung der Quelle eines Zitates.Beispiel: “Wie
<cite>Helmut Kohl</cite>sagte…”Zum Auszeichnen von Zitaten ist in HTML für kleinere Zitate im Fließtext
<q>, als eigenes Blockelement<blockquote>zuständig. Deswegen verstehe ich nicht, weswegen Du da ein semantikloses<div>verwendest. All dessen visuelle Eigenschaften kann man mittels CSS problemlos einem anderen HTML-Element zuweisen, wie eben auch<blockquote>.(Diesmal mit ganz viel HTML und Entities gearbeitet. Ich hoffe, es klappt. :-)
@ Tim: Sorry, ich meinte CITE. Freudscher Versprecher.
Aber das mit BLOCKQUOTE war mir nicht bewusst, werde mich nochmal damit befassen.
@stefan (der erste) wenn du jedes cite als block haben willst, dann nimm ein display: block hinein, dann wirds ein block (siehe fischergrube.de)
@flo: ich schick dir mal eine CSS-Link-Sammlung mit mehr als nur Referenzen und Regeln… es gibt einige Seiten, die Layouts anbieten, du brauchst dann nur noch deine Formatierung einfügen…