Dienstag25. September 2007

Die Diskussion bezüglich CSS-Frameworks bleibt nicht stehen. Wenn Sie das Thema interessiert, finden Sie in dem Essay “Was Sie über CSS-Frameworks wissen sollten!” eine ausführliche thematische Fortsetzung der Diskussion

In den letzten Wochen sind im englischen Sprachraum zwei interessante Artikel erschienen, die im Bezug auf die Argumentation pro/conta CSS Frameworks polarisieren. Da wäre “Why I don’t use CSS Frameworks” (Kyle Neath) und “Please do not use CSS framworks” (Jonathan Christopher). Das Smashing Magazine hat diese Diskussion im Rahmen eines Überblicks aktuellen CSS-Frameworks aufgegriffen und prägnant zusammengefasst.

Danach gelten als Vorteile ...

  • Steigerung der Produktivität
  • Vermeiden von alltäglichen Fehlern
  • Einheitliche Code-Basis
  • Verbesserter Workflow bei Team-Arbeit

Dem gegenüber stehen einige Nachteile ...

  • Erlernen der Arbeitsweise des Frameworks kostet Zeit
  • Verstehen der Code-Architektur kostet Zeit
  • Fehler in der Codebasis werden unerkannt mitgeschleift
  • Man vertaut dem Framework, nicht seinen eigenen CSS-Kenntnissen
  • Frameworks erzeugen Overhead im Code
  • CSS Frameworks und semantische Codeauszeichnung stehen im Gegensatz zueinander
  • Man ignoriert die Einzigartigkeit eines Webprojekts

Nun bin ich als Framework-Entwickler natürlich kein Außenstehender, ungeachtet dessen habe ich natürlich zu diesem Thema eine Meinung. Den Vorteilen stimme ich zu (War ja klar, oder?). Zu den genannten Nachteilen möchte ich jedoch etwas anmerken. Nicht, um sie weg zu diskutieren, sondern weil denke, dass die Ursachen dafür woanders zu suchen sind.

Den gesamten Beitrag lesen


Dienstag11. September 2007

Das jQuery-Team legt ein Tempo an den Tag, über welches es sich nur staunen lässt. Während der letzten 2 Monate wurden mit zwei Releases (1.1.3 und 1.1.4) die Arbeitsgeschwindigkeit der Library jeweils enorm gesteigert. Pünktlich als September-Highlight folgt die Veröffentlichung der Version 1.2, welche zahlreiche lang ersehnte Funktionen mit sich bringt. Und zur Krönung ist für das kommende Wochenende die Veröffentlichung des neuen Interface-Plugins geplant.

Ich bin restlos begeistert. Außerdem kommt mir beides gerade recht für die weitere Arbeit am YAML Builder.


Montag10. September 2007

Erst vor ein paar Tagen habe ich hier im Blog über den Ansatz von Chris Heilmann berichtet, gleichlange Spalten nicht mit CSS sondern nachträglich per Javascript zu erzeugen.

Dieser Weg ist immer dann sinnvoll, wenn gleichlange Container einen optisch ein reizvollen Effekt darstellen, für die Funktion der Webseite jedoch nicht zwingend relevant sind. Aus eigener Erfahrung würde ich sagen, dass dies in den meisten Fällen zutrifft. Nicht lange nachdem mein Blogbeitrag im Netz stand, meldete sich Dirk Ginader und wir bastelten eine Lösung für YAML auf Basis von jQuery. Die wenigen Codezeilen waren schnell geschrieben,  doch letzte Woche hatten wir beide viel umdie Ohren, sodass ich erst jetzt dazu komme, unser kleines Plugin mit dem Namen SyncHeight kurz vorzustellen.

Das Plugin synchronisiert die Höhe einer beliebigen Anzahl von Elementen innerhalb eines Layouts. Einzige Voraussetzung: Die Elemente müssen sich lediglich über einen gemeinsamen CSS Selektor ansprechen lassen (also beispielsweise eine gemeinsame CSS-Klasse). Als Beispiel hier der Aufruf zur Anpassung der Containerhöhen der YAML Subtemplates:

$(document).ready(function(){
  $('.subcolumns > div').syncHeight();
}); 

Für Layouts mit fixer Breite war’s das bereits. Innerhalb eines flexiblen Layouts kann es nötig sein, die Angleichung der Containerhöhen zu aktualisieren wenn die Breite des Browserfensters geändert wird. Dazu kann der Resize Event von jQuery genutzt werden:

$(document).ready(function(){
  $('.subcolumns > div').syncHeight();
  $(window).resize(function(){ 
    $('.subcolumns > div').syncHeight();
  });
});

Nachtrag 11.9: Befinden sich gleich mehrere Subtemplates auf der Seite empfielt es sich, den gewünschten Subtemplate-Container direkt über eine ID anzusprechen. Sollen hingegen ALLE Subtemplates innerhalb einer Webseite mit einem Schlag bearbeitet werden, so sind noch ein paar mehr Zeilen Javascript nötig. Hier hat sich Reinhard Hiebl bereits Gedanken gemacht schlägt folgenden Code vor:

$(document).ready(function(){
  var eachCase = '.subcolumns'; // for each lines/paragraphs
  var element = '> div'; // elements within lines/paragraphs from eachCase

  $($(eachCase)).each(function() {
    var el = $(this).find(element);

    el.syncHeight();
    $(window).resize(function(){
      el.syncHeight();
    });
  });
});

In diesem Fall werden alle Subtemplates einer Webseite erfasst, jedoch die Container-Höhen immer nur jeweils innerhalb eines Subtemplates synchronisiert.

Letztlich ist die Anwendung nicht auf YAML begrenzt. Über den Selektor können beliebige Elemente in ihrer Höhe manipuliert werden.

Download des Plugins (v1.0): jquery.syncheight.zip (Dual licensed under the MIT and GPL licenses)


Donnerstag06. September 2007

Am 29.09. nehme ich die freundliche Einladung war und werde wieder einmal einen Vortrag über YAML halten. Anlass ist der 21. Multimediatreff mit dem ambitionierten Thema “Web 2008: Konzeption & Praxis” (hier das Programm). Wie bereits beim Frankfurter Barcamp werden Jens Grochtdreis und ich gemeinsam eine etwa einstündige Session halten. Während Jens das Konzept des Frameworks beleuchten wird und, werde ich mich der Anwendung widmen und sowohl den YAML Builder vorstellen als auch ein konkretes Beispiel zusammenbauen.

Soweit die Kurzfassung von mir, denn die Planungen für den Vortrag laufen gerade erst an. Jens informiert bei sich deutlich umfangreicher, daher verlinke ich dankend. Flug und Hotel sind bereits gebucht und ich freue mich, endlich wieder ein paar neue Webkrauts-Gesichter kennen zu lernen.

Bis dahin ...


Seite 1 von 1 Seiten