Working Draft

By Vanessa Otto, Peter Kröner, Hans Christian Reinl, Stefan Baumgartner, Christian »Schepp« SchaeferNews Technology Education How To Tech News

Working Draft episodes

July 06, 2011 Revision 30: IE10, Google+ und Dr.Web
Diesmal sind wir wieder etwas später dran mit unserer Revision, denn wir mussten zwei mal aufnehmen. Der Grund: Wir hatten die verrückte Idee, anstatt per Skype mal per Google+ Hangout aufzunehmen; blöd war nur, dass der Hangout nach rund einer Stunde abstürzte, und die Aufnahme gleich dazu. Um nicht den gleichen Sermon erneut rezitieren zu müssen, haben wir uns für die zweite Aufnahme den Jens Grochtdreis dazu geholt.
Schaunotizen
[00:00:00] IE10 Public Preview 2 ist da!
Wir reden über Drag & Drop, die File-API, HTML5 Forms, Web Workers, Sandboxed Iframes, ES5 Strict Mode, requestAnimationFrame, Media Query Listeners, async-Attribut CSS3 Flexbox, CSS3 Positioned Floats, CSS3 Grids und CSS3 Multicolumn Layout. Außerdem wagen wir uns an einer Einschätzung, ob der IE10 das Zünglein an der Waage ist, das unsere Art Webseiten zu layouten auf den Kopf stellt.
[00:38:30] Google+
Wir tun unsere Begeisterung über Googles neues soziales Netzwerk kund. Außerdem vergleichen wir es mit Twitter und Facebook, sagen was gut funktioniert und was noch verbesserungsfähig wäre.
[01:01:18] CSS1K
Letzte Woche ist ein neuer Wettbewerb online gegangen, bei dem die Aufgabenstellung ist, ein vorgegebenes HTML möglichst kreativ mit nur 1024 Bytes (also Zeichen) CSS zu gestalten. Verboten sind alle externen Ressourcen, also Fonts und Bilder, wie auch DataURIs. Bisher sind nicht viele große Design-Würfe dabei, aber das Projekt ist ja noch jung…
[01:09:15] HTML5Pattern
Diese Seite sammelt alle möglichen Regulären Ausdrücke, die man jemals im pattern-Attribut eines HTML5 Eingabefelds zur Feldprüfung gebrauchen könnte: Kreditkartennummern, Passwortvorgaben, Postleitzahlen, etc. Praktisch!
[01:12:28] Die Auferstehung des untoten Dr.Web
Das im letzten Jahr eingestellte Dr.Web-Magazin wurde offenbar an eine Online-Marketing-Firma verkauft, die die Seite nun wiederbeleben will. Betrachtet man diverse Rahmenparameter, so sind wir bzgl. eines möglichen Erfolgs sehr skeptisch.
[01:20:44] Keine Schaunotizen
gmap3
jQuery-Wrapper für das Google Maps v3 API
morf.js
Mehr easing Funktionen für CSS3 Transitions!
Node Up
Der erste Podcast zu Node.js
IEWebGL
Ein Java-basiertes WebGL-Polyfill für die IEs
Know Your Engines [PDF]
Vortrag von David Mandelin, dem neuen Chefarchitekten der Mozilla-JavaScript-Engine, von der Velocity 2011 über interessante Eigenheiten der verschiedenen JavaScript-Engines.
dotjs
Im Browser per Plugin verankerte JavaScripte, die jeweils per Regel bei bestimmten Seiten ausgeführt werden.
Eine MP4-Fassung gibt es diesmal nicht, weil Markus im Urlaub ist.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
1 hr 24 min
July 06, 2011 Revision 30: IE10, Google+ und Dr.Web
Diesmal sind wir wieder etwas später dran mit unserer Revision, denn wir mussten zwei mal aufnehmen. Der Grund: Wir hatten die verrückte Idee, anstatt per Skype mal per Google+ Hangout aufzunehmen; blöd war nur, dass der Hangout nach rund einer Stunde abstürzte, und die Aufnahme gleich dazu. Um nicht den gleichen Sermon erneut rezitieren zu müssen, haben wir uns für die zweite Aufnahme den Jens Grochtdreis dazu geholt.
Schaunotizen
[00:00:00] IE10 Public Preview 2 ist da!
Wir reden über Drag & Drop, die File-API, HTML5 Forms, Web Workers, Sandboxed Iframes, ES5 Strict Mode, requestAnimationFrame, Media Query Listeners, async-Attribut CSS3 Flexbox, CSS3 Positioned Floats, CSS3 Grids und CSS3 Multicolumn Layout. Außerdem wagen wir uns an einer Einschätzung, ob der IE10 das Zünglein an der Waage ist, das unsere Art Webseiten zu layouten auf den Kopf stellt.
[00:38:30] Google+
Wir tun unsere Begeisterung über Googles neues soziales Netzwerk kund. Außerdem vergleichen wir es mit Twitter und Facebook, sagen was gut funktioniert und was noch verbesserungsfähig wäre.
[01:01:18] CSS1K
Letzte Woche ist ein neuer Wettbewerb online gegangen, bei dem die Aufgabenstellung ist, ein vorgegebenes HTML möglichst kreativ mit nur 1024 Bytes (also Zeichen) CSS zu gestalten. Verboten sind alle externen Ressourcen, also Fonts und Bilder, wie auch DataURIs. Bisher sind nicht viele große Design-Würfe dabei, aber das Projekt ist ja noch jung…
[01:09:15] HTML5Pattern
Diese Seite sammelt alle möglichen Regulären Ausdrücke, die man jemals im pattern-Attribut eines HTML5 Eingabefelds zur Feldprüfung gebrauchen könnte: Kreditkartennummern, Passwortvorgaben, Postleitzahlen, etc. Praktisch!
[01:12:28] Die Auferstehung des untoten Dr.Web
Das im letzten Jahr eingestellte Dr.Web-Magazin wurde offenbar an eine Online-Marketing-Firma verkauft, die die Seite nun wiederbeleben will. Betrachtet man diverse Rahmenparameter, so sind wir bzgl. eines möglichen Erfolgs sehr skeptisch.
[01:20:44] Keine Schaunotizen
gmap3
jQuery-Wrapper für das Google Maps v3 API
morf.js
Mehr easing Funktionen für CSS3 Transitions!
Node Up
Der erste Podcast zu Node.js
IEWebGL
Ein Java-basiertes WebGL-Polyfill für die IEs
Know Your Engines [PDF]
Vortrag von David Mandelin, dem neuen Chefarchitekten der Mozilla-JavaScript-Engine, von der Velocity 2011 über interessante Eigenheiten der verschiedenen JavaScript-Engines.
dotjs
Im Browser per Plugin verankerte JavaScripte, die jeweils per Regel bei bestimmten Seiten ausgeführt werden.
Eine MP4-Fassung gibt es diesmal nicht, weil Markus im Urlaub ist.
1 hr 24 min
June 28, 2011Revision 29: VisualSearch.js und Twitter-Spam
Nachdem wir letzte Woche mit zwei Stunden Sendungsdauer unseren Schnitt etwas gehoben haben, gleichen wir das in dieser Woche mit einer guten halben Stunde sofort wieder aus.
Schaunotizen
[0:00:16.000] iOS 5 Beta 2 mit -webkit-overflow-scrolling: touch
[0:02:04.000] VisualSearch.js
[0:07:51.000] CDNjs.com
[0:14:00.000] Twitter promoted Tweets
Keine Schaunotizen
CSS Animation Keyframe Events
Spritecow
Webfont Load Enhancer
Hören
http://workingdraft.de/wp-content/uploads/2011/06/wd-29.mp3
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
38 min
June 28, 2011 Revision 29: VisualSearch.js und Twitter-Spam
Nachdem wir letzte Woche mit zwei Stunden Sendungsdauer unseren Schnitt etwas gehoben haben, gleichen wir das in dieser Woche mit einer guten halben Stunde sofort wieder aus.
Schaunotizen
[0:00:16.000] iOS 5 Beta 2 mit -webkit-overflow-scrolling: touch
[0:02:04.000] VisualSearch.js
[0:07:51.000] CDNjs.com
[0:14:00.000] Twitter promoted Tweets
Keine Schaunotizen
CSS Animation Keyframe Events
Spritecow
Webfont Load Enhancer
Hören
38 min
June 23, 2011 Revision 28: Niemand hat Lion oder iOS 5
Nach zweiwöchiger Abstinenz melden wir uns mit einer rekordverdächtigen Folge zurück: Vier Mann füllen knapp zwei Stunden Hörmaterial. Das liegt unter anderem daran, dass wir uns am Ende auch einer Betrachtung des Verhältnisses der Deutschen zum Internet widmen. Ihr wisst schon: Netzabdeckung, Cyberabwehrzentrum, freie WLANs, Kinderpornos und so. Zu Gast war diesmal Cem Derin. Mehr von ihm hört in seinem Podcast oder seht Ihr auf Offenen Bühnen Events.
Schaunotizen
[00:00:55] jsmad
Peter freut sich über das Erscheinen von jsmad, weil es seine Vermutung bestätigt, dass die Webworkerschaft das Problem fehlender Audio- und Video-Unterstützung durch HTML5-basierte Ports beheben kann. Auch wenn das vielleicht nicht unbedingt so performant ist wie eine native Unterstützung seitens des Browsers.
[00:06:35] Lazy HTML Evaluation
Ein Performance-Kniff, auf den letztes Jahr Sergey Chikuyonok gekommen ist verpackt das HTML einer Seite so, dass es vom Browser zunächst nicht vollständig ausgewertet und damit gezeichnet werden muss. Wenn der Browser auf die Weise nur den oberen, als erstes sichtbaren Teil der Seite zeichnen muss, dann ist sie schneller da (vor allem bei mobilen Browsern). Bewerkstelligen tut man das, indem man den Rest des HTML abschnittsweise in Kommentare verpackt und die Kommentare nach dem Laden erst Stück für Stück freigibt. Sowas ähnliches gibt es auch für JavaScript.
[00:15:11] iOS 5- und Lion-Scrollgeschichten
Neben postion: fixed und WOFF-Support und einigen weiteren Dingen, bringen *NDA hüstel* Mac OS X Lion und iOS 5 neue Formen des Scrollens. iOS 5 nun endlich auch bei HTML-Boxcontainern mit overflow: scroll. Markus, Titelverteidiger „Detailverliebtester Webentwickler von Murr“, befragte Cem (der natürlich *NDA hüstel* kein iOS 5 oder Lion besitzt) zu der genauen Umsetzungsform derselben aus.
[00:23:23] Google Instant Pages
Nach SPDY führt Google ein neues Feature ein, dass in der Kombination Google-Service + Chrome-Browser funktioniert: Das Google Instant Pages Feature bei der Google Suche. Diese stößt über ein spezielles HTML-Tag ein vollständiges Laden und Rendern des wahrscheinlich vom User angeklickten Suchergebnisses an, so dass die Seite dann im Chrome sofort da ist. Bewerkstelligt wird das über eine -Anweisung in der vorgelagerten Seite. Anders als bei der altbekannten Variante prefetch wird aber nicht nur eine einzelne Ressource, sondern es werden alle daran geknüpften geladen und die Seite im Verborgenen auch schon gerendert. Wir diskutieren, was das für Vor- und Nachteile hat.
[00:44:09] Responsive Images
Durch eine Artikel von Keith Clark sind wir auf das Thema Responsive Images gekommen und diskutieren die verschiedenen Wege, wie man mit den heutigen Techniken Größen-angepasste Ressourcen an die diversen Kleingeräte ausliefern kann.
[00:59:52] Markus regt sich über Web-Storage-Events auf!
… denn sie feuern immer anders als man denkt. Da kann ihm auch unser HTML5-Beauftragter Peter nicht ganz aus der Patsche helfen.
[01:09:15] Deutschland ist Internet-Entwicklungsland
Wir nehmen Jens‘ Blogbeitrag zum Anlass, einen Kollektivrant bzgl. der mehr schlechten als rechten Internetversorgungssituation hier in Deutschland auf den Weg zu bringen. Es krankt am Netzausbau, an hohen Kosten, an der praxisfremden Politikern sowie an kontraproduktiven Gerichtsurteilen. Das neue, hihi, Cyberabwehrzentrum, mit seinem Minibudget und 10 Mitarbeitern, nehmen wir uns dabei natürlich auch vor. Nicht zuletzt wünschen wir uns mehr freie öffentliche WLANs und mehr von so Diensten wie FON, Freifunk oder Sofanet. Aber die rechtliche Situation ist eben kompliziert.
[01:51:12] Keine Schaunotizen
SubtlePatterns.com
Sammlung, angenehm hochwertiger Hintergrundmuster.
A fresh look at JavaScript mixins
Artikel darüber, wie man JavaScript-Code-Teile optimal an verschiedenen anderen Stellen aufgreifen kann.
Trimage
Toller Bildoptimierer mit GUI, den es für alle Betriebssysteme gibt.
How, When, And Why Script Loaders Are Appropriate
Ein Artikel darüber, wann der Einsatz von Scriptloadern angebracht ist, und wann nicht.
Visual Event
Bookmarklet, das alle Elemente einer Seite, die mit Events belegt sind, mit entsprechenden Symbolen überlagert. Zum Analysieren: Super!
Audio mit Kapitelmarken (iPod-kompatibel): Download wd-28.m4a
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
1 hr 56 min
June 23, 2011 Revision 28: Niemand hat Lion oder iOS 5
Nach zweiwöchiger Abstinenz melden wir uns mit einer rekordverdächtigen Folge zurück: Vier Mann füllen knapp zwei Stunden Hörmaterial. Das liegt unter anderem daran, dass wir uns am Ende auch einer Betrachtung des Verhältnisses der Deutschen zum Internet widmen. Ihr wisst schon: Netzabdeckung, Cyberabwehrzentrum, freie WLANs, Kinderpornos und so. Zu Gast war diesmal Cem Derin. Mehr von ihm hört in seinem Podcast oder seht Ihr auf Offenen Bühnen Events.
Schaunotizen
[00:00:55] jsmad
Peter freut sich über das Erscheinen von jsmad, weil es seine Vermutung bestätigt, dass die Webworkerschaft das Problem fehlender Audio- und Video-Unterstützung durch HTML5-basierte Ports beheben kann. Auch wenn das vielleicht nicht unbedingt so performant ist wie eine native Unterstützung seitens des Browsers.
[00:06:35] Lazy HTML Evaluation
Ein Performance-Kniff, auf den letztes Jahr Sergey Chikuyonok gekommen ist verpackt das HTML einer Seite so, dass es vom Browser zunächst nicht vollständig ausgewertet und damit gezeichnet werden muss. Wenn der Browser auf die Weise nur den oberen, als erstes sichtbaren Teil der Seite zeichnen muss, dann ist sie schneller da (vor allem bei mobilen Browsern). Bewerkstelligen tut man das, indem man den Rest des HTML abschnittsweise in Kommentare verpackt und die Kommentare nach dem Laden erst Stück für Stück freigibt. Sowas ähnliches gibt es auch für JavaScript.
[00:15:11] iOS 5- und Lion-Scrollgeschichten
Neben postion: fixed und WOFF-Support und einigen weiteren Dingen, bringen *NDA hüstel* Mac OS X Lion und iOS 5 neue Formen des Scrollens. iOS 5 nun endlich auch bei HTML-Boxcontainern mit overflow: scroll. Markus, Titelverteidiger „Detailverliebtester Webentwickler von Murr“, befragte Cem (der natürlich *NDA hüstel* kein iOS 5 oder Lion besitzt) zu der genauen Umsetzungsform derselben aus.
[00:23:23] Google Instant Pages
Nach SPDY führt Google ein neues Feature ein, dass in der Kombination Google-Service + Chrome-Browser funktioniert: Das Google Instant Pages Feature bei der Google Suche. Diese stößt über ein spezielles HTML-Tag ein vollständiges Laden und Rendern des wahrscheinlich vom User angeklickten Suchergebnisses an, so dass die Seite dann im Chrome sofort da ist. Bewerkstelligt wird das über eine -Anweisung in der vorgelagerten Seite. Anders als bei der altbekannten Variante prefetch wird aber nicht nur eine einzelne Ressource, sondern es werden alle daran geknüpften geladen und die Seite im Verborgenen auch schon gerendert. Wir diskutieren, was das für Vor- und Nachteile hat.
[00:44:09] Responsive Images
Durch eine Artikel von Keith Clark sind wir auf das Thema Responsive Images gekommen und diskutieren die verschiedenen Wege, wie man mit den heutigen Techniken Größen-angepasste Ressourcen an die diversen Kleingeräte ausliefern kann.
[00:59:52] Markus regt sich über Web-Storage-Events auf!
… denn sie feuern immer anders als man denkt. Da kann ihm auch unser HTML5-Beauftragter Peter nicht ganz aus der Patsche helfen.
[01:09:15] Deutschland ist Internet-Entwicklungsland
Wir nehmen Jens‘ Blogbeitrag zum Anlass, einen Kollektivrant bzgl. der mehr schlechten als rechten Internetversorgungssituation hier in Deutschland auf den Weg zu bringen. Es krankt am Netzausbau, an hohen Kosten, an der praxisfremden Politikern sowie an kontraproduktiven Gerichtsurteilen. Das neue, hihi, Cyberabwehrzentrum, mit seinem Minibudget und 10 Mitarbeitern, nehmen wir uns dabei natürlich auch vor. Nicht zuletzt wünschen wir uns mehr freie öffentliche WLANs und mehr von so Diensten wie FON, Freifunk oder Sofanet. Aber die rechtliche Situation ist eben kompliziert.
[01:51:12] Keine Schaunotizen
SubtlePatterns.com
Sammlung, angenehm hochwertiger Hintergrundmuster.
A fresh look at JavaScript mixins
Artikel darüber, wie man JavaScript-Code-Teile optimal an verschiedenen anderen Stellen aufgreifen kann.
Trimage
Toller Bildoptimierer mit GUI, den es für alle[...]
1 hr 56 min
June 01, 2011Revision 27: Revision 27: @viewport, Tastatursteuerung und Aurora 6
Tolle Folge. Nuffsaid.
Schaunotizen
[00:00:19.000] @viewport in Opera
[00:11:44.000] W3C Resource Timing
[00:15:56.000] sencha.io
[00:24:55.000] CSS pointer-events
[00:30:19.000] Markus rantet über die Unmöglichkeit der Tastatursteuerung
[00:41:27.000] Firefox Aurora 6
Keine Schaunotizen
[01:11:03.000] Gehosteter Winere-Server
[01:11:52.000] Website aus Schokolade und Bier und Awesomesauce
[01:12:39.000] Inline the crap out of your site
[01:13:47.000] SVG Background Gradient Maker
Audio mit Kapitelmarken (iPod-kompatibel): Download wd-27.m4a
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
1 hr 15 min
May 24, 2011 Revision 26: Viel Internet Explorer
Diesmal war „Schepp allein zu Haus“ angesagt, und da hab ich mir knallhart den Jens Grochtdreis, den Gründer der Webkrauts aus Mainz mit ins Boot geholt. Als bekennende IE-Masochisten stürzten wir uns beide auf diesbezüglich eingefärbte Themen (die Woche gab es allerdings auch zufällig her). Kommentare wieder gerne auf Audioboo mit dem Tag #workingdraft hinterlegen.
Schaunotizen
[00:01:23] Google Finally Delivers On Promise Of Admin-Free Chrome Frame Installs For IE
Irgendwie haben es die Google Ingenieure nun doch hinbekommen, dass man Google Chrome Frame ohne Adminrechte an seinen IE anflanschen kann. Allerdings verraten sie nicht wie. Das macht Jens stutzig und überhaupt löst es das IE-Problem ja immer noch nicht an seiner Wurzel. Aber besser als nix.
[00:10:38] Compact Navigation, Print Preview and the CSS3 Grid Layout Module
Neues Google Chrome Canary Update, erstmalig mit schicker Druckvorschau (die intern ein PDF erzeugt!) und einer ersten Fassung der zuletzt besprochenenen Visibility API. Außerdem mit CSS3 Grid Layouts, einem stark aufgemotzten Web Inspector und der polarisierenden Idee, die Adressleiste auch noch weg zu rationalisieren. Hmm…
[00:22:39] Stylesheet Limits in Internet Explorer
Eric Law von Microsoft hat mal ein paar interessante und teils schon bekannte Grenzen des IEs in Sachen Stylesheet-Parsing aufgelistet. Zunächst erscheinen einem die Limits relativ weit weg, andererseits gab es ja auch mal Leute, die behauptet haben, mehr als 64KB Speicher werde nie ein Mensch brauchen. Daher: Holzauge, sei wachsam!
[00:30:28] CSS Floats and Positioning Level 3
Überraschenderweise haben sich Microsoft und Adobe zusammengetan und eine sehr schöne Erweiterung der Float Techniken für CSS 3 vorgeschlagen, und zwar die Positioned Floats. Dabei wir auf ein Element ein float: positioned; und irgendeine position-Eigenschaft gesetzt, woraufhin anschleißend alles andere um das Element herumfließt. Egal wie und wo es hinpoistioniert wurde. Nett! Außerdem lasst sie die Element-Form per deklarativer Form oder über die Alphamaske eines Bildes beeinflussen.
[00:42:17] In defense of CSS hacks — introducing “safe CSS hacks”
Mathias Bynens hat mal eine sehr schöne Auflistung verschiedener sinnvoller/etablierter CSS-Weichen für die IEs zusammengestellt. Dabei geht es um verschiedene Verfahren auf Conditional Comments Basis, sowie um klassische Parserhacks und was da zu bedenken ist. Mit Vor- und Nachteilen. Bei den HTML5 Boilerplate machern hat der Artikel zu hektischer Betriebsamkeit geführt, weil nämlich die dort praktizierte Variante ein paar der aufgelisteten Schönheitsfehler hatte. Jens und ich waren uns aber einig, dass die das bestimmt bald wieder zurückstellen werden. Außerdem hat Jens darüber auch gebloggt.
[01:03:53] Holmes – The CSS Markup Detective
Jens muss dieses Tool leider als vollkommen uninnovative Produktkopie entlarven, denn der Macher des Tools hat seine Idee komplett von anderen zusammengeklaut: Und zwar in erster Linie von Eric Meyer. Die bereitgestellte Funktionalität erhält man darüberhinaus auch schon lange über die Web Developer Toolbar des Firefox.
[01:11:44] Hype
Hype ist ein natives OS X Tool von zwei Ex-Apple-Mitarbeitern, mit dem sich CSS3-Webanimationen erstellen lassen. Soweit, so unneu. Allerdings ist Hype anscheinend das erste Tool, das versucht, allen Browsern mit ihren Möglichkeiten gerecht zu werden und von CSS3-Transitions notfalls hin zu klassichen DHTML-Animationen degradiert. Schade ist, dass es nur via Mac App Store zu haben ist und dass es keine Testversion gibt.
[01:21:19] Der Rauswerfer-Rant: weightwatchers.de: Spaß mit Chrome
Jens ist über ein neuzeitliches Kuriosum gestolpert, nämlich eine Seite, die sich noch dem Chrome verweigert und einem stattdessen die Nutzung von IE ab 5.x oder Firefox ab 1.x empfiehlt. Öffnet man die Seite in Chrome, bekommt man überdies hilfreiche Infos wie man Java im Firefox aktiviert: „Extras und dann „Web-Features“. Hier wählen Sie „Java Script aktivieren“.“ Facepalm!
Keine Schaunotizen
[01:31:39] WebGL Inspector
Eine Art Firebug für WebGL Aktivitäten
[01:31:39] Byte-saving Techniques
Verrückte Tricks, mit denen sich Zeichen in JavaScript sparen lässt.
[01:31:39] jswiki
Ein erster Versuch einer Katalogisierung und Kategorisierung der mittlerweile zahllos existierenden JavaScript-Bibliotheken
[01:31:39] CSS3 – Information and samples
CSS3-zu-Browser-Kompatibilitätstabelle
[01:31:39] HTML5 – Information and samples for HTML5 and related APIs
HTML5-zu-Browser-Kompatibilitätstabelle
[01:31:39] json:select()
Eine CSS-artige Selektorsprache, um auf Datensätze in einem JSON-Objekt zuzugreifen.
Wer den Player sucht, findet ihn auf der Startseite. Wer uns sagen kann, warum WordPress den hier nicht anzeigt, kann uns darauf hinweisen. Downloadlinks: MP3 ohne Kapitelmarken und MP4 mit Kapitelmarken (iPod-kompatibel)
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
1 hr 37 min
May 24, 2011 Revision 26: Viel Internet Explorer
Diesmal war „Schepp allein zu Haus“ angesagt, und da hab ich mir knallhart den Jens Grochtdreis, den Gründer der Webkrauts aus Mainz mit ins Boot geholt. Als bekennende IE-Masochisten stürzten wir uns beide auf diesbezüglich eingefärbte Themen (die Woche gab es allerdings auch zufällig her). Kommentare wieder gerne auf Audioboo mit dem Tag #workingdraft hinterlegen.
Schaunotizen
[00:01:23] Google Finally Delivers On Promise Of Admin-Free Chrome Frame Installs For IE
Irgendwie haben es die Google Ingenieure nun doch hinbekommen, dass man Google Chrome Frame ohne Adminrechte an seinen IE anflanschen kann. Allerdings verraten sie nicht wie. Das macht Jens stutzig und überhaupt löst es das IE-Problem ja immer noch nicht an seiner Wurzel. Aber besser als nix.
[00:10:38] Compact Navigation, Print Preview and the CSS3 Grid Layout Module
Neues Google Chrome Canary Update, erstmalig mit schicker Druckvorschau (die intern ein PDF erzeugt!) und einer ersten Fassung der zuletzt besprochenenen Visibility API. Außerdem mit CSS3 Grid Layouts, einem stark aufgemotzten Web Inspector und der polarisierenden Idee, die Adressleiste auch noch weg zu rationalisieren. Hmm…
[00:22:39] Stylesheet Limits in Internet Explorer
Eric Law von Microsoft hat mal ein paar interessante und teils schon bekannte Grenzen des IEs in Sachen Stylesheet-Parsing aufgelistet. Zunächst erscheinen einem die Limits relativ weit weg, andererseits gab es ja auch mal Leute, die behauptet haben, mehr als 64KB Speicher werde nie ein Mensch brauchen. Daher: Holzauge, sei wachsam!
[00:30:28] CSS Floats and Positioning Level 3
Überraschenderweise haben sich Microsoft und Adobe zusammengetan und eine sehr schöne Erweiterung der Float Techniken für CSS 3 vorgeschlagen, und zwar die Positioned Floats. Dabei wir auf ein Element ein float: positioned; und irgendeine position-Eigenschaft gesetzt, woraufhin anschleißend alles andere um das Element herumfließt. Egal wie und wo es hinpoistioniert wurde. Nett! Außerdem lasst sie die Element-Form per deklarativer Form oder über die Alphamaske eines Bildes beeinflussen.
[00:42:17] In defense of CSS hacks — introducing “safe CSS hacks”
Mathias Bynens hat mal eine sehr schöne Auflistung verschiedener sinnvoller/etablierter CSS-Weichen für die IEs zusammengestellt. Dabei geht es um verschiedene Verfahren auf Conditional Comments Basis, sowie um klassische Parserhacks und was da zu bedenken ist. Mit Vor- und Nachteilen. Bei den HTML5 Boilerplate machern hat der Artikel zu hektischer Betriebsamkeit geführt, weil nämlich die dort praktizierte Variante ein paar der aufgelisteten Schönheitsfehler hatte. Jens und ich waren uns aber einig, dass die das bestimmt bald wieder zurückstellen werden. Außerdem hat Jens darüber auch gebloggt.
[01:03:53] Holmes – The CSS Markup Detective
Jens muss dieses Tool leider als vollkommen uninnovative Produktkopie entlarven, denn der Macher des Tools hat seine Idee komplett von anderen zusammengeklaut: Und zwar in erster Linie von Eric Meyer. Die bereitgestellte Funktionalität erhält man darüberhinaus auch schon lange über die Web Developer Toolbar des Firefox.
[01:11:44] Hype
Hype ist ein natives OS X Tool von zwei Ex-Apple-Mitarbeitern, mit dem sich CSS3-Webanimationen erstellen lassen. Soweit, so unneu. Allerdings ist Hype anscheinend das erste Tool, das versucht, allen Browsern mit ihren Möglichkeiten gerecht zu werden und von CSS3-Transitions notfalls hin zu klassichen DHTML-Animationen degradiert. Schade ist, dass es nur via Mac App Store zu haben ist und dass es keine Testversion gibt.
[01:21:19] Der Rauswerfer-Rant: weightwatchers.de: Spaß mit Chrome
Jens ist über ein neuzeitliches Kuriosum gestolpert, nämlich eine Seite, die sich noch dem Chrome verweigert und einem stattdessen die Nutzung von IE ab 5.x oder Firefox ab 1.x empfiehlt. Öffnet man die Seite in Chrome, bekommt man überdies hilfreiche Infos wie man Java im Firefox aktiviert: „Extras und dann „Web-Features[...]
1 hr 37 min
May 17, 2011 Revision 25: Visibility API und Chromebooks
Die neuste Revision geht mit sensationell wenigen Themen ins Rennen. Woran es lag? Wir haben uns ein Opera-Themen-Verbot auferlegt, bis wir Patrick H. Lauke mal in der Sendung haben zum drüber Quatschen. Desweiteren konnte die Google I/O nicht mit ganz so viel Web-Bezogenem aufwarten. Aber wie Ihr hört, kriegen wir auch das gebügelt.
Schaunotizen
[00:00:42] jQuery 1.6.1 Released
Die jQuery-Macher sahen sich aufgrund der in der letzten Revision erwähnten Änderungen und ihrer Auswirkungen gezwungen, ein Rolle-Rückwärts-Update nachzuschieben. Version 1.6.1 stellt nun zumindest auf der attr()-Methode die verlorengegangene Kompatibilität wieder her.
[00:02:53] Page Speed Online API
Google stellt seit neustem einen Webservice bereit, über welchen man dieselben Testergebnisse und Ratschläge zur Ladegeschwindigkeit im JSON-Format erhält, die auch die Browser-Plugins sowie Page Speed Online zurückgeben. Das WordPress-Plugin W3 Total Cache nutzt diesen Dienst, um dem Benutzer Optimierungsvorschläge zu machen. Wofür man den Dienst aber in der Praxis genau gebrauchen kann, darauf wollten wir einfach nicht kommen. Hat wer eine Idee? (gerne via Audioboo mit Hash #workingdraft)
[00:08:37] Inspectable Shadow DOM, the file browser and new default avatars
Der aktuelle Canary-Build von Chrome zeigt seit neustem alle zu einem Element gehörigen Shadow-DOM-Elemente. Damit lässt sich also herausfinden, wie man per CSS an in HTML-Elementen steckende Subelemente herankommt, wie etwa dem placeholder-Text in einem HTML5-Eingabefeld, oder den Slider eines range-Inputs. Dennoch eine Insellösung.
[00:20:06] Proposal for a tab visibility API
Das Chrome Team bringt den Vorschlag zu einer „Visibility API“ bei der WHATWG ein. Über die API soll sich anfragen lassen, ob ein Fenster gerade fokussiert ist oder nicht, und wenn nicht, wie genau nicht. Außerdem soll es noch einen dazugehörigen Eventhandler geben. Markus fällt dabei ein, dass man heute schon nicht-aktive Fenster gestalten kann. Und wir drei sinnieren darüber, ob sowas wie diese API brauchbar wäre. Was meint Ihr? (gerne via Audioboo mit Hash #workingdraft)
[00:34:54] Google Chromebooks
Google stellte auf der diesjährigen Google I/O die finale Inkarnation seiner Chrome-OS-Hardware namens „Chromebooks“ vor. Im Prinzip handelt es sich dabei um 11/12-Zoll-Netbooks mit einer kleinen SSD darin. Dazu gibt es Varianten mit UMTS und hierzulande einem Jahr E-Plus gratis obendrauf. Gag des Betriebssystems ist, dass alles in der Cloud gespeichert wird (nein, nicht in Microsofts Cloud), und man seine Gurke jederzeit aus dem Fenster werfen kann, ohne seine Daten zu verlieren. Obwohl Google manche Dienste offline-fähig gemacht hat, hängt man dennoch stark am Tropf des Internets. Und damit ist es ja bei E-Plus nicht immer gut bestellt. Wir sind gespannt, was draus wird.
Keine Schaunotizen
[00:56:03] ROME – 3 Dreams of Black
Beeindruckende Demo von der Google I/O, die in einem interaktiven Musikvideo traumhafte Video-, Audio- und 3D-Elemente vermischt. Benötigt die Canary-Version des Google Chrome Browsers.
[00:56:33] Cameron Adams – Anatomy of a Mashup
Camaron Adams hat einen Song namens „Definitive Daft Punk“ als Mashup/Remix verschiedener Daft Punk Lieder erstellt, und dazu gleich auch noch eine Echtzeit-Visualisierung hinzugebaut. Sehr beeindruckend! Und bitte unbedingt die Boxen aufdrehen!
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
59 min