Schlagwort-Archive: CSS

YAML Builder: per Mausklick zum neuen Layout

Dirk Jesse hat ein Preview des YAML Builder in der Version 0.3 veröffentlicht. YAML steht für „Yet Another Multicolumn Layout“ und ist ein Framework zur Erstellung moderner und flexibler XHTML & CSS Layouts für Webseiten. Ich habe den Builder selbst noch nicht getestet, er sieht aber auf den ersten Blick sehr gut aus. Mit solch einer einfachen Möglichkeit ein Grundkonzept zusammenzuklicken, dürften sich einige Anwender vielleicht eher für YAML als YUI entscheiden.

Spaßbremsen finden – wie lange lädt mzungu's?

Firebug Ladezeiten der WebsiteNachdem mir die letzten Tage überall Artikel zur neuen Firebug Erweiterung für Firefox begegnet sind, habe ich sie natürlich Pflichtbewusst installiert. Neben vielen Tools zur HTML, CSS und Javascript Analyse gibt es u.a. auch die Möglichkeit die Ladezeit der Seite zu analysieren. Schlecht komprimierte Grafiken, zu viel Javascript, lahme externe Anwendungen wie Flickr oder Statistiken – wo genau sind die Spaßbremsen versteckt? Die Ladezeiten von meinem Blog könnten vermutlich besser sein. Ich würde mich über dein Feedback freuen, um das ganze verbessern zu können.

Umfrage zu den Ladezeiten von mzungu’s

Take Our Poll

YAML Layout-Framework

Moderne Webseiten basieren auf XHTML und einem durch CSS gesteuertem Design. Die meisten Seiten verwenden dabei ein zwei oder drei Spalten Layout (Nadja erklärt warum das so ist). YAML (Yet Another Multicolumn Layout) ist ein Framework mit dessen Hilfe auf einfache Art standardkonforme Layouts als Grundlage für eine eigene Anpassung erstellt werden können.

„Yet Another Multicolumn Layout“ ist ein Framework zur Erstellung moderner und flexibler Layouts auf Grundlage von float-Umgebungen. Dabei stehen ein möglichst hohes Maß an Flexibilität und Zugänglichkeit im Vordergrund. Innerhalb eines Tutorials wird die Funktionsweise der einzelnen Bausteine erläutert.

Die Erstellung komplexer Designs mit floatenden Layoutbereichen ist normalerweise recht trickreich, vor allem wenn die Seiten in allen Browsern gleich aussehen sollen. Das sollte ja selbstverständlich sein, doch leider gibt es immernoch viele Browser-Bugs und nicht standardkonformes Verhalten der Browser. Mit YAML erstellte Layouts unterstützen eine große Zahl moderner Browser diverser Betiebssysteme. YAML ist ein Framework, das ich selbst sicherlich öfters einsetzen werde.
[via BS]

Einstieg in die Positionierung von HTML-Elementen mit CSS

Peter Müller hat einen übersichtlichen Artikel zur Positionierung von HTML-Elementen geschrieben. Er erklärt, wie sich die HTML-Elemente natürlicherweise im „document flow“ verhalten und wie sie mit Hilfe von CSS aus diesem natürlichen Flow heraus positioniert werden können. Ein Artikel mit wichtigen Grundlagen für jeden Webdesigner und perfekt als Einstieg ins Thema.
Hier ein Auszug:

  1. Flow: Zum normalen „Fluss“ gehören nicht positionierte Block- und Inline-Elemente sowie Boxen mit relativer Positionierung (position:relative).
  2. Absolute Positionierung: Absolut positionierte Elemente werden aus dem Fluss herausgehoben und sind für die anderen Elemente nicht sichtbar. Dazu zählen position:absolute und position:fixed.
  3. Float: Schwebende, gefloateteElemente sind ein Zwischending. Zuerst wird die Box im normalen Fluss positioniert, dann wird sie aus dem Fluss herausgehoben und schwebt so weit wie möglich nach rechts oder links.

Zur Positionierung ebenfalls sehr empfehlenswert ist dieser Überblick von Patrick Fitzgerald.
[via WebdevBits]