• Alles valide oder was? von Dirk Jesse

Es ist eine gute Idee, HTML und auch CSS zu validieren. Besonders beim Lernen von HTML ist es eine große Hilfe und gut geeignet, um grobe Grammatik- und auch Flüchtigkeitsfehler zu finden, nach denen man später sonst stundenlang sucht. Aber ein Validator ist kein Selbstzweck:

Eine Validitätsprüfung ist eine automatische Grammatik- und Rechtschreibprüfung für HTML- und CSS-Code auf Basis eines definierten Wortschatzes.

 Dieser Vergleich trifft die Sache sehr gut. Der Rest steht in Dirks Beitrag.

TYPOlight hat ab der V2.9 übrigens einen neuen Namen und wird Contao heißen. Mehr dazu demnächst in diesem Theater, denn neben dem neuen Namen wird es einige phantastische neue Features geben. Great things ahead... 

Auf dem Usertreffen gab's übrigens eine Twitter-Wall. Hier ein kleiner Ausschnitt: 

• Tweets zu "TYPOlight und CSS" - #tlut10 css 

Looks as if they had fun, too ;-) 

• Keine Deklaration » Vererbung oder Standardwert 
  Findet der Browser überhaupt keine Deklaration, prüft er, ob die Eigenschaft vererbbar ist und schaut dann in den Vorfahrenelementen. Wird auch nichts vererbt, nimmt er den Standardwert.
• Eine Deklaration » Fertig 
  Findet der Browser genau eine Deklaration, gestaltet er das Element damit.
  
• Mehrere Deklarationen » Kaskade 
  Findet der Browser mehrere Deklarationen, werden diese zuerst nach Wichtigkeit (!important), dann nach Spezifität (Typ, Klasse, ID, Inline) und zum Schluß nach Reihenfolge sortiert, bis ein eindeutiger Gewinner feststeht. 

Die folgende Grafik visualisiert diesen Prozess und zeigt den "Browser auf der Suche nach einem Wert" für eine bestimmte Eigenschaft zur Gestaltung des HTML-Elements ist.

Mehr zu diesem Thema finden Sie in Kapitel 11 "Die Kaskade".  

• TerraShop: Little Boxes Teil 0 für 4,95 Euro

Wenn Sie also mit dem Gedanken gespielt haben, "Teil 0" zu lesen oder zu verschenken, ist das DIE Gelegenheit. Billiger wird's nicht und "op = op", wie man hier in den Niederlanden sagt. Wenn's alle ist, ist es alle.

Die Restauflage wird abverkauft, eine neue Auflage ist nicht geplant und "Little Boxes" wird damit wieder zu dem, was es ursprünglich einmal war: ein kompakter Crashkurs zu HTML und CSS.

Dem Internet Explorer reicht dies bis zur Version 6 natürlich nicht aus und um Lesern eine ausführliche Suche nach den Ursachen zu ersparen, habe ich in der Online-Version einen TIPP-Kasten hinzugefügt, der dies verdeutlicht: 

Das im Beispiel relativ positionierte #wrapper benötigt im IE6 noch hasLayout, damit die Werte für top, right, bottom und left korrekt berechnet werden. Das könnte z. B. so gehen: 

* html #wrapper { height: 1px; } 

Statt Sternchen-Hack kann man diesen Style natürlich auch per Conditional Comment in einem speziellen Stylesheet ausliefern. 

• Generische Layoutklassen entfernt
  Die CSS-Klassen .hidecol1, .hidecol2 und .hideboth sind generell layoutspezifisch anzupassen und gehören daher in das Nutzer-CSS. Das neue Layoutbeispiel "dynamic_layout_switching" demonstriert die Anwendung.

In dem Layout-Beispiel befinden Sich die Klassen in Stylesheet basemod_dynamic_layout_switching.css:

.hideboth #col3 { margin-left: 0; margin-right: 0; }
.hideboth #col3_content{ padding-left: 20px; padding-right: 20px; }

.hidecol1 #col3 { margin-left: 0; margin-right: 25%; }
.hidecol1 #col3_content{ padding-left: 20px; }

