Im letzten Artikel habe ich das hervorragende Javascript dp.SyntaxHighlighter von Alex Gorbatchev vorgestellt, mit dem man unglaublich einfach Code-Listings auf der eigenen Web-Site "aufhübschen" kann.

Da ich das Script auf zerbit.de nun verwende, habe ich das mitgelieferte StyleSheet SyntaxHighlighter.css, über das man das Aussehen der Code-Boxen definiert, an das Layout meiner Site angepasst. Der CSS-Code ist recht überschaubar und reizt zum Experimentieren. Aus diesen Experimenten sind nun ein paar Styles entstanden, die ich euch nicht vorenthalten möchte.

Ein Beitrag von Dr. Web (CSS mit Vorschau) über eine neue Vorschau-Funktion auf CSSPlay, brachte mich wieder einmal dazu auf der Seite des englischen CSS-Meisters Stu Nicholls vorbeizuschauen.

Neben der wirklich schönen und praktischen neuen Vorschau-Funktion für die auf CSSPlay verfügbaren Cascading Style Sheets-Beispiele der Rubriken Menüs, Layouts und Boxen, sind mir vor allem ein paar neues Menüs aufgefallen, die einen zweiten Blick wert sind.

Besonders das Multi-Level-CSS-Menu Variations on a Drop-Down ist, wie ich finde, ein Knaller, denn neben einem stabilen und schicken Menü ohne Javascript, bietet es durchscheinende Flyouts und ist zu (fast) allen Browsern kompatibel.

Die Gestaltung einer Web-Seite mit sich an die Fenstergröße des Browsers anpassenden Inhalt ist in vielen Fällen der starren Anordnung der Inhalte vorzuziehen. Das Ganze wirkt dynamischer und der Benutzer kann wirklich entscheiden wieviel Information er auf einen Blick sehen möchte.

Die Grenzen eines Fluid-Layouts sind jedoch spätestens dann erreicht, wenn sich z.B. bei einem dreispaltigen Layout die einzelnen Spalten gegenseitig verdrängen, weil die Fenstergröße zu klein wird. Die meisten Webmaster arbeiten daher mit einer Mindestbreite, die nicht unterschritten werden kann.

Mike Madaio hat im Digital Web Magazine einen Artikel veröffentlicht, der das Problem auf eine etwas elegantere Weise löst: mit etwas Javascript. Ansatz sind verschiedene CSS-Layouts, die je nach Breite des Browser-Fensters zum Einstz kommen.

In Zeiten von AJAX und einer verschwindenden Menge an Menschen, die Javascript in Ihrem Browser generell ausschalten, eine wirkliche Alternative für so manch schwer umzusetzendes Layout.

Immer wieder stößt man im Netz auf Seiten, die atemberaubende Ansätze bezüglich Layout und Einsatz von CSS zu bieten haben. Um solche Schmuckstücke gezielt anzusurfen, hat Dr. Web wieder einmal eine sehr umfangreiche Quellensammlung erstellt. Diesmal zum Thema CSS und Design Galerien.

Ein Liste die zum Stöbern auffordert. Wer auf den dort aufgeführten Seiten keinen Hauch der Inspiration verspürt, macht was falsch.

Gutes Web-Design fängt beim gewählten Layout. In aller Regel entscheiden sich Web-Entwickler heutzutage für ein drei-spaltiges Layout mit Kopf- und Fusszeile. In einem solchen Layout lassen sich die verschiedenen Bereiche einer Seite (Logo, Navigation, Content, News, et cetera) einfach am Besten unterbringen.

Da zu einer modernen Seite auch die strikte Trennung von Inhalt und Form gehört, ist das Umsetzen des gewünschten Layouts über DIV-Bereiche und CSS eine manchmal nicht ganz so triviale Angelegenheit, vor allem, wenn möglichst alle Browser das gleicher Ergebnis zeigen sollen.

Alessandro Fulciniti hat nun mit LayoutGala eine Seite an den Start gebracht, die bei der Erstellung des Web-Grundgerüsts eine enorme Erleichterung sein kann. Auf der Seite sind über 40 verschiedene Beispiel-Layouts verfügbar, deren Quell-Code jedermann zur freien Verfügung steht. Basis aller Layouts ist dabei ein festes HTML-Gerüst, jeweils erweitert um validen CSS-Code.