YAML 3.2 - Schärfung des Profils http://www.highresolution.info/weblog/entry/yaml_3.2_schaerfung_des_profils/ Schlankerer Framework-Core Die wichtigste Änderung gleich zu Beginn: YAML besteht nunmehr nur noch aus zwei Kernbausteinen. Die base.css ist das Herzstück des Frameworks und stellt dem Nutzer ein schonendes Browser-Reset, oft benötige CSS-Klassen für die Layouterstellung (Float Clearing, Skiplinks, ect.), die “Subtemplates” als flexible Grid-Bausteine, ein universelles Fallback auf ein dreispaltiges Basislayout und wichtige Vorgaben für eine fehlerfreie Druckausgabe bereit. Über den zweiten Baustein, die iehacks.css werden die älteren Versionen des Internet Explorers 5.x bis 7.0 mit Bugfixes versorgt, die so formuliert sind, dass sie ohne Eingreifen des Anwenders den überwiegenden Teil der CSS-Bugs dieser Browser korrigieren. Der ehemaliige dritte Baustein, die print_base.css ist in der base.css aufgegangen. Eine Umstrukturierung der medienspezifischen Definitionen innerhalb der base.css ermöglichte weiterhin einige Vereinfachungen der Codebasis, sodass trotz der Erweiterung der Grid-Komponente der gesamte Framework-Core insgesamt fast 600 Byte (ca. 10%) kleiner geworden ist. Mit den Wegfall der print_base.css kann zudem ein HTTP-Request eingespart werden (zumindest, wenn man die finalen Stylesheets nicht zusammenfasst) und in modernen Browsern wie dem Internet Explorer 8, Firefox, Opera, der Safari benötigt der YAML-Core nur noch 2,34 kB (slim_base.css). Ausschließlich die veralteten Versionen des Internet Explorers 5.x – IE 7.0 müssen den vollständige Core mit 5,04 kB laden. Neue Features & Altlastenentsorgung Wie mit fast jeder YAML-Version wird auch mit YAML 3.2 der Funktionsumfang des Frameworks leicht erweitert. Die Subtemplates (die Grid-Komponente von YAML) erhält vier weitere Unterteilungen (20%, 40%, 60% und 80%). Selbstverständlich besteht auch hier die Möglichkeit, gleiche Containerhöhen über die Klasse .equalize zu erzwingen. Daneben steht mit einem weiteren Add-on, dem SyncHeight-Plugin für jQuery, eine JavaScript-Alternative für das Erzwingen gleichhoher Container zur Verfügung. Der Formularbaukasten ist ebenfalls flexibler geworden. So ist die Klasse .yform nicht mehr an das form-Element gebunden, was den Einsatz in Content Management Systemen wie z.B. ExpressionEngine vereinfacht, bei denen der form-Tag automatisch vom CMS generiert wird. Die zusätzliche Darstellungsklasse .full hilft bei Platzproblemen (schmale Formulare) und erzeugt Input-, Select-Felder und Textareas mit voller Breite des umgebenden Elternelementes. Ein neues Layoutbeispiel demonstriert, wie einfach und komfortabel sich mehrspaltige Formulare mit YAML erstellen lassen. Neben diesen neuen Möglichkeiten, wurden mit diesem Release auch einige Altlasten beseitigt. So wurden die IE-Fixes für die ehemaligen ID’s #page_margins und #page aus der iehacks.css entfernt. Beide ID’s werden seit YAML 3.1 (Januar 2009) in mehrfach verwendbare Klassen umgewidmet. Einen echten Feature-Drop betrifft der Verzicht auf die Möglichkeit, Spaltenhintergründe mit Hilfe der Border-Definition von #col3 zu erzeugen. Zwar ist diese Technik denkbar einfach in der Umsetzung, sie beschwört aber in Verbindung mit den Windows-Kontrastmodi ein Zugänglichkeitsproblem herauf, da in diesen Modi Vordergrund- und Rahmenfarben auf den gleichen Farbwert gesetzt werden, infolgedessen Inhalte mit dahinterliegenden farbigen Rahmen (den simulierten Spaltenhintergründen) z.T. nicht mehr lesbar sind. Erschwerend kam hinzu, dass diese Technik im Internet Explorer ein Anpassung des z-index von #col3 bedurfte, was in seltenen Fällen das Selektieren von Inhalten mit der Maus im Browser blockierte. Ein oft diskutierter Punkt unter vielen Framework-Anwendern war bisher der Workaround zur Vermeidung seitlich springender, zentierter Layouts im Firefox und Safari durch Erzwingen eines vertikalen Scrollbalkens. Mit der Veröffentlichung der neuen Browsergenerationen Internet Explorer 8, Firefox 3.5, Safari 4 und Opera 10 wurde die bisherige Lösung unbrauchbar und deshalb aus dem Core entfernt. An ihre Stelle tritt eine CSS3-basierte Lösung (overflow-y: scroll), welche nunmehr in den Nutzerstylesheets (basemod.css) verankert ist und somit von jedem Anwender bei Nicht-Gefallen einfach deaktiviert/entfernt werden kann. Ebenfalls ersatzlos gestrichen wurde das Debug-Stylesheet (debug.css), welches mit der Version 3.0 Einzug in das Framework gehalten hatte. Zu sehr litt die Übersicht bei der Vielzahl der gleichzeitig eingeblendeten Informationen. Die fehlende Konfigurierbarkeit und die umständlichen Handhabung waren ebenfalls nicht vorteilhaft. Mit dem bereits im Febuar 2009 veröffentlichten Codeanalyse-Tool YAML Debug steht YAML-Entwicklern eine deutlich bessere und vielseitigere Alternative zur Verfügung, die mit einem einzigen Klick jedes Layout analysiert. Handwerkszeug für die Barrierefreiheit Kein Framework, auch nicht YAML, ist ein Garant für barrierefreie Webseiten. Dennoch zeigt sich mehr und mehr, wie sinnvoll und richtig es ist, Webentwicklern das grundlegende Handwerkszeug innerhalb des Frameworks zur Verfügung zu stellen. In YAML 3.2 wird eine neue Darstellungsmöglichkeit für Skiplinks unterstützt, die ein Überlagern des Layouts für die eingeblendeten Skiplinks ermöglicht und dadurch die sonst üblichen Probleme bei deren Integration beseitigt. Zudem wird für Webkit-basierte Browser ein JavaScript-Fix mitgeliefert, um auch Apple’s Safari und Google Chrome dazu zu bewegen, den Focus auf die angesprungene ID zu setzen. Ein weiterer Schritt ist die konsequente Einbeziehung von WAI-ARIA. Sämtliche bei YAML mitgelieferte Beispiellayouts wurden mit ARIA-Landmarkroles versehen. Zwar handelt es sich hierbei nicht wirklich um ein Feature des Frameworks (die korrekte Auszeichnung sollte der Webentwicklers vornehmen), dennoch halte ich auch diesen Schritt für wichtig, um als Framework-Entwickler trotz der noch fehlenden Validierungsmöglichkeiten im W3C-Validator die positiven Effekte des kommenden Standards hervorzuheben. Schon heute können alle modernen Browser (einschließlich des IE8) mit WAI-ARIA umgehen und ermöglichen somit einen deutlichen Zugewinn an Barrierefreiheit auf Webseiten jeder Komplexitätsstufe. Das “Accessible Tabs” Plugin von Dirk Ginader wird mit YAML 3.2 als Add-on ein fester Bestandteil des Frameworks. Das dahinter stehende Konzept habe ich zusammen mit Dirk Ginader bereits vor zwei Jahren entwickelt, die Umsetzung im Rahmen dieses Plugins ist mittlerweile ausgereift und umfangreich getestet. Auch dieser Baustein ist weniger als Feature des Frameworks zu sehen. Stattdessen bemühe ich mich darum, zusammen mit YAML sinnvolle Best-Practice-Lösungen zu vermitteln und die Verbreitung dieser Techniken zu fördern. Zusammenfassung Neben diesen großen Neuerungen/Verbesserungen stehen zahlreiche kleinere Korrekturen hier und da, über die das Changelog im Detail Ausfunft gibt. Wie mit jedem Release wurde auch die Projektvorlage “Simple Project” auf den aktuellen Stand gebracht.Der YAML Builder beherrscht momentan WAI-ARIA noch nicht und auch die neue Skiplink-Variante ist dort noch nicht implementiert, die Codeausgabe ist aber selbstverständlich kompatibel zu YAML 3.2. Der Release-Zyklus war diesmal deutlich länger, zudem zwischen v3.1 und v3.2 keine sogenannten Maintenance-Releases eingeschoben wurden. Der Hauptgrund hierfür lag in der eng gestaffelten Veröffentlichung der aktuellen Browsergeneration, angefangen mit dem Internet Explorer 8 im Frühjahr 2009. Gerade bei diesem war es wichtig, die zuverlässige Funktion der Kernfunktionen des Frameworks ohne jegliche Hacks zu überprüfen. Nach nunmehr einem halben Jahr lässt sich dieser Fakt bestätigen. Einzig bei der Darstellung von Formularen benötigt der Internet Explorer 8 noch wenige individuelle Hilfestellung, die notwendigen Anpassungen kennt der Formularbaukasten jedoch. Daneben stellt das 3.2-Release für mich eine weitere Schärfung des Profils von YAML hinsichtlich des modularen Aufbaus auf Basis eines sehr schlanken Kerns und der Focussierung auf flexible, barrierefreie Webseiten dar. Und die Entwicklung geht weiter ... de-de Dirk Jesse Copyright 2009 2009-10-27T;22:19:21+00:00 Kommentar von Frank http://www.highresolution.info/weblog/entry/yaml_3.2_schaerfung_des_profils/ Die Veränderungen klingen sehr interessant und vielversprechend. Ich bin gespannt, wann der erste Baustein für mobile Geräte in YAML Einzug findet. Das iPhone, die neuen Geräte von RIM und andere mobile Geräte betrachte ich als neue Herausforderung für YAML und die BF. Weiter so ! Die Veränderungen klingen sehr interessant und vielversprechend.
Ich bin gespannt, wann der erste Baustein für mobile Geräte in YAML Einzug findet.