.hidecol2 #col3 { margin-left: 25%; margin-right: 0; }
.hidecol2 #col3_content{ padding-right: 20px; }

.hideboth #col1, .hideboth #col2, .hidecol1 #col1, .hidecol2 #col2 { display:none; }

Einfach rauskopieren, in irgendeinem Stylesheet (z. B. basemod*.css) einbauen und schon geht es wieder. wie beschrieben.

Webdesigner wie Jeff Starr oder Andy Ford haben sich der Clearfix-Methode angenommen und sie soweit entrümpelt, dass insbesondere der zweite Teil mit den Patches zu den Internet Explorern etwas einfacher wird.

Insgesamt sieht die Clearfix-Methode ohne Unterstützung des IE5/Mac jetzt so aus:

/* Der Kern von Clearfix */
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  font-size: 0;
  height: 0;
  visibility: hidden;
}

/* IE-Patch für IE 7*/
*:first-child+html .clearfix { min-height: 0; }

/* IE-Patch für IE 6*/
* html .clearfix { height: 1%; }

Zu den IE-Patches gibt es noch einige Alternativen wie zoom: 1, die ich in "Teil 2: Patches für diverse Internet Explorer" noch etwas näher erläutert habe. Die Beispieldatei in der Online-Version wurde aktualisiert.

• Website-Baukästen: der schnelle Weg zur eigenen Website

In dem Artikel geht es zunächst darum, für wen ein solcher Baukasten in Frage kommt, wobei die Zielgruppe alle sind, "die eine Website brauchen und denen die Kombination aus wenig Webwissen und begrenztem Budget bekannt vorkommt". Danach geht es weiter mit einer kurzen Erklärung das Baukästen ein "gehostetes CMS" sind, bevor vier Vertreter kurz vorgestellt werden:

• Webnode.com (Kurzvorstellung im Artikel)
• Jimdo.com (Kurzvorstellung im Artikel)

Weiterhin werden die 1&1 Branchen-Homepage (Kurzvorstellung) und Edicy.com (Kurzvorstellung) beschrieben und einige Links zu weiteren, englischsprachigen Baukästen gelistet.

Fazit: Moderne Website-Baukästen haben sicherlich ihre Grenzen, aber für viele kleine und mittelgroße Websites sind sie auf jeden Fall eine Option. Da wächst eine echte Alternative zur manuellen Erstellung kleiner Websites heran.

In der Dokumentation zum TYPOlight-Modul "Tags" hat der Entwickler Helmut Schottmüller unter der Überschrift "Ausgabe von Auszeichnungslisten zu Nachrichtenbeiträgen" alles zusammen getragen, was man dazu machen muss:

• Aktivierung der Ausgabe der Auszeichnungen ("Tags") in den Frontend-Modulen
• Anpassung der Templates mit dem auf der Seite gezeigten Beispielcode

Vielen Dank an den Helmut für das Modul und die hervorragende Dokumentation.

• Little Boxes direkt bei Markt + Technik bestellen

Ohne Registrierung, versandkostenfrei (in D, A, CH) und auf Rechnung. Einfacher geht's nicht.

Ein HTML-Element besteht aus Anfangs-Tag, Inhalt und Ende-Tag

Ein HTML-Element besteht aus drei Teilen. Im Beispiel sind das:

• der Anfangs-Tag in spitzen Klammern: <p>
• der Inhalt: Dieser Text ist ein Absatz.
• der Ende-Tag ebenfalls in spitzen Klammern: </p>

Alle drei Teile zusammen heißen HTML-Element und werden im Browserfenster als rechteckige Kästchen dargestellt. Alle Texte und Grafiken einer Webseite liegen in solchen Kästchen. Ohne Ausnahme. Man könnte es auch "Container" nennen. Auf Englisch heißt es "Box".

Quelle: Little Boxes 1, Seite 53

Fortgeschrittene CSS-Techniken
Corina Rudel und Ingo Chao
Galileo Press
2., aktualisierte und erweiterte Auflage (Oktober 2009)
436 Seiten · EUR 39,90
ISBN-10: 3836214261 · ISBN-13: 978-3836214261

Buch bei Amazon

Gerald Brozek schreibt in seinem Blog hyperkontext.at ausführliche, gründliche und oft sehr treffende Rezensionen zu diversen Büchern. Unterem anderem auch zu:

• Buchrezension: Fortgeschrittene CSS-Techniken (auf hyperkontext.at)

Sein Fazit: "Das Buch eignet sich weder für unerfahrene Anfänger, noch als entspannende Abendlektüre nach einem anstrengenden Tag", ist aber Pflichtlektüre für Profis.

Wer also nach "Little Boxes 2" noch Wissensdurst verspürt, der sollte sich das Buch vielleicht mal anschauen. Eine kleine Anmerkung noch: Die Informationsdichte in "Fortgeschrittene CSS-Techniken" ist ziemlich hoch und die Lesbarkeit leidet darunter ein bisschen. Wie Gerald schreibt:

Keine Höhepunkte und nicht mal eine humorvolle Einflechtung lockert diese fundierte Lektüre leidlich auf. Diese Kunst vermisse ich hier [...] Meine Stilbeschreibung soll die hervorragende fachliche Aufbereitung allerdings nicht schmälern, denn so viel gebundene CSS-Kompetenz findet sich selten.

Stimmt.

Eine weitere Rezension finden Sie bei Jens Grochtdreis:

• Rezension: Fortgeschrittene CSS-Techniken (auf blog.grochtdreis.de)

Transcending CSS
Andy Clarke
Addison Wesley (April 2009) · 372 Seiten · EUR 29,95
ISBN-10: 3827328381 · ISBN-13: 978-3827328380
Buch bei Amazon

Der erste Eindruck

Ich habe auf infotekten.de vor ein paar Jahren mal eine Notiz mit der überschrift Graphic Designers just don't get it! geschrieben, in der erklärt wurde, warum Grafikdesigner oft keine besonders guten Webseiten bauen. Tja, für mindestens einen trifft das nicht zu.

Andy Clarke von Stuff & Nonsense (aka "Malarkey") ist ein britischer Designer, ein durch und durch visuell denkender Mensch, aber er hat sich auf "die andere Seite" begeben, das Medizinrad durchquert und aufgrund seiner Erfahrungen ein Buch geschrieben, dass die Kluft zwischen visuellen Designern und technischen Entwicklern mühelos überbrücken dürfte.

Man merkt dem Buch die Designerherkunft des Autoren an. Das fast quadratische Format (22,8 x 22,6cm) lässt es bereits äußerlich ungewöhnlich erscheinen und dieser Eindruck setzt sich auch im Inneren fort. Sowohl bei der wunderschönen Gestaltung (das Buch dürfte auch CSS-Laien zum bloßen Blättern animieren) als auch beim Inhalt, der aus vier Teilen besteht:

1. Entdeckung (des inhaltsbezogenen Umgangs mit Markup)
2. Designprozess (Prototypen erstellen)
3. Inspiration (Rasterlayouts und ungewöhnliche Quellen)
4. Transzendenz (Konkrete Beispiele für Schritt 1 bis 3)

Teil 1: Entdeckung des inhaltsbezogenen Designs

Der erste, rund 100 Seiten lange Teil beginnt mit einer "Einführung in Transcendent CSS" und stellt anschließend sieben Richtlinien vor (z. B. "Nicht alle Browser sehen das gleiche Design", "Nutzen Sie alle verfügbaren CSS Selektoren" oder "Nutzen Sie semantische Namenskonventionen und Mikroformate"). Diese Einleitung fand ich manchmal etwas langatmig und konstruiert. Richtig gepackt hat mich erst Seite 53, auf der Clarke die vier Teile des Buches kurz vorstellt und erklärt, was er unter inhaltsbezogenem Design versteht:

Wenn Sie ein Dokument schreiben, sollten Sie auf jeden Fall zuerst nur strukturelle Elemente wie überschriften, Absätze, Listen und Zitate verwenden.