Das iPhone, die neuen Geräte von RIM und andere mobile Geräte betrachte ich als neue Herausforderung für YAML und die BF.

Weiter so !

]]> 2010-02-12T;11:37:10+00:00 Kommentar von Dave http://www.highresolution.info/weblog/entry/yaml_3.2_schaerfung_des_profils/ Bin gerade dabei meine erste YAML- basierende Website zu erstellen. Die Zeit der Einarbeitung ist nichts im Vergleich zu den Nutzen die man aus diesem wirklich tollen Framework ziehen kann. Ich bereue dass ich mich nicht schon früher näher mit YAML beschäftigt habe. Du nimmst uns Webworkern einen großen Teil lästiger Arbeit aus der Hand und dass zu wirklich fairen Konditionen. Vielen Dank! Bin gerade dabei meine erste YAML- basierende Website zu erstellen. Die Zeit der Einarbeitung ist nichts im Vergleich zu den Nutzen die man aus diesem wirklich tollen Framework ziehen kann. Ich bereue dass ich mich nicht schon früher näher mit YAML beschäftigt habe.
Du nimmst uns Webworkern einen großen Teil lästiger Arbeit aus der Hand und dass zu wirklich fairen Konditionen. Vielen Dank!

]]> 2010-02-12T;11:37:10+00:00 Kommentar von Helmut Sieghartsleitner http://www.highresolution.info/weblog/entry/yaml_3.2_schaerfung_des_profils/ Hallo Dirk, vielen vielen Dank für Deine Arbeit. Durch das Framework habe ich sehr viel über das Verhalten von CSS und HTML lernen können. Auch wenn die Einarbeit ins Framework vielleicht etwas zeitaufwendiger ist, es lohnt sich auf jeden Fall. Hallo Dirk,
vielen vielen Dank für Deine Arbeit. Durch das Framework habe ich sehr viel über das Verhalten von CSS und HTML lernen können. Auch wenn die Einarbeit ins Framework vielleicht etwas zeitaufwendiger ist, es lohnt sich auf jeden Fall.

]]> 2010-02-12T;11:37:10+00:00 Kommentar von Thomas Weise http://www.highresolution.info/weblog/entry/yaml_3.2_schaerfung_des_profils/ Auch von mir wieder ein Dankeschön für die neue Version. Schön auch, dass Du das Deutsch weiter pflegst ;-) -heutabendgleichmalreinguck- Auch von mir wieder ein Dankeschön für die neue Version. Schön auch, dass Du das Deutsch weiter pflegst ;-)
-heutabendgleichmalreinguck-

]]> 2010-02-12T;11:37:10+00:00 Kommentar von Andreas Hecht http://www.highresolution.info/weblog/entry/yaml_3.2_schaerfung_des_profils/ Hallo Dirk, dankeschön für die wunderbare Arbeit! Ich werde es mir in den nächsten Tagen mal genauer anschauen (besonders das wunderbare forms.css)  und mit Sicherheit auch wieder einsetzen. Und natürlich gleich mal testen, ob der Opera Bug im forms.css behoben ist und wie Dein Lösungsansatz dafür ausgefallen ist ;-) Hallo Dirk,

dankeschön für die wunderbare Arbeit! Ich werde es mir in den nächsten Tagen mal genauer anschauen (besonders das wunderbare forms.css)  und mit Sicherheit auch wieder einsetzen.

Und natürlich gleich mal testen, ob der Opera Bug im forms.css behoben ist und wie Dein Lösungsansatz dafür ausgefallen ist ;-)

]]> 2010-02-12T;11:37:10+00:00 Kommentar von Basti Schmuttermaier http://www.highresolution.info/weblog/entry/yaml_3.2_schaerfung_des_profils/ Respekt, Hut ab und weiter so! Ein riesengroßes Dankeschön an Dirk und all die helfenden Hände die im Hintergrund wirbeln um solch ein Projekt möglich zu machen! Respekt, Hut ab und weiter so! Ein riesengroßes Dankeschön an Dirk und all die helfenden Hände die im Hintergrund wirbeln um solch ein Projekt möglich zu machen!

]]> 2010-02-12T;11:37:10+00:00 Kommentar von Antonio http://www.highresolution.info/weblog/entry/yaml_3.2_schaerfung_des_profils/ Klasse Arbeit, danke! > Und die Entwicklung geht weiter… ...was für alle YAML-Freunde noch das Sahnehäubchen ist ;-) Klasse Arbeit, danke!

> Und die Entwicklung geht weiter…

...was für alle YAML-Freunde noch das Sahnehäubchen ist ;-)

]]> 2010-02-12T;11:37:10+00:00 Kommentar von Kersten http://www.highresolution.info/weblog/entry/yaml_3.2_schaerfung_des_profils/ Sehr gute Arbeit, Dirk. Applaus… Sehr gute Arbeit, Dirk. Applaus…

]]> 2010-02-12T;11:37:10+00:00 Kommentar von Dirk Jesse http://www.highresolution.info/weblog/entry/yaml_3.2_schaerfung_des_profils/ @Jared, ja, in 90% der Fälle sollte ein Austausch ohne Störungen möglich sein. Die vordefinierten Verhaltensweisen sich ja nicht geändert und solange man die Bausteine bei der Anwendung nicht großartig “verbiegt” ist keine Nacharbeit erforderlich. YAML.de läuft ebenso seit kurzem auf der 3.2. @Jared,

ja, in 90% der Fälle sollte ein Austausch ohne Störungen möglich sein. Die vordefinierten Verhaltensweisen sich ja nicht geändert und solange man die Bausteine bei der Anwendung nicht großartig “verbiegt” ist keine Nacharbeit erforderlich. YAML.de läuft ebenso seit kurzem auf der 3.2.

]]> 2010-02-12T;11:37:10+00:00 Kommentar von Jared http://www.highresolution.info/weblog/entry/yaml_3.2_schaerfung_des_profils/ Hallo Dirk, das Update habe ich ja wirklich schon sehnsüchtig erwartet ;) danke dir für deine Mühe! Das ist für mich wie ein 2tes Weihnachten!!! Bevor ich den YAML Core aktualisiere - ist ohne weiteres möglich den bisherigen YAML Ordner (Version 3.1) im Projekt zu löschen und mit der aktualisierten YAML Version 3.2 zu ersetzen? Die Core Dateien habe ich zumindest nie angefasst - alle Deklarationen stehen, wie es sich gehört, in den basemod.css Dateien… Liebe Gräße Hallo Dirk,

das Update habe ich ja wirklich schon sehnsüchtig erwartet ;) danke dir für deine Mühe!
Das ist für mich wie ein 2tes Weihnachten!!!

Bevor ich den YAML Core aktualisiere - ist ohne weiteres möglich den bisherigen YAML Ordner (Version 3.1) im Projekt zu löschen und mit der aktualisierten YAML Version 3.2 zu ersetzen?
Die Core Dateien habe ich zumindest nie angefasst - alle Deklarationen stehen, wie es sich gehört, in den basemod.css Dateien…

Liebe Gräße

]]> 2010-02-12T;11:37:10+00:00 Kommentar von Gerrriet http://www.highresolution.info/weblog/entry/yaml_3.2_schaerfung_des_profils/ Hallo ;D Ich kann dem Tekl da nur zustimmen. Bin schon sehr lange ein Fan von YAML. Gut finde ich auch, das du an diejenigen auch denkst, die nicht sogut englisch können. Schön wäre es, wenn es ein Offline Version vom YAML Bulder gebe. Da ich zur Zeit ohne Internet zuhause sitze, wäre das sehr von Vorteil ;D Hallo ;D

Ich kann dem Tekl da nur zustimmen. Bin schon sehr lange ein Fan von YAML. Gut finde ich auch, das du an diejenigen auch denkst, die nicht sogut englisch können.

Schön wäre es, wenn es ein Offline Version vom YAML Bulder gebe. Da ich zur Zeit ohne Internet zuhause sitze, wäre das sehr von Vorteil ;D

]]> 2010-02-12T;11:37:10+00:00 Kommentar von Tekl http://www.highresolution.info/weblog/entry/yaml_3.2_schaerfung_des_profils/ Hallo Dirk, vielen Dank für dieses tolle Framework. Es ist nicht nur sehr hilfreich, sondern auch extrem lehrreich. Gruß, Tekl Hallo Dirk,

vielen Dank für dieses tolle Framework. Es ist nicht nur sehr hilfreich, sondern auch extrem lehrreich.

Gruß, Tekl

]]> 2010-02-12T;11:37:10+00:00