Wow. So sprechen nicht viele Grafikdesigner. Und er bringt Beispiele dafür, dass die Reihenfolge des Quelltextes nicht unbedingt identisch ist mit der Reihenfolge im sichtbaren Dokument, erzählt über Markup und Semantik, demonstriert anhand von einfachen Quizaufgaben ala "Welches Markup steckt in diesem Foto?" geeignete Markup-Strukturen, und beendet den ersten Teil des Buches mit dem Motto "Die ganz Welt ist eine Liste".

Teil 2: Designprozess ("Prototyping") - Workflow und interaktive Prototypen

In diesem Teil geht es um einen geeigneten Workflow und die Erstellung von Prototypen. Clarke schlägt einen inhaltsbezogenen Prozess vor:

1. Inhalte sammeln
2. Wireframes entwerfen (Diagramme)
3. Statische Designs (in Photoshop)
4. Aussagekräftiges Markup schreiben
5. Design mit CSS umsetzen

Clarke schlägt die Erstellung von interaktiven Prototypen aus XHTML und CSS vor, was er auf den letzten 40 Seiten von Teil 2 an einer Site namens "Cookr!" demonstriert. Dabei zeigt er einige sehr kreative Möglichkeiten der Anwendung von Kombinationen aus Listen, überschriften zusammen mit absoluter Positionierung. Gutes Markup, kreatives CSS, und es sieht alles auch noch gut aus, denn der Mann ist wirklich ein begnadeter Grafiker.

Teil 3: Inspiration - Rasterlayouts und ungewöhnliche Quellen

Im ersten Abschnitt von Teil 3 lernt der Leser wichtige gestalterische Grundlagen wie Rasterlayouts ("Grids") und Goldener Schnitt, sowie viele Beispiele, wie man diese Techniken im Web einsetzen kann. Zum Beispiel wird ein 770px breites Layout durch den goldenen Schnitt in einen 475px breiten Inhaltsteil und einen 295px breite Sidebar unterteilt, und es sieht bei ihm einfach stimmig aus.

Zum Abschluß von Teil 3 wird gezeigt, wie man zu ungewöhnlichen Ideen kommt: Moodboards, Scrapbooks, Perspektiven verändern und generell die Welt mit offenen Augen betrachten. Teilweise banal, aber nicht uninteressant.

Teil 4: Transzendenz - Altogether now ...

Der erste Abschnitt von Teil 4 ist für mich der interessanteste Teil des Buches. Clarke zeigt anhand von fünf Beispielen, wie man mit den im Buch angeregten Techniken konkret arbeiten kann. Genial, was der Mann mit Listen macht. Kaum zu glauben, dass hinter den Beispielen dieselben Lsten, Absätze und CSS-Eigenschaften stehen, die ich seit Jahren kenne und benutze. Das Buch endet mit einem Ausblick auf CSS3 und kommenden Techniken wie dem ALM-CSS (Advanced Layout Modul).

Fazit

"Transcending CSS" ist kein Buch zum Lernen von CSS. In dem bereits 2007 erschienenen Buch kümmert sich der Autor überhaupt nicht um Browserkompatibilität und andere profane Dinge, die im Alltag wichtig sind. Aber das Buch ist nicht nur eine Augenweide, sondern immer noch eine hervorragende Inspirationsquelle.

Das Buch richtet sich gleichermaßen an Grafikdesigner und Entwickler oder Infotekten und überbrückt scheinbar mühelos die paar Kilometer Graben, die oft zwischen den beiden Welten liegen.

Anmerkung zur deutschen Übersetzung

Ich kenne nur die erste Auflage, aber da liest die deutsche Version sich mit einigen Ausnahmen recht flüssig. Der englische Untertitel "The Fine Art of Web Desig" wurde im deutschen zu "Neue kreative Spielräume im Webdesign", Der Titel von Teil 2 "Prototyping" heißt auf deutsch "Designprozess", aber am meisten gestört hat mich in Teil 3 die Übersetzung von "Grid-Layout" mit "Gitter-Layout". Ich bin zwar kein Grafikdesigner, aber ich glaube der übliche deutsche Begriff heißt "Raster" und nicht "Gitter".

Jetzt gibt es eine Website, die sich intensiv um diese gehosteten Content-Management-Systeme kümmert:

• Das Website-CMS>>Testlabor

Wie der Betreiber R. Brandl auf seiner Site schreibt, entstand die Idee zum CMS-Testlabor aus dem alltäglichen Wunsch eines Kunden heraus, seine Site selbst pflegen zu wollen:

Zuerst dachten wir an ein ausgewachsenes CMS (Joomla), das jedoch jeden Budgetrahmen gesprengt hätte. Letztendlich entschieden wir uns die Seite von Hand zu programmieren. Parallel dazu begannen wir aber zu recherchieren, welche einfachen Systeme es gibt, mit denen Änderungen auch ohne Programmierer möglich sind.

Und so kam es, dass wir uns eine Seite wie das WebsiteCMS>>Testlabor herbeisehnten. Eine Seite, auf der wir schnell erkennen können, ob es ein CMS gibt, dass all unseren Ansprüchen hinsichtlich Funktionalität und Preis gerecht wird.

Ich persönlich bin davon überzeugt, dass gehostete Content-Management-Systeme für viele kleine und mittlere Websites eine adäquate Lösung darstellen, und dass alle Webdesigner sich diese Werkzeuge auf jeden Fall einmal näher anschauen sollten.

Feedback der Besucher

Abgesehen von kleinen Verbesserungsvorschlägen zu kaputten Links und eben solchen Sätzen war das Feedback der Besucher fast ausschließlich positiv. Das Relaunch an sich scheint also gelungen zu sein. Nur ein Leser schrieb, dass er "enttäuscht" war, denn er hatte zuerst das Buch gekauft und konnte es dann kostenlos auf der Site lesen. Inzwischen ist er begeistert von der Kombination beider Medien...

Statistik nach vier Wochen

Hier ein kurzer Vergleich der Statistiken vor und nach dem Relaunch. Bei den Zahlen muss man bedenken, dass Google Analytics nur Besucher mit aktiviertem JavaScript zählt, also keine Suchmaschinenrobots und dergleichen. Webalizer z. B. zählt alles und liegt demzufolgen wesentlich höher.

Und hier kommt die Übersicht:

Die meisten Zahlen haben sich also vervielfacht, und ausgelöst wurde diese Steigerung durch einen einzigen Tweet am 15.10., ein paar kurze Antworten im XHTMLForum mit Links hierher und ein Interview in der Technikwürze.

Topper ist die Zahl der abgerufenen Seiten mit fast 50.000, aber was mich besonders freut ist, dass viele Besucher wirklich lesen: Gut 6 Minuten pro Besuch und 6,15 Seiten ist schon ganz ordentlich. 

Auch in den Traffic Stats von Alexa hat little-boxes.de zugelegt:

• Weltweit von Platz 307.763 auf 242.924
• In Deutschland von 18.844 auf Platz 11.716

Ob und wie sich die kostenlose Online-Version auf die Buchverkäufe ausgewirkt hat, kann ich nicht sagen. Das wird sich in den nächsten Monaten zeigen. Keep on linking...

• Technikwürze Nr. 154

Das Gespräch mit David und mir beginnt nach etwa 19 Minuten und dauert ca. 20 Minuten.

Die v2b-Trainings gibt es bis jetzt überwiegend auf DVD zu einem Preis um die 40 Euro pro Stück, aber seit heute können Sie video2brain auch abonnieren: 

• die Standardvariante mit reiner Online-Verfügbarkeit für 198 Euro pro Jahr.
• die Premiumversion mit zusätzlicher Offline-Nutzbarkeit für 298 Euro pro Jahr.
• Schüler, Studenten, Lehrkräfte und Bildungseinrichtungen erhalten das Standard-Abonnement für 99 Euro pro Jahr.

Dafür haben Sie ein Jahr lang Zugriff auf das Online-Archiv von video2brain. Filme im Wert von ich weiß nicht wieviel tausend Euro, wann immer Sie wollen und wann immer Sie es brauchen.

Details zu dem Angebot gibt es auf der Website von video2brain:

• Das video2brain-Abonnement im Überblick
• Website von video2brain

Für alle, die Videotrainings regelmäßig nutzen, ist das video2brain-Abo denke ich ein ziemlich gutes Angebot. Übers Jahr gerechnet fast so günstig wie schwarz brennen...

Einfach mit der Maus drüber fahren, und schon können Sie die gerade angezeigte Seite...

• per Email empfehlen
• zu einem URL-Kurzdienst wie bit.ly senden
• bei Twitter tweeten
• bei delicious, Mister Wong oder einem anderen Bookmarking-Dienst speichern
• an Facebook, StudiVZ, MySpace oder ein anderes Social Network senden 
• bei Blogger, WordPress oder einem Blog-Dienst bloggen

AddThis hat Schnittstellen zu über 170 verschiedenen Webdiensten, von denen ich zum Teil noch nie was gehört habe, aber schauen Sie sich die Liste einfach mal an: AddThis Service Directory.

UPDATE (22. November 2009)

Da 170 Dienste ein bisschen viel auf einmal ist, habe ich die Liste heute auf die wichtigsten 20 reduziert, die dafür jetzt sofort erscheinen. Falls Sie Ihren Liebling vermissen, einfach kurz Bescheid sagen. Dann baue ich den ein.

UPDATE (5. Januar 2010)

Damit er leichter erreichbar ist, habe ich den AddThis-Empfehlungsbutton im Bereich "Little Boxes 1 online" noch einmal unterhalb der Navigation platziert.

• YAML 3.2 - Schärfung des Profils
  Ausführlicher Artikel zur neuen Version 
• Changelog
  Detaillierte Auflistung aller Änderungen
• Download
  YAML 3.2 und Simple Project 1.07 downloaden

Falls Sie YAML einsetzen und alles läuft nach Zufriedenheit, gibt es wie immer keinen Grund zum Update. Ich bin aber ja berufsbedingt neugierig und habe daher heute den YAML-Core auf V3.2 aktualisiert.

Was zum Teufel wollen die in einem Kontaktformular damit bezwecken? Die kryptischen URLs sind kompletter Unsinn und existieren nicht, aber vielleicht sind das ja nur Testballons.

Für Besucher ist die Kulisse auf den ersten Blick fast unverändert und nach wie vor gelb (#f3c600). Die wesentliche Neuerung besteht darin, dass man "Little Boxes Teil 1" online lesen kann. Komplett. Kostenlos. 

Hinter den Kulissen ist alles neu. Die Site basiert jetzt auf TYPOlight und YAML. WordPress ist nicht mehr dabei, wodurch leider viele alte Blogeinträge und Kommentare verschwunden sind. Für die am meisten gelesenen alten URLs gibt es aber eine Umleitung. 

Irgendwann demnächstens werde ich noch ein bisschen mehr zu der neuen Site schreiben, aber jetzt gehe ich erstmal in Ruhe frühstücken .

Viel Spaß beim Klicken.

P.S.
Falls irgendwas nicht funktioniert oder stimmt, einfach auf das BETA oben im Logo klicken und schreiben.

• "Little Boxes" beim Web Video-Podcast

Momentan sind es ungefähr 8 Filme vorhanden, aber es scheinen immer mal wieder neue hinzuzukommen.

Am Anfang der Filme erscheint immer mein Konterfei, was schon witzig ist, da ich von dem Unterfangen wirklich gar nichts wusste. Immerhin gibt es am Ende die Meldung "mit freundlicher Genehmigung von video2brain", sodass ich mal davon ausgehe, dass das alles seine Richtigkeit hat.

• Litte Boxes Teil 0 - Bookmarks bei Delicious

Viel Spaß beim Klicken ;-)

• Entity Code - A Clear and Quick Reference to HTML Entities Codes

Es fehlen zwar viele sprachliche Sonderzeichen wie &ntilde; (ñ) oder &ccedil; (ç), aber trotzdem ist die Seite sehr übersichtlich gemacht und der Domainname entitycode.com gut zu merken.

Vielen Dank an Jens "Flocke" Grochtdreis, der mir diesen Link in meine Inbox bei delicious.com gelegt hat.

Ein neuer Untertitel

Beginnen wir mit den kleinen Dingen. Auf dem Cover wird ein etwas veränderter Untertitel stehen:

• Little Boxes, Teil 1: Webseiten gestalten mit HTML und CSS. Grundlagen

Die drei Worte "mit HTML und" ist neu. Einige Leser und Rezensenten haben sich über den HTML-Crashkurs am Beginn des Buches gewundert, und deshalb ist das jetzt gleich im Untertitel mit drin.

Inhaltliche Änderungen

Inhaltlich sind viele Erfahrungen aus zwei Jahren Seminaren und Leseranregungen in das Buch eingearbeitet worden. In den ersten drei Abschnitten (Intro, HTML-Crashkurs, CSS-Grundlagen) wurden dabei die vorhandenen Inhalte ergänzt und deutlicher strukturiert. Das Resultat ist ein besserer Lese- und Lernfluss. Little Boxes im Windkanal sozusagen. Weiter hinten im Buch gibt es dann folgende Änderungen:

• Tabellen In der 2007er-Ausgabe werden HTML-Tabellen am Ende von Kapitel 3 zwar kurz erwähnt, tauchen aber bei der CSS-Gestaltung nicht mehr auf. In der neuen Ausgabe ist eine einfache CSS-Gestaltung von HTML-Tabellen mit drin.

• CSS-Positionierung Die Geschichte mit Floaten-und-Clearen bekommt ein eigenes Kapitel, und besonders der Abschnitt über das Clearen ist jetzt ausführlicher und inklusive "Easy Clearing".

• CSS-Layouts Die Entwicklung ist nicht stehen geblieben und vor zwei bis drei Jahren gängige Techniken (wie font-size: 62,5% als Basis für em-Layouts) sind heute nicht mehr aktuell, sodass der Abschnitt zu CSS-Layouts komplett überarbeitet und gerade für Einsteiger logischer und zielgerichteter ist. Im Kapitel zu flexiblen Layouts wird unter anderem das Prinzip der DIV-Dopplung für Inhaltscontainer vorgestellt, was die Sache für spätere eigene Versuche erheblich vereinfacht. Damit wird dann auf der Basis von float und margin ein stabiles, flexibles Layout erstellt.
• Fertige Layouts Es gibt ein neues, kurzes Kapitel "Fertige Layouts", in dem die im Laufe des Buches erstellten Layout-Varianten übersichtlich und fertig einsetzbar zusammengefasst werden. Ergänzt wird diese Übersicht um ein paar externe Quellen für fertige Layouts.

Ausstattung des Buches

Die Seitenzahl ist wegen der neuen Inhalte trotz Straffung an anderen Stellen auf stolze 386 gestiegen und das Buch wird eine verbesserte Ausstattung erhalten, was mit dafür verantwortlich ist, dass der Preis auf 24,95 € steigt:

• Buch-CD Auf Wunsch zahlreicher Leser bekommt das Buch eine CD. Darauf sind die wichtigsten, im Buch vorgestellten Tools, einige Ausschnitte aus den Videotrainings und vor allem die Beispieldateien enthalten. Die Beispieldateien sind kapitelweise geordnet und bestehen für jeden Abschnitt aus den Ordnern "basis" und "fertig", sodass der Leser wirklich an jeder beliebigen Stelle einsteigen kann.
• Faltbare Einlegekarte Die Einlegekarte mit dem Box-Modell wurde erweitert und enthält jetzt eine Kurzreferenz der im Buch vorgestellten HTML-Elemente und CSS-Eigenschaften (mit Seitenzahl). 200g Papier, laminiert, in Farbe, aber gesehen habe ich sie auch noch nicht. Bin gespannt, wie das in Echt wirkt (Sieht gut aus!).

Achja: IE5.x wird nicht mehr erwähnt. Es wird glaube ich genau genommen nicht einmal erwähnt, dass er nicht mehr erwähnt wird. Weg. Futschi. Web sei Dank.

Soweit erstmal zu den wichtigsten Änderungen, von denen ein Teil übrigens bereits im Interview mit Gerald Brozek von hyperkontext.at erwähnt wurde. Wenn mir noch was einfällt, werde ich das dann hier ergänzen.