<p>Da eine leere Themenliste mit vollen Todo-Listen der gesamten Teams korrelierte, ließen Schepp, Hans, Kahlil und Peter eine Woche ausfallen, nur dann umso nerdiger zuzuschlagen.</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:00:16] <a href="http://blogs.msdn.com/b/ie/archive/2012/01/20/ie10-compat-inspector.aspx">IE10 Compat Inspector</a></dt>
<dd>Falls ihr Sorge hat, dass eure IE9-optimierte Webseite nicht im IE10 funktionieren könnte, hilft euch dieses Migrations-Tool. Jup, das ist genau so nötig wie ihr euch jetzt gerade denkt.</dd>
<dt>[00:05:50] <a href="http://blogs.msdn.com/b/ie/archive/2012/01/25/debugging-indexeddb-applications.aspx">IDBExplorer</a></dt>
<dd>Ein paar Microsoft-Programmierer haben das UI-Design-Team deportiert und dann heimlich ein Interface für <a href="http://www.w3.org/TR/IndexedDB/">Indexed Database</a> gebaut. Das sieht zwar selbst nach den Maßstäben eines DB-Interfaces grauslig aus, aber wir unterstellen mal, dass es funktioniert und honorieren den guten Willen. Wer IndexedDB tatsächlich benutzen möchte, dem sei der <a href="https://github.com/jensarps/IDBWrapper">IDBWrapper</a> zwecks Browservereinheitlichung empfohlen.</dd>
<dt>[00:10:55] <a href="http://pik6.peterkroener.de/">Pik6</a></dt>
<dd>Ein weiteres HTML5-Präsentationsframework. Gähn! Allerdings hat dieses Exemplar zwei Vorteile: es stammt aus der Feder von Peter und als ob das noch nicht überzeugend genug wäre, bietet es obendrein noch einen Presenter Mode!</dd>
<dt>[00:17:07] <a href="http://www.w3.org/TR/css3-images/">Wieder eine neue Gradient-Syntax! WTF?</a></dt>
<dd>Nachdem ich sich alle Browser auf eine einheitliche Syntax für CSS3-Farbverläufe geeinigt haben kommt nun das W3C daher und spezifiziert nochmal Neuerungen. Die finden wir zwar im Prinzip gut, aber ganz ehrlich&#8230; muss das sein?</dd>
<dt>[00:29:20] <a href="http://jekyllbootstrap.com/">Jekyll Bootstrap</a></dt>
<dd>Wem WordPress nicht nerdig genug ist, der bloggt mit <a href="http://jekyllrb.com/">Jekyll</a>, das aus einfachem Text mundgerechtes HTML produziert. Jekyll Bootstrap ist ein Framework, das den Weg zum nerdigen Blog etwas ebnet, Motto: <q>Zero to Hosted Jekyll Blog in 3 Minutes</q>. Wer sein CMS zwar auch gerne klein, aber nicht so nerdig haben mag, dem empfehlen wir <a href="http://getkirby.com">Kirby</a>.</dd>
<dt>[00:42:53] <a href="https://github.com/geddesign/wrap.js">Wrap.js</a></dt>
<dd>Ein Wrapper, der herkömmlichen JS-Code im Autopiloten-Modus in AMD-Module verwandelt. Nützlich für Dependency Management.</dd>
</dl>
<h3>[00:46:45] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://www.useragentman.com/blog/2011/10/29/clipping-jpeg-images-into-non-rectangular-polygons-using-polyclip-js/">PolyClip</a></dt>
<dd>Alphakanäle für JPGs? Kein Problem mit polyclip.js und etwas HTML5-Magie.</dd>
<dt><a href="http://twitter.github.com/hogan.js/">Hogan.js</a></dt>
<dd>Eine JavaScript-Templatingengine aus dem Hause Twitter, die durch ihre Geschwindigkeit überzeugt.</dd>
</dl>


Da eine leere Themenliste mit vollen Todo-Listen der gesamten Teams korrelierte,
ließen Schepp, Hans, Kahlil und Peter eine Woche ausfallen, nur dann umso
nerdiger zuzuschlagen.


SCHAUNOTIZEN

[00:00…

Working Draft

Da eine leere Themenliste mit vollen Todo-Listen der gesamten Teams korrelierte,
ließen Schepp, Hans, Kahlil und Peter eine Woche ausfallen, nur dann umso
nerdiger zuzuschlagen.


SCHAUNOTIZEN

[00:00:16] IE10 COMPAT INSPECTOR

Falls ihr Sorge hat, dass eure IE9-optimierte Webseite nicht im IE10
funktionieren könnte, hilft euch dieses Migrations-Tool. Jup, das ist genau so
nötig wie ihr euch jetzt gerade denkt.

[00:05:50] IDBEXPLORER

Ein paar Microsoft-Programmierer haben das UI-Design-Team deportiert und dann
heimlich ein Interface für Indexed Database gebaut. Das sieht zwar selbst nach
den Maßstäben eines DB-Interfaces grauslig aus, aber wir unterstellen mal, dass
es funktioniert und honorieren den guten Willen. Wer IndexedDB tatsächlich
benutzen möchte, dem sei der IDBWrapper zwecks Browservereinheitlichung
empfohlen.

[00:10:55] PIK6

Ein weiteres HTML5-Präsentationsframework. Gähn! Allerdings hat dieses Exemplar
zwei Vorteile: es stammt aus der Feder von Peter und als ob das noch nicht
überzeugend genug wäre, bietet es obendrein noch einen Presenter Mode!

[00:17:07] WIEDER EINE NEUE GRADIENT-SYNTAX! WTF?

Nachdem ich sich alle Browser auf eine einheitliche Syntax für CSS3-Farbverläufe
geeinigt haben kommt nun das W3C daher und spezifiziert nochmal Neuerungen. Die
finden wir zwar im Prinzip gut, aber ganz ehrlich… muss das sein?

[00:29:20] JEKYLL BOOTSTRAP

Wem WordPress nicht nerdig genug ist, der bloggt mit Jekyll, das aus einfachem
Text mundgerechtes HTML produziert. Jekyll Bootstrap ist ein Framework, das den
Weg zum nerdigen Blog etwas ebnet, Motto: Zero to Hosted Jekyll Blog in 3
Minutes. Wer sein CMS zwar auch gerne klein, aber nicht so nerdig haben mag, dem
empfehlen wir Kirby.

[00:42:53] WRAP.JS

Ein Wrapper, der herkömmlichen JS-Code im Autopiloten-Modus in AMD-Module
verwandelt. Nützlich für Dependency Management.


[00:46:45] KEINE SCHAUNOTIZEN

POLYCLIP

Alphakanäle für JPGs? Kein Problem mit polyclip.js und etwas HTML5-Magie.

HOGAN.JS

Eine JavaScript-Templatingengine aus dem Hause Twitter, die durch ihre
Geschwindigkeit überzeugt.

Revision 57: IDBExplorer, Gradient Syntax & Wrap.js

<p><a href="http://twitter.com/#!/sir_pepe">Peter</a> und <a href="http://twitter.com/#!/derSchepp">Schepp</a> luden sich den <a href="http://twitter.com/#!/MadeMyDay">Marc</a> ein, und zu dritt sprachen man über&#8230;</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:00:15] <a href="http://somadesign.ca/demos/better-google-fonts/">Google Web Fonts Families</a></dt>
<dd>Eine praktische Gesamtübersicht aller Schnitte aller Google Webfonts</dd>
<dt>[00:10:00] <a href="http://badassjs.com/post/16355968400/font-js-a-powerful-font-toolkit-for-javascript">Font.js: A Powerful Font Toolkit for JavaScript</a></dt>
<dd>Font.js rüstet eingebettete Schriften mit Load-Events nach.</dd>
<dt>[00:22:00] <a href="http://www.w3.org/TR/2012/WD-css3-ui-20120117/#nav-index0">CSS Basic User Interface Module Level 3 (CSS3 UI)</a></dt>
<dd>Wir entdeckten etwas Praktisches in diesem Working Draft, das Opera schon <a href="http://dev.opera.com/articles/view/opera-9-5-the-next-generation-of-web-s/#css3">seit Version 9.5</a> implementiert, und das speziell <a href="http://dev.opera.com/articles/view/tweaking-spatial-navigation-for-tv-browsing/">auf Fernsehern hilfreich ist</a>: die Keyboard Control Eigenschaften.</dd>
<dt>[00:29:27] <a href="http://www.golem.de/1201/89166.html">WebRTC</a></dt>
<dd>WebRTC ist ein größeres API-Baustein-Paket, mit dem sich alle Aufgaben von Echtzeitkommunikation (Telefonie und Videotelefonie) im Browser abwickeln lassen. Erfunden hat&#8217;s Google, aber mit an Board sind auch Opera und <a href="http://mozillalabs.com/rainbow/2011/08/04/whats-next-rainbow-and-webrtc/">Mozilla</a>. Außerdem sprachen wir den auf WebRTC und Flash basierenden <a href="https://plus.google.com/115133653231679625609/posts/hAmrzBxEPWU">getUserMedia-Polyfill von Addy Osmani</a> an.</dd>
<dt>[00:39:05] <a href="http://www.wunderkit.com">Wunderkit</a></dt>
<dd>Wunderkit will ein Projektmanagment- und Organisationswerkzeug sein. Im Vorfeld wurde eine hohe Erwartungshaltung erzeugt, so dass mit der nun startenden Beta ein regelrechter Hype darum entbrannt ist. Wir klären, ob das gerechtfertigt ist oder nicht.</dd>
<dt>[00:53:48] <a href="http://trello.com">Trello</a></dt>
<dd>Von Wunderkit kamen wir zu Trello. Trello ist eine Art digitales Karteikartensystem und wir nutzen es seit kurzem, um unsere Sendungsthemen zu sammeln, zu sieben und zu sortieren.</dd>
</dl>
<h3>[00:57:30] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://gridpak.com/about/">Gridpak</a></dt>
<dd>Ein responsive Grid Generator.</dd>
<dt><a href="http://www.yaml.de/">YAML 4 ist da!</a></dt>
<dd>Ein neues Major Release von YAML ist raus. YAML ist ein Layoutframework, das ausnahmsweise mal nicht gridbasiert ist, das aber trotzdem alles kann, und das auch noch in allen Browsern bis hinunter zum IE7er. Was ist in Version 4 neu? Responsiveness und CSS-Klassen-Namespacing. Parallel zu uns hat sich die <a href="http://technikwuerze.de">Technikwürze</a> mit dem Macher <a href="www.highresolution.info">Dirk Jesse</a> und weiteren Gästen <a href="http://technikwuerze.de/podcast/technikwuerze-184-yaml-total/">über YAML 4 unterhalten</a>.</dd>
<dt><a href="http://getkirby.com/">Kirby</a></dt>
<dd>Ein datenbankfreies und damit rein dateisystembasiertes Content Management System. Für wenn was mal schnell und unkompliziert gehen soll (und das tut es!). Mehr Infos gibt es auch wieder drüben in der Technikwürze, und zwar in der <a href="http://technikwuerze.de/podcast/technikwuerze-183-kirby-total/">Folge &#8222;Kirby total&#8220;</a>.</dd>
<dt><a href="http://html5-demos.appspot.com/static/html5-therealbleedingedge/template/index.html#1">The Edge of HTML5</a></dt>
<dd>Alles, was gerade im HTML5-Kosmos geil und heiss ist in einer Präsentation versammelt. Schön, dass wir das meiste schon in der Sendung hatten! :)</dd>
<dt><a href="https://github.com/WebReflection/es6-collections">ES6 Harmony Collections Fast Polyfill</a></dt>
<dd>Eine JavaScript-Bibliothek von <a href="http://webreflection.blogspot.com/">Andrea Giammarchi</a> aus Berlin, die die neuen Funktionen von ECMAScript 6 Harmony in jedem Browser emuliert.</dd>
<dt><a href="https://github.com/ericam/compass-animation">Animation Compass Plugin</a></dt>
<dd>Dieses Plugin rüstet in COMPASS die bislang fehlenden CSS3 Animationen nach.</dd>
<dt><a href="http://html5please.us/">HTML5 Please</a></dt>
<dd>Verzeichnis aller HTML5 und CSS3 Bestandteile, mit Filter- und Suchfunktionen und Hinweisen zum aktuellen Stand der Benutzbarkeit.</dd>
</dl>


Peter und Schepp luden sich den Marc ein, und zu dritt sprachen man über…


SCHAUNOTIZEN

[00:00:15] GOOGLE WEB FONTS FAMILIES

Eine praktische Gesamtübersicht aller Schnitte aller Google Webfonts

[0…

Peter und Schepp luden sich den Marc ein, und zu dritt sprachen man über…


SCHAUNOTIZEN

[00:00:15] GOOGLE WEB FONTS FAMILIES

Eine praktische Gesamtübersicht aller Schnitte aller Google Webfonts

[00:10:00] FONT.JS: A POWERFUL FONT TOOLKIT FOR JAVASCRIPT

Font.js rüstet eingebettete Schriften mit Load-Events nach.

[00:22:00] CSS BASIC USER INTERFACE MODULE LEVEL 3 (CSS3 UI)

Wir entdeckten etwas Praktisches in diesem Working Draft, das Opera schon seit
Version 9.5 implementiert, und das speziell auf Fernsehern hilfreich ist: die
Keyboard Control Eigenschaften.

[00:29:27] WEBRTC

WebRTC ist ein größeres API-Baustein-Paket, mit dem sich alle Aufgaben von
Echtzeitkommunikation (Telefonie und Videotelefonie) im Browser abwickeln
lassen. Erfunden hat’s Google, aber mit an Board sind auch Opera und Mozilla.
Außerdem sprachen wir den auf WebRTC und Flash basierenden getUserMedia-Polyfill
von Addy Osmani an.

[00:39:05] WUNDERKIT

Wunderkit will ein Projektmanagment- und Organisationswerkzeug sein. Im Vorfeld
wurde eine hohe Erwartungshaltung erzeugt, so dass mit der nun startenden Beta
ein regelrechter Hype darum entbrannt ist. Wir klären, ob das gerechtfertigt ist
oder nicht.

[00:53:48] TRELLO

Von Wunderkit kamen wir zu Trello. Trello ist eine Art digitales
Karteikartensystem und wir nutzen es seit kurzem, um unsere Sendungsthemen zu
sammeln, zu sieben und zu sortieren.


[00:57:30] KEINE SCHAUNOTIZEN

GRIDPAK

Ein responsive Grid Generator.

YAML 4 IST DA!

Ein neues Major Release von YAML ist raus. YAML ist ein Layoutframework, das
ausnahmsweise mal nicht gridbasiert ist, das aber trotzdem alles kann, und das
auch noch in allen Browsern bis hinunter zum IE7er. Was ist in Version 4 neu?
Responsiveness und CSS-Klassen-Namespacing. Parallel zu uns hat sich die
Technikwürze mit dem Macher Dirk Jesse und weiteren Gästen über YAML 4
unterhalten.

KIRBY

Ein datenbankfreies und damit rein dateisystembasiertes Content Management
System. Für wenn was mal schnell und unkompliziert gehen soll (und das tut es!).
Mehr Infos gibt es auch wieder drüben in der Technikwürze, und zwar in der Folge
„Kirby total“.

THE EDGE OF HTML5

Alles, was gerade im HTML5-Kosmos geil und heiss ist in einer Präsentation
versammelt. Schön, dass wir das meiste schon in der Sendung hatten! :)

ES6 HARMONY COLLECTIONS FAST POLYFILL

Eine JavaScript-Bibliothek von Andrea Giammarchi aus Berlin, die die neuen
Funktionen von ECMAScript 6 Harmony in jedem Browser emuliert.

ANIMATION COMPASS PLUGIN

Dieses Plugin rüstet in COMPASS die bislang fehlenden CSS3 Animationen nach.

HTML5 PLEASE

Verzeichnis aller HTML5 und CSS3 Bestandteile, mit Filter- und Suchfunktionen
und Hinweisen zum aktuellen Stand der Benutzbarkeit.

Revision 56: Font.js, CSS3 UI & Wunderkit

<p>Diese Woche widmen sich <a href="http://twitter.com/#!/kahlillechelt">Kahlil</a> und <a href="http://twitter.com/#!/derSchepp">Schepp</a> einer Menge kleinerer Webfundstücke und Tools. Als da wären:</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:00:40] <a href="http://shichuan.github.com/javascript-patterns/">JavaScript Pattern Collection</a></dt>
<dd>Inspiriert und zusammengesammelt von vielen Quellen findet man hier Best-Practice-Code zur Lösung verschiedenster Aufgabenstellungen.</dd>
<dt>[00:03:50] <a href="http://www.kendoui.com/blogs/teamblog/posts/12-01-06/what_you_may_not_know_about_jquery.aspx?utm_source=javascriptweekly&#038;utm_medium=email">What You May Not Know About jQuery</a></dt>
<dd>Im Blog des jQuery Frameworks Kendo UI werden selten beachtete, aber nicht minder praktische jQuery Methoden beleuchtet.</dd>
<dt>[00:11:40] <a href="http://www.sublimetext.com/2">Sublime Text 2</a></dt>
<dd>Der leichtgewichtige und featurestarke Editor Sublime Text geht bald in die zweite Runde. Aktuell wird an der Beta gewerkelt und es gibt ihn für alle Desktop-Plattformen.</dd>
<dt>[00:15:41] <a href="http://cssdeck.com/">CSSDeck</a></dt>
<dd>CSSDeck klaut zwar das Design von <a href="http://dribbble.com/">Dribbble</a>, will aber kein Showcase für Design- sondern für CSS-Fähigkeiten sein. Zum direkt online Loscoden bietet es eine Art <a href="http://jsfiddle.net/">JSFiddle</a>/<a href="http://dabblet.com/">Dabblet</a> Interface, zu finden unter &#8222;<a href="http://cssdeck.com/t">Play</a>&#8222;.</dd>
<dt>[00:20:41] <a href="http://www.smashingmagazine.com/">Smashing Magazine Redesign</a></dt>
<dd>Das Smashing Magazine hat letzte Woche auf ein massivst responsives Layout umgestellt. Wir bequatschen, wo die Operation geglückt und wo eher missglückt ist.</dd>
<dt>[00:35:37] <a href="http://acko.net/blog/making-love-to-webkit/">Making Love to WebKit</a></dt>
<dd>Der Designer Steven Wittens hat seine Seite relaunched und sie komplett in 3D gebaut. Die Perspektive ist gekoppelt an die Scrollposition und verschiebt sich nach 2D, sobald man die Seite ein wenig herunterscrollt.</dd>
<dt>[00:41:58] <a href="http://livereload.com/">Live Reload</a></dt>
<dd>Live Reload ist ein Tool für Mac, das nur in einer instabilen Alpha für Windows vorliegt, und welches SASS/LESS/Stylus Dateien automatisch kompiliert und die resultierenden Styles live im gerade offenen Browser austauscht. Fast ähnlich läuft es mit JavaScript.</dd>
<dt>[00:46:08] <a href="http://peter.sh/2012/01/font-css-properties-selector-source-location-and-calc-tests/">Neues in WebKit</a></dt>
<dd>
<ul>
<li>Es wird daran gearbeitet, dass WebKit bald mit <a href="http://www.w3.org/TR/css3-values/#calc">CSS calc(), min() and max()</a> umgehen kann.</li>
<li>Auch in WebKit halten die ersten <a href="http://ie.microsoft.com/testdrive/Graphics/opentype/opentype-fontbureau/index.html">OpenType Features</a> Einzug, nämlich Kerning und Ligaturen.</li>
<li>In Chromes JavaScript Engine V8 lassen sich erste <a href="http://erik.eae.net/archives/2011/12/29/00.00.29/">ES.Next / JavaScript Harmony Features aktivieren und ausprobieren</a></li>
</ul>
</dd>
</dl>
<h3>[00:55:38] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://codebrief.com/2012/01/the-top-10-javascript-mvc-frameworks-reviewed/">The Top 10 Javascript MVC Frameworks Reviewed</a></dt>
<dd>Gegenüberstellung verschiedener JavaScript MVC Frameworks.</dd>
<dt><a href="http://thinkpixellab.com/pxloader/">PxLoader</a></dt>
<dd>JavaScript Bibliothek zum Vorladen von Ressourcen.</dd>
<dt><a href="http://www.jqmobi.com/">jQ.Mobi</a></dt>
<dd>Ein neues mobile Web Framework à la jQuery Mobile und Sencha Touch.</dd>
</dl>


Diese Woche widmen sich Kahlil und Schepp einer Menge kleinerer Webfundstücke
und Tools. Als da wären:


SCHAUNOTIZEN

[00:00:40] JAVASCRIPT PATTERN COLLECTION

Inspiriert und zusammengesammelt von vi…

Diese Woche widmen sich Kahlil und Schepp einer Menge kleinerer Webfundstücke
und Tools. Als da wären:


SCHAUNOTIZEN

[00:00:40] JAVASCRIPT PATTERN COLLECTION

Inspiriert und zusammengesammelt von vielen Quellen findet man hier
Best-Practice-Code zur Lösung verschiedenster Aufgabenstellungen.

[00:03:50] WHAT YOU MAY NOT KNOW ABOUT JQUERY

Im Blog des jQuery Frameworks Kendo UI werden selten beachtete, aber nicht
minder praktische jQuery Methoden beleuchtet.

[00:11:40] SUBLIME TEXT 2

Der leichtgewichtige und featurestarke Editor Sublime Text geht bald in die
zweite Runde. Aktuell wird an der Beta gewerkelt und es gibt ihn für alle
Desktop-Plattformen.

[00:15:41] CSSDECK

CSSDeck klaut zwar das Design von Dribbble, will aber kein Showcase für Design-
sondern für CSS-Fähigkeiten sein. Zum direkt online Loscoden bietet es eine Art
JSFiddle/Dabblet Interface, zu finden unter „Play„.

[00:20:41] SMASHING MAGAZINE REDESIGN

Das Smashing Magazine hat letzte Woche auf ein massivst responsives Layout
umgestellt. Wir bequatschen, wo die Operation geglückt und wo eher missglückt
ist.

[00:35:37] MAKING LOVE TO WEBKIT

Der Designer Steven Wittens hat seine Seite relaunched und sie komplett in 3D
gebaut. Die Perspektive ist gekoppelt an die Scrollposition und verschiebt sich
nach 2D, sobald man die Seite ein wenig herunterscrollt.

[00:41:58] LIVE RELOAD

Live Reload ist ein Tool für Mac, das nur in einer instabilen Alpha für Windows
vorliegt, und welches SASS/LESS/Stylus Dateien automatisch kompiliert und die
resultierenden Styles live im gerade offenen Browser austauscht. Fast ähnlich
läuft es mit JavaScript.

[00:46:08] NEUES IN WEBKIT

 * Es wird daran gearbeitet, dass WebKit bald mit CSS calc(), min() and max()
   umgehen kann.
 * Auch in WebKit halten die ersten OpenType Features Einzug, nämlich Kerning
   und Ligaturen.
 * In Chromes JavaScript Engine V8 lassen sich erste ES.Next / JavaScript
   Harmony Features aktivieren und ausprobieren


[00:55:38] KEINE SCHAUNOTIZEN

THE TOP 10 JAVASCRIPT MVC FRAMEWORKS REVIEWED

Gegenüberstellung verschiedener JavaScript MVC Frameworks.

PXLOADER

JavaScript Bibliothek zum Vorladen von Ressourcen.

JQ.MOBI

Ein neues mobile Web Framework à la jQuery Mobile und Sencha Touch.

Revision 55: Webfundstücke und Devtools

<p>Frohes Neues wünschen wir Euch allen! <a href="http://twitter.com/#!/sirpepe">Peter</a> und <a href="http://twitter.com/#!/derSchepp">Schepp</a> reden über:</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:00:19] <a href="http://www.mozilla.org/de/firefox/">Firefox</a></dt>
<dd>Die nächsten Feuerfüchse warten mit einer ganzen Reihe wünschenswerter Neuerungen auf:</p>
<ul>
<li><a href="https://twitter.com/#!/brianbondy/statuses/154935867650224128">Der Firefox Nightly arbeitet nun wie Chrome mit Silent Updates</li>
<li><a href="http://blog.mozilla.com/addons/2012/01/05/default-compatibility-is-coming-and-your-help-is-needed/">Ab Firefox 10 sind Add-ons, umgekehrt zu früher, per se kompatibel</li>
<li><a href="http://blog.pearce.org.nz/2011/12/changes-to-dom-full-screen-api-in.html">Firefox 11 verbessert das Verhalten der Fullscreen API</a></li>
<li><a href="http://www.golem.de/1201/88956.html">Firefox 10 wird es für &#8222;Schlipse&#8220; (Corporate) in einer besonderen Extended Support Release (ESR) Version geben</a></li>
</ul>
</dd>
<dt>[00:23:48] <a href="http://www.w3.org/html/wg/next/markup/">Proposed HTML elements and attributes</a></dt>
<dd>Für HTML.Next sind eine Reihe neuer HTML-Bausteine angedacht, deren Umfang und Sinn wir erforschen.</dd>
<dt>[00:35:25] <a href="http://ie.microsoft.com/testdrive/Graphics/opentype/opentype-fontbureau/index.html">The New Web Typography</a></dt>
<dd>Firefox 8 und Internet Explorer 10 sind die ersten Browser, die für uns die ganzen Zusatzfeatures von OpenType Schriften wie Small Caps, Ligaturen, Numerale, Kerning, Fractions oder Alternative Zeichen freilegen. Da läuft dem Typo-Affiniado das Wasser im Munde zusammen!</dd>
<dt>[00:40:33] <a href="http://perfectionkills.com/profiling-css-for-fun-and-profit-optimization-notes/">Profiling CSS for fun and profit. Optimization notes.</a></dt>
<dd>Juriy Zaytsev alias Kangax hat sich mal die neuen CSS Style Profiler von <a href="http://my.opera.com/dragonfly/blog/style-profiler-preview">Opera</a> und <a href="http://peter.sh/2012/01/css-selector-profiler-source-mapping-and-software-rendering/">WebKit</a> geschnappt und eine bestehende Single Page Webapp auf Selector- und CSS3 Performance hin abgeklappert. Uns kommt während des Gesprächs der <a href="http://css1k.com/#moonlight">CSS1K-Wettbewerb als CSS3-Belastungstest</a> sowie eine <a href="http://go.eatworms.com/mseeley-2011-09-27-html5devconf.pdf">Präsentation des UI Engineers von Netflix (PDF)</a> in den Sinn.</dd>
<dt>[00:55:20] <a href="http://www.nczonline.net/blog/2012/01/04/proposal-scripting-detection-using-css-media-queries/">Proposal: Scripting detection using CSS media queries</a></dt>
<dd>Nicholas Zakas schlägt als neue Media Query Abfrage <a href="http://lists.w3.org/Archives/Public/www-style/2012Jan/0046.html">das Ab- oder Vorhandensein von JavaScript vor</a>, um in Zukunft auf den Workaround des .js/.no-js-Klassenverteilens verzichten zu können. Außerdem fanden wie das Script <a href="http://rezitech.github.com/syze/">SYZE.js</a> als Ersatz für Media Queries ganz nett.</dd>
</dl>
<h3>[01:11:57] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://filamentgroup.com/lab/a_fix_for_the_ios_orientationchange_zoom_bug/">A Fix for the iOS Orientationchange Zoom Bug</a></dt>
<dd>Scott Jehl von der Filament Group hat einen neuen Fix für das Rotieren von Seiten auf iOS-Devices gebaut. Und zwar als er <a href="https://twitter.com/#!/scottjehl/status/155112110173597697">gerade in Kambodscha den Mekong auf einem Boot raufschipperte</a>. Der Fix ist quasi der Nachfolger desjenigen im <a href="http://html5boilerplate.com/mobile">Mobile Boilerplate</a>.</dd>
<dt><a href="http://bartaz.github.com/impress.js/">Impress.js</a></dt>
<dd>Impress.js ist eine Präsentationsframework, das wie <a href="http://prezi.com/">Prezi</a> funktioniert, dabei allerdings nicht auf Flash sondern auf CSS3 baut. Sehr schick!</dd>
<dt><a href="https://twitter.com/#!/kangax/status/153955271725690882">Fabric now has (almost complete) SVG export</a></dt>
<dd>Der oben erwähnte Kangax ist auch der Macher von <a href="https://github.com/kangax/fabric.js/">Fabric.js</a>, einer Canvas-Manipulationsbibliothek für JavaScript (und Node.js). Nachdem diese letztens in Version 0.5 gelernt hat, SVG nach Canvas zu importieren, beherrscht sie nun auch den Export nach SVG.</dd>
<dt><a href="http://shoptalkshow.com/">ShopTalk &#8211; A live web design and development podcast by Chris Coyier and Dave Rupert.</a></dt>
<dd>Dieser Podcast könnte interessant werden. In der ersten Folge zu Gast ist Jonathan Snook, der am 15. März auch einen <a href="http://smacss.com/workshops/">Workshop in Essen zum Thema SMACSS</a> geben wird.</dd>
<dt><a href="ftp://ftp.ccc.de/congress/2011/">FTP Server des Chaos Computer Club mit allen 28C3-Vorträgen zum Download.</a></dt>
<dd>Bei den Videos geht um Hacking im Allgemeinen, hier und da aber speziell auch ums Web Hacking.</dd>
</dl>


Frohes Neues wünschen wir Euch allen! Peter und Schepp reden über:


SCHAUNOTIZEN

[00:00:19] FIREFOX

Die nächsten Feuerfüchse warten mit einer ganzen Reihe wünschenswerter
Neuerungen auf:



 * Der …

Frohes Neues wünschen wir Euch allen! Peter und Schepp reden über:


SCHAUNOTIZEN

[00:00:19] FIREFOX

Die nächsten Feuerfüchse warten mit einer ganzen Reihe wünschenswerter
Neuerungen auf:



 * Der Firefox Nightly arbeitet nun wie Chrome mit Silent Updates
 * Ab Firefox 10 sind Add-ons, umgekehrt zu früher, per se kompatibel
 * Firefox 11 verbessert das Verhalten der Fullscreen API
 * Firefox 10 wird es für „Schlipse“ (Corporate) in einer besonderen Extended
   Support Release (ESR) Version geben

[00:23:48] PROPOSED HTML ELEMENTS AND ATTRIBUTES

Für HTML.Next sind eine Reihe neuer HTML-Bausteine angedacht, deren Umfang und
Sinn wir erforschen.

[00:35:25] THE NEW WEB TYPOGRAPHY

Firefox 8 und Internet Explorer 10 sind die ersten Browser, die für uns die
ganzen Zusatzfeatures von OpenType Schriften wie Small Caps, Ligaturen,
Numerale, Kerning, Fractions oder Alternative Zeichen freilegen. Da läuft dem
Typo-Affiniado das Wasser im Munde zusammen!

[00:40:33] PROFILING CSS FOR FUN AND PROFIT. OPTIMIZATION NOTES.

Juriy Zaytsev alias Kangax hat sich mal die neuen CSS Style Profiler von Opera
und WebKit geschnappt und eine bestehende Single Page Webapp auf Selector- und
CSS3 Performance hin abgeklappert. Uns kommt während des Gesprächs der
CSS1K-Wettbewerb als CSS3-Belastungstest sowie eine Präsentation des UI
Engineers von Netflix (PDF) in den Sinn.

[00:55:20] PROPOSAL: SCRIPTING DETECTION USING CSS MEDIA QUERIES

Nicholas Zakas schlägt als neue Media Query Abfrage das Ab- oder Vorhandensein
von JavaScript vor, um in Zukunft auf den Workaround des
.js/.no-js-Klassenverteilens verzichten zu können. Außerdem fanden wie das
Script SYZE.js als Ersatz für Media Queries ganz nett.


[01:11:57] KEINE SCHAUNOTIZEN

A FIX FOR THE IOS ORIENTATIONCHANGE ZOOM BUG

Scott Jehl von der Filament Group hat einen neuen Fix für das Rotieren von
Seiten auf iOS-Devices gebaut. Und zwar als er gerade in Kambodscha den Mekong
auf einem Boot raufschipperte. Der Fix ist quasi der Nachfolger desjenigen im
Mobile Boilerplate.

IMPRESS.JS

Impress.js ist eine Präsentationsframework, das wie Prezi funktioniert, dabei
allerdings nicht auf Flash sondern auf CSS3 baut. Sehr schick!

FABRIC NOW HAS (ALMOST COMPLETE) SVG EXPORT

Der oben erwähnte Kangax ist auch der Macher von Fabric.js, einer
Canvas-Manipulationsbibliothek für JavaScript (und Node.js). Nachdem diese
letztens in Version 0.5 gelernt hat, SVG nach Canvas zu importieren, beherrscht
sie nun auch den Export nach SVG.

SHOPTALK – A LIVE WEB DESIGN AND DEVELOPMENT PODCAST BY CHRIS COYIER AND DAVE
RUPERT.

Dieser Podcast könnte interessant werden. In der ersten Folge zu Gast ist
Jonathan Snook, der am 15. März auch einen Workshop in Essen zum Thema SMACSS
geben wird.

FTP SERVER DES CHAOS COMPUTER CLUB MIT ALLEN 28C3-VORTRÄGEN ZUM DOWNLOAD.

Bei den Videos geht um Hacking im Allgemeinen, hier und da aber speziell auch
ums Web Hacking.

Revision 54: Ein Sack voll Firefox, lahmes CSS und Media Queries

<p>Am 21.12.2011 fand das <a href="http://www.meetup.com/The-SmashingMagazine-Meetup/events/42026332/">dritte Smashing Magazine Meetup</a> statt, diesmal in Zusammenarbeit mit der <a href="http://stuttgart.gtugs.org/">Stuttgarter Google Technology Usergroup</a> in&#8230; ähm ja Stuttgart. Zu Besuch waren <a href="http://twitter.com/#!/paul_irish">Paul Irish</a> von Google, dessen Bruder in Stuttgart lebt und den er besuchte, sowie <a href="http://twitter.com/#!/codepo8">Chris Heilmann</a> von Mozilla, der auf Heimatbesuch war. Beide hielten je einen Vortrag: <a href="http://vimeo.com/34332821">History of HTML5 and The New Vocabulary of Web Dev</a> und <a href="http://vimeo.com/34333188">&#8222;Style and Distance &#8211; you don&#8217;t need to burn the museum to create a new world&#8220;</a>.</p>
<p>Wer auch da war, das waren Kahlil, Hans und Rodney. Dank <a href="http://twitter.com/#!/lilaineurope">Lisa</a> und <a href="http://twitter.com/#!/smashingmag">Vitaly</a> vom <a href="http://www.smashingmagazine.com">Smashing Mag</a> durften wir eine schöne Paneldiskussion auf die Beine stellen. Mit Hans an der Kamera interviewten Kahlil und Rodney Paul, Vitaly und Chris zu Themen wie Alphatier-Gekabbel, Sprachbarrieren, Wissensvermittlung, mobilen Geräten oder nativen UI-Elementen.</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:13:02] <a href="http://www.youtube.com/watch?v=va9xlJCbDZI">Smashing Magazine Meetup &#8211; Die Paneldiskussion</a></dt>
<dd style="margin: 0; padding: 0;"><iframe src="http://www.youtube.com/embed/U35O2Zd63AE?rel=0" frameborder="0" width="640" height="360"></iframe></dd>
</dl>


Am 21.12.2011 fand das dritte Smashing Magazine Meetup statt, diesmal in
Zusammenarbeit mit der Stuttgarter Google Technology Usergroup in… ähm ja
Stuttgart. Zu Besuch waren Paul Irish von Google, des…

Am 21.12.2011 fand das dritte Smashing Magazine Meetup statt, diesmal in
Zusammenarbeit mit der Stuttgarter Google Technology Usergroup in… ähm ja
Stuttgart. Zu Besuch waren Paul Irish von Google, dessen Bruder in Stuttgart
lebt und den er besuchte, sowie Chris Heilmann von Mozilla, der auf Heimatbesuch
war. Beide hielten je einen Vortrag: History of HTML5 and The New Vocabulary of
Web Dev und „Style and Distance – you don’t need to burn the museum to create a
new world“.

Wer auch da war, das waren Kahlil, Hans und Rodney. Dank Lisa und Vitaly vom
Smashing Mag durften wir eine schöne Paneldiskussion auf die Beine stellen. Mit
Hans an der Kamera interviewten Kahlil und Rodney Paul, Vitaly und Chris zu
Themen wie Alphatier-Gekabbel, Sprachbarrieren, Wissensvermittlung, mobilen
Geräten oder nativen UI-Elementen.


SCHAUNOTIZEN

[00:13:02] SMASHING MAGAZINE MEETUP – DIE PANELDISKUSSION

Revision 53: At the Smashing Magazine meetup!

<p>Nach seiner Endjahres-Ochsentour, endlich mal wieder eine Revision mit <a href="http://twitter.com/#!/sirpepe">Peter</a>. Außerdem dabei <a href="http://twitter.com/#!/kahlillechelt">Kahlil</a> und <a href="http://twitter.com/#!/derSchepp">Schepp</a>. Hierüber reden wir:</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:00:11] <a href="http://dabblet.com/">Dabblet</a></dt>
<dd>Ein JSFiddle für CSS, mit GitHub-Gist-Anbindung, von Lea Verou</dd>
<dt>[00:10:55] <a href="http://addyosmani.com/blog/autosave-changes-chrome-dev-tools/">Auto-saving CSS And JavaScript Changes Locally From The Chrome Developer Tools</a></dt>
<dd>Eine Chrome-Erweiterung und eine lokale Node.js-Instanz machen es zusammen möglich, JS- und CSS-Änderungen, die man in den Chrome DevTools vornimmt, sofort lokal und dauerhaft ins Projekt zu übernehmen.</dd>
<dt>[00:17:46] <a href="http://www.sencha.com/blog/galaxy-nexus-the-html5-developer-scorecard/">Android—Ice Cream Sandwich: The HTML5 Developer Scorecard</a></dt>
<dd>Die Sencha Labs haben den Fähigkeiten des neuen Android-Browsers auf den Zahn gefühlt. Er ist ganz gut, zieht aber nie und nimmer an iOS 5 vorbei. Wir gehen außerdem noch auf einen Bug in den älteren Android Browsern ein, die zwar behaupten, CSS Animationen zu können, <a href="http://daneden.me/2011/12/putting-up-with-androids-bullshit/">dabei allerdings schwer patzen</a>. Während unseres Gesprächs fällt der Hinweis auf <a href="http://socket.io/">Socket.IO</a></dd>
<dt>[00:28:16] <a href="http://www.golem.de/1112/88460.html">Internet Explorer &#8211; Microsoft führt automatische Updates ein</a></dt>
<dd>LOL. ROFL. Nicht in diesem Leben!</dd>
<dt>[00:28:35] <a href="http://www.heise.de/ix/meldung/Zwei-kostenfreie-Codecs-kandidieren-fuer-MPEG-Standard-1393341.html">Zwei kostenfreie Codecs kandidieren für MPEG-Standard</a></dt>
<dd>Nachdem vor knapp einem Jahr die MPEG-Arbeitsgruppe der ISO mit dem Auswahlverfahren für einen lizenzkostenfreien Codec für Webvideo begonnen hatte, sind jetzt zwei Produkte in die engere Wahl gekommen: IVC und WebVC.</dd>
<dt>[00:38:46] <a href="http://code.google.com/intl/de-DE/webtoolkit/speedtracer/">Speed Tracer</a></dt>
<dd>Eine Extension für den Chrome aus dem Deveoper Channel, die einem in einer Timeline-Kurve genau aufzeigt, wann der Browser wie lange womit beschäftigt ist. Und Tipps gibt.</dd>
<dt>[00:45:16] <a href="http://net.tutsplus.com/articles/interviews/should-you-learn-coffeescript/">Should You Learn CoffeeScript?</a></dt>
<dd>Eine Sammlung von Argumenten, warum man sich mit CoffeeScript beschäftigen könnte. U.a. weil ECMAScript 6 sich davon inspirieren ließ, <a href="http://blip.tv/jsconfeu/brendan-eich-loljs-5656862">wie JavaScript-Erfinder Brandon Eich auf der JSConf.eu erzählte</a>.</dd>
</dl>
<h3>[00:56:24] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://www.youtube.com/multimediatreff">Videos des MMT29 &#8211; HTML5, CSS3 &#038; Co vom 03.12.2011</a></dt>
<dd>Hier findet Ihr die Vorträge von Patrick Lauke, Peter (Kröner), Sven Wolfermann, Adobe, Mathias Schäfer, Sebastian Golasch, Marco Zehe, Alois Reitbauer und Microsoft zu den Themen: HTML5, CSS3, Flash, JavaScript, Node.js, WAI-ARIA, Web Performance Optimization und ASP.net MVC 4.</dd>
<dt><a href="http://backbonetutorials.com/organizing-backbone-using-modules/">Tutorial zum Verwenden von Backbone.js mit AMD</a></dt>
<dd>Quasi eine Followup-Link zur letzten Revision über AMD.</dd>
<dt><a href="http://projects.joshy.org/presentations/HTML/CanvasDeepDive/presentation.html">HTML 5 Canvas Deep Dive</a></dt>
<dd>Tutorial zur HTML5 Canvas.</dd>
<dt><a href="http://dev.opera.com/articles/view/better-error-handling-with-window-onerror/">Better error handling with window.onerror</a></dt>
<dd>Was man alles mit dem neuen window.onerror-Event treiben kann.</dd>
</dl>


Nach seiner Endjahres-Ochsentour, endlich mal wieder eine Revision mit Peter.
Außerdem dabei Kahlil und Schepp. Hierüber reden wir:


SCHAUNOTIZEN

[00:00:11] DABBLET

Ein JSFiddle für CSS, mit GitHub…

Nach seiner Endjahres-Ochsentour, endlich mal wieder eine Revision mit Peter.
Außerdem dabei Kahlil und Schepp. Hierüber reden wir:


SCHAUNOTIZEN

[00:00:11] DABBLET

Ein JSFiddle für CSS, mit GitHub-Gist-Anbindung, von Lea Verou

[00:10:55] AUTO-SAVING CSS AND JAVASCRIPT CHANGES LOCALLY FROM THE CHROME
DEVELOPER TOOLS

Eine Chrome-Erweiterung und eine lokale Node.js-Instanz machen es zusammen
möglich, JS- und CSS-Änderungen, die man in den Chrome DevTools vornimmt, sofort
lokal und dauerhaft ins Projekt zu übernehmen.

[00:17:46] ANDROID—ICE CREAM SANDWICH: THE HTML5 DEVELOPER SCORECARD

Die Sencha Labs haben den Fähigkeiten des neuen Android-Browsers auf den Zahn
gefühlt. Er ist ganz gut, zieht aber nie und nimmer an iOS 5 vorbei. Wir gehen
außerdem noch auf einen Bug in den älteren Android Browsern ein, die zwar
behaupten, CSS Animationen zu können, dabei allerdings schwer patzen. Während
unseres Gesprächs fällt der Hinweis auf Socket.IO

[00:28:16] INTERNET EXPLORER – MICROSOFT FÜHRT AUTOMATISCHE UPDATES EIN

LOL. ROFL. Nicht in diesem Leben!

[00:28:35] ZWEI KOSTENFREIE CODECS KANDIDIEREN FÜR MPEG-STANDARD

Nachdem vor knapp einem Jahr die MPEG-Arbeitsgruppe der ISO mit dem
Auswahlverfahren für einen lizenzkostenfreien Codec für Webvideo begonnen hatte,
sind jetzt zwei Produkte in die engere Wahl gekommen: IVC und WebVC.

[00:38:46] SPEED TRACER

Eine Extension für den Chrome aus dem Deveoper Channel, die einem in einer
Timeline-Kurve genau aufzeigt, wann der Browser wie lange womit beschäftigt ist.
Und Tipps gibt.

[00:45:16] SHOULD YOU LEARN COFFEESCRIPT?

Eine Sammlung von Argumenten, warum man sich mit CoffeeScript beschäftigen
könnte. U.a. weil ECMAScript 6 sich davon inspirieren ließ, wie
JavaScript-Erfinder Brandon Eich auf der JSConf.eu erzählte.


[00:56:24] KEINE SCHAUNOTIZEN

VIDEOS DES MMT29 – HTML5, CSS3 & CO VOM 03.12.2011

Hier findet Ihr die Vorträge von Patrick Lauke, Peter (Kröner), Sven Wolfermann,
Adobe, Mathias Schäfer, Sebastian Golasch, Marco Zehe, Alois Reitbauer und
Microsoft zu den Themen: HTML5, CSS3, Flash, JavaScript, Node.js, WAI-ARIA, Web
Performance Optimization und ASP.net MVC 4.

TUTORIAL ZUM VERWENDEN VON BACKBONE.JS MIT AMD

Quasi eine Followup-Link zur letzten Revision über AMD.

HTML 5 CANVAS DEEP DIVE

Tutorial zur HTML5 Canvas.

BETTER ERROR HANDLING WITH WINDOW.ONERROR

Was man alles mit dem neuen window.onerror-Event treiben kann.

Revision 52: Android 4.0, Webvideo & CoffeeScript

<p>Die erste Revision nach unserer sprunghaften Vermehrung bestreiten zusammen <a href="http://drublic.de/">Hans</a>, <a href="http://kahlil.co/">Kahlil</a> und <a href="http://twitter.com/#!/derSchepp">Schepp</a>. Hierüber reden wir:</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:03:12] <a href="http://evanw.github.com/csg.js/">csg.js</a></dt>
<dd>Constructive Solid Geometry (CSG) is a modeling technique that uses Boolean operations like union and intersection to combine 3D solids. Uffz! :D</dd>
<dt>[00:12:30] <a href="http://jamesflorentino.com/jquery.nanoscroller/">nanoScroller.js</a></dt>
<dd>Hier hat jemand eine Scrollbar gebaut, die exakt derjenigen von Mac OS X Lion nachempfunden ist. Uns kommen dabei die <a href="http://de.selfhtml.org/css/eigenschaften/anzeigefenster.htm#scrollbar">IE</a> und <a href="http://www.webkit.org/blog/363/styling-scrollbars/">WebKit</a> Scrollbar CSS Anweisungen, sowie der <a href="http://larsjung.de/h5ai/">HTML5 Apache Index</a> in den Sinn.</dd>
<dt>[00:21:35] <a href="http://jashkenas.github.com/docco/">Docco</a></dt>
<dd>Docco wandelt mit Hilfe von Node.js, Pygments und CoffeeScript mit Markdown kommentierten Code in was sehr lesbares um.</a></dd>
<dt>[00:28:24] <a href="http://addyosmani.com/writing-modular-js/">Writing Modular JavaScript With AMD, CommonJS &#038; ES Harmony</a></dt>
<dd>Wir nehmen Addy Osmanis Artikel zum Anlass, ein feuriges Plädoyer für AMD, also Asynchrone Modul Definitionen, loszuwerden. Warum es sich dabei handelt, erklären wir auch.</dd>
<dt>[00:45:44] <a href="http://blog.jquery.com/2011/12/08/what-is-happening-to-the-jquery-plugins-site/">jQuery Blog: What is happening to the jQuery Plugins Site?</a></dt>
<dd>Leider hat einer von den jQuery Jungs beim Aufräumen des Plugin-Repositorys <code>format c:</code> eingegeben und aus Versehen alle Plugins gelöscht. Und das letzte Backup ist ein Jahr alt. Ups. Dafür kommt jetzt endlich eine neue Repository-Architektur.</dd>
</dl>
<dt>[00:53:57] <a href="http://paulirish.com/2011/moving-the-web-forward/">Moving the Web Forward</a></dt>
<dd>Im Rahmen des fünften Blue Beanie Days für Webstandards hat Team Irish ein neues Projekt namens &#8222;<a href="http://movethewebforward.org/">Moving the Web Forward</a>&#8220; ins Leben gerufen, das Leute dabei leiten und unterstützen soll, sich in Sachen Webstandards für uns alle hilfreich einzubringen. Dabei piekste er dem Herrn Zeldman in einem <a href="http://paulirish.com/wp-content/uploads/2011/movingtheweb-post-archive.html#comment-96762">Nebensatz so empfindlich in die Weichteile, dass dessen Tourette-Syndrom voll zum Ausbruch kam</a>. Und auch andere streiteten. Wir berichten von der Klatsch und Tratsch Front.</dd>
</dl>
<h3>[01:08:01] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://videojs.com/">VideoJS</a></dt>
<dd>JS-Framework agnostischer HTML5 Videoplayer mit Flash-Fallback. Auch als Plugin für viele CMS.</dd>
<dt><a href="http://welaika.github.com/wordless/">Wordless</a></dt>
<dd>WordPress Plugin, mit dem sich Themes in HAML, SASS, COMPASS und CoffeeScript erstellen lassen.</dd>
<dt><a href="http://blog.gpsies.com/article/174/abschied-von-der-google-maps-api-ersatz-durch-leaflet-von-cloudmade">Abschied von der Google Maps API &#8211; Ersatz durch Leaflet von CloudMade</a></dt>
<dd>Wem Google Maps ab jetzt zu teuer wird, für den könnte dieser Tripreport rüber zu <a href="http://leaflet.cloudmade.com/">Leaflet</a> interessant sein.</dd>
<dt><a href="http://www.echojs.com/">Echo JS</a></dt>
<dd>Hackerlike JavaScript News</dd>
<dt><a href="http://www.emberjs.com/">Ember.js</a></dt>
<dd>Das neue inoffizielle Sproutcore 2.0 JavaScript-MVC Überframework. Liest sich gut!</dd>
<dt><a href="http://dochub.io/">dochub</a></dt>
<dd>Interaktives Nachschlagewerk für CSS, HTML, JavaScript, DOM und jQuery Syntax/Befehle</dd>
</dl>


Die erste Revision nach unserer sprunghaften Vermehrung bestreiten zusammen
Hans, Kahlil und Schepp. Hierüber reden wir:


SCHAUNOTIZEN

[00:03:12] CSG.JS

Constructive Solid Geometry (CSG) is a model…

Die erste Revision nach unserer sprunghaften Vermehrung bestreiten zusammen
Hans, Kahlil und Schepp. Hierüber reden wir:


SCHAUNOTIZEN

[00:03:12] CSG.JS

Constructive Solid Geometry (CSG) is a modeling technique that uses Boolean
operations like union and intersection to combine 3D solids. Uffz! :D

[00:12:30] NANOSCROLLER.JS

Hier hat jemand eine Scrollbar gebaut, die exakt derjenigen von Mac OS X Lion
nachempfunden ist. Uns kommen dabei die IE und WebKit Scrollbar CSS Anweisungen,
sowie der HTML5 Apache Index in den Sinn.

[00:21:35] DOCCO

Docco wandelt mit Hilfe von Node.js, Pygments und CoffeeScript mit Markdown
kommentierten Code in was sehr lesbares um.

[00:28:24] WRITING MODULAR JAVASCRIPT WITH AMD, COMMONJS & ES HARMONY

Wir nehmen Addy Osmanis Artikel zum Anlass, ein feuriges Plädoyer für AMD, also
Asynchrone Modul Definitionen, loszuwerden. Warum es sich dabei handelt,
erklären wir auch.

[00:45:44] JQUERY BLOG: WHAT IS HAPPENING TO THE JQUERY PLUGINS SITE?

Leider hat einer von den jQuery Jungs beim Aufräumen des Plugin-Repositorys
format c: eingegeben und aus Versehen alle Plugins gelöscht. Und das letzte
Backup ist ein Jahr alt. Ups. Dafür kommt jetzt endlich eine neue
Repository-Architektur.

[00:53:57] MOVING THE WEB FORWARD

Im Rahmen des fünften Blue Beanie Days für Webstandards hat Team Irish ein neues
Projekt namens „Moving the Web Forward“ ins Leben gerufen, das Leute dabei
leiten und unterstützen soll, sich in Sachen Webstandards für uns alle hilfreich
einzubringen. Dabei piekste er dem Herrn Zeldman in einem Nebensatz so
empfindlich in die Weichteile, dass dessen Tourette-Syndrom voll zum Ausbruch
kam. Und auch andere streiteten. Wir berichten von der Klatsch und Tratsch
Front.


[01:08:01] KEINE SCHAUNOTIZEN

VIDEOJS

JS-Framework agnostischer HTML5 Videoplayer mit Flash-Fallback. Auch als Plugin
für viele CMS.

WORDLESS

WordPress Plugin, mit dem sich Themes in HAML, SASS, COMPASS und CoffeeScript
erstellen lassen.

ABSCHIED VON DER GOOGLE MAPS API – ERSATZ DURCH LEAFLET VON CLOUDMADE

Wem Google Maps ab jetzt zu teuer wird, für den könnte dieser Tripreport rüber
zu Leaflet interessant sein.

ECHO JS

Hackerlike JavaScript News

EMBER.JS

Das neue inoffizielle Sproutcore 2.0 JavaScript-MVC Überframework. Liest sich
gut!

DOCHUB

Interaktives Nachschlagewerk für CSS, HTML, JavaScript, DOM und jQuery
Syntax/Befehle

Revision 51: AMD, jQuery Plugin Repo & Alphatier-Gekabbel

<p>Zur runden Revision hat sich Schepp <a href="http://www.marcelkoch.net/">Marcel Koch</a> aka <a href="http://www.twitter.com/makochnet">@makochnet</a> aus dem Taunus eingeladen.</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:01:47] <a href="http://blogs.msdn.com/b/ie/archive/2011/11/29/html5-for-applications-the-fourth-ie10-platform-preview.aspx">HTML5 for Applications: The Fourth IE10 Platform Preview</a></dt>
<dd>Die Public Preview 4 des IE10 bringt uns ein paar wenige schöne Neuerungen, so etwa <a href="http://www.nczonline.net/blog/2010/05/25/cross-domain-ajax-with-cross-origin-resource-sharing/">Cross-Origin Resource Sharing (CORS)</a>, <a href="http://blogs.msdn.com/b/ie/archive/2011/12/01/working-with-binary-data-using-typed-arrays.aspx">Binärdaten-Unterstützung der File API</a>, JavaScript <a href="http://hacks.mozilla.org/2011/12/faster-canvas-pixel-manipulation-with-typed-arrays/">Typed Arrays</a> und Video Untertitelungen.</dd>
<dt>[00:08:22] <a href="http://nicolasgallagher.com/mobile-first-css-sass-and-ie/">“Mobile first” CSS and getting Sass to help with legacy IE</a></dt>
<dd>Nicolas Gallagher beschreibt, wie man mit Hilfe von SASS das &#8222;Mobile First&#8220; Paradigma umsetzen kann, ohne die Tür für die alten IEs zuzuschlagen. Schöne Idee!</dd>
<dt>[00:16:14] <a href="http://my.opera.com/dragonfly/blog/style-profiler-preview">Opera Dragonfly Style Profiler Preview</a></dt>
<dd>Operas Entwicklertools gibt es in einer sehr frühen Preview, die erstmalig mit einem Profiler für CSS-Selektoren aufwarten kann. Geil.</a></dd>
<dt>[00:23:17] <a href="http://www.abalook.com/journal/2011/4/17/titbit-operarsquos-neat-lsquospacebarrsquo-trick.html">TitBit: Opera’s Neat ‘Spacebar’ Trick</a></dt>
<dd>Marcel hat bemerkt, dass Opera beim Erreichen des Endes einer Seite einen Hinweis einblendet, man könne durch Drücken der Leertaste zur folgenden Seite weiterblättern. Völlig unklar ist allerdings, woher Opera weiß, welche eben jene nächste Seite sein soll. <code>&lt;link rel="next" /&gt;</code> ist es jedenfalls nicht, und doch klappt es meist. Myteriös&#8230; Wisst Ihr&#8217;s?</dd>
<dt>[00:29:50] <a href="http://24ways.org/2011/unicode-range">Creating Custom Font Stacks with Unicode-Range</a></dt>
<dd>Im 24ways Adventskalender erschien gleich am ersten Tag ein Artikel, der beschreibt, wie man mit der eher unbekannten CSS-Font-Eigenschaft <code>unicode-range</code> seine Texte buchstabenweise durchgestalten kann. Clevere Idee! Wofür <code>unicode-range</code> gut ist und welcher Browser es wie gut unterstützt, das lernt Ihr in Jake Archibalds Fronteers-Vortrag, wenn er denn mal <a href="http://vimeo.com/channels/fronteers11">erscheint</a>.</dd>
<dt>[00:37:29] <a href="http://en.wikipedia.org/wiki/P3P">P3P</a></dt>
<dd>Obwohl nix Neues, so hat Marcel in letzter Zeit schwer mit sogenannten P3P-Headers zu kämpfen gehabt. Er erzählt uns, warum sie so kacke sind. Zur Überwindung hilft es, <a href="http://www.php.net/manual/de/function.setcookie.php#102352">diesen Wert</a> in den HTTP-Headern mitzusenden.</dd>
<dt>[00:49:10] <a href="http://www.zdnet.com/blog/bott/firefox-faces-uncertain-future-as-google-deal-apparently-ends/4241">Firefox faces uncertain future as Google deal apparently ends</a></dt>
<dd>Rund 85% von Mozillas Finanzierung kam in den vergangenen Jahren von Google, die im Gegenzug als Standardsuche in Firefox eingebaut wurden. Der entsprechende Vertrag endete jedoch im letzten Monat und es gibt keinerlei Anzeichen dafür, dass der Vertrag erneuert wurde. Und das wäre sehr schlecht für Mozilla.</dd>
</dl>
<h3>[00:57:48] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://24ways.org/2011/">Diverse Atzventzkalender</a></dt>
<dd>Wie die letzten Jahre, gibt es auch dieses Jahr wieder reichlich Adventskalender allerorten. Folgende haben wir für Euch ausgegraben:</p>
<ul>
<li><a href="http://phpadvent.org/2011">PHP advent 2011</a></li>
<li><a href="http://calendar.perfplanet.com/2011/">Performance Calendar</a></li>
<li><a href="http://maddesigns.de/">CSS3 Adventskalender 2011</a></li>
<li><a href="http://24ways.org/2011/">24 Ways to Impress your Friends 2011</a></li>
<li><a href="http://www.webkrauts.de/">Webkrauts Adventskalender</a></li>
<li><a href="http://www.der-prinz.de/blog">WordPress Adventskalender</a></li>
<li><a href="http://wpengineer.com/">WPEngineer.com Advent Calendar</a></li>
</ul>
</dd>
<dt><a href="http://www.zoomify.com/html5.htm">Zoomify HTML5</a></dt>
<dd>Unendliches Bilderzoomen geht nun endlich ohne Flash, in reinem HTML(5)!</dd>
<dt><a href="https://chrome.google.com/webstore/detail/epmaefhielclhlnmjofcdapbeepkmggh">Sight</a></dt>
<dd>Google Chrome Erweiterung, die alle Programmiersprachen syntaxhighlightet, die nicht bei drei auf dem Baum sind.</dd>
</dl>


Zur runden Revision hat sich Schepp Marcel Koch aka @makochnet aus dem Taunus
eingeladen.


SCHAUNOTIZEN

[00:01:47] HTML5 FOR APPLICATIONS: THE FOURTH IE10 PLATFORM PREVIEW

Die Public Preview 4 des …

Zur runden Revision hat sich Schepp Marcel Koch aka @makochnet aus dem Taunus
eingeladen.


SCHAUNOTIZEN

[00:01:47] HTML5 FOR APPLICATIONS: THE FOURTH IE10 PLATFORM PREVIEW

Die Public Preview 4 des IE10 bringt uns ein paar wenige schöne Neuerungen, so
etwa Cross-Origin Resource Sharing (CORS), Binärdaten-Unterstützung der File
API, JavaScript Typed Arrays und Video Untertitelungen.

[00:08:22] “MOBILE FIRST” CSS AND GETTING SASS TO HELP WITH LEGACY IE

Nicolas Gallagher beschreibt, wie man mit Hilfe von SASS das „Mobile First“
Paradigma umsetzen kann, ohne die Tür für die alten IEs zuzuschlagen. Schöne
Idee!

[00:16:14] OPERA DRAGONFLY STYLE PROFILER PREVIEW

Operas Entwicklertools gibt es in einer sehr frühen Preview, die erstmalig mit
einem Profiler für CSS-Selektoren aufwarten kann. Geil.

[00:23:17] TITBIT: OPERA’S NEAT ‘SPACEBAR’ TRICK

Marcel hat bemerkt, dass Opera beim Erreichen des Endes einer Seite einen
Hinweis einblendet, man könne durch Drücken der Leertaste zur folgenden Seite
weiterblättern. Völlig unklar ist allerdings, woher Opera weiß, welche eben jene
nächste Seite sein soll. <link rel="next" /> ist es jedenfalls nicht, und doch
klappt es meist. Myteriös… Wisst Ihr’s?

[00:29:50] CREATING CUSTOM FONT STACKS WITH UNICODE-RANGE

Im 24ways Adventskalender erschien gleich am ersten Tag ein Artikel, der
beschreibt, wie man mit der eher unbekannten CSS-Font-Eigenschaft unicode-range
seine Texte buchstabenweise durchgestalten kann. Clevere Idee! Wofür
unicode-range gut ist und welcher Browser es wie gut unterstützt, das lernt Ihr
in Jake Archibalds Fronteers-Vortrag, wenn er denn mal erscheint.

[00:37:29] P3P

Obwohl nix Neues, so hat Marcel in letzter Zeit schwer mit sogenannten
P3P-Headers zu kämpfen gehabt. Er erzählt uns, warum sie so kacke sind. Zur
Überwindung hilft es, diesen Wert in den HTTP-Headern mitzusenden.

[00:49:10] FIREFOX FACES UNCERTAIN FUTURE AS GOOGLE DEAL APPARENTLY ENDS

Rund 85% von Mozillas Finanzierung kam in den vergangenen Jahren von Google, die
im Gegenzug als Standardsuche in Firefox eingebaut wurden. Der entsprechende
Vertrag endete jedoch im letzten Monat und es gibt keinerlei Anzeichen dafür,
dass der Vertrag erneuert wurde. Und das wäre sehr schlecht für Mozilla.


[00:57:48] KEINE SCHAUNOTIZEN

DIVERSE ATZVENTZKALENDER

Wie die letzten Jahre, gibt es auch dieses Jahr wieder reichlich Adventskalender
allerorten. Folgende haben wir für Euch ausgegraben:



 * PHP advent 2011
 * Performance Calendar
 * CSS3 Adventskalender 2011
 * 24 Ways to Impress your Friends 2011
 * Webkrauts Adventskalender
 * WordPress Adventskalender
 * WPEngineer.com Advent Calendar

ZOOMIFY HTML5

Unendliches Bilderzoomen geht nun endlich ohne Flash, in reinem HTML(5)!

SIGHT

Google Chrome Erweiterung, die alle Programmiersprachen syntaxhighlightet, die
nicht bei drei auf dem Baum sind.

Revision 50: P3P olé!

<p>Heute hat sich Schepp mit <a href="http://drublic.de/">Hans Christian Reinl</a>, alias <a href="http://twitter.com/#!/drublic">@drublic</a> hingesetzt, und zusammen haben wir recht viel schöne Kleinigkeiten für Euch ausgegraben.</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:01:40] <a href="http://hacks.mozilla.org/2011/11/developer-tools-in-firefox-aurora-10/">Developer Tools in Firefox Aurora 10</a></dt>
<dd>Etwas, das Rodney und Peter in der letzten Woche versäumt haben, holen wir diesmal nach: Wir werfen einen Blick auf die neuen in Firefox zukünftig integrierten Entwicklertools. Unserer Meinung nach ein guter Start, der aber weiter ausgebaut werden muss, da <a href="http://www.golem.de/1107/85007.html">Firebug in eine nicht mehr ganz so rosige Zukunft blickt</a> und dringend Ersatz braucht.</dd>
<dt>[00:12:40] <a href="http://annevankesteren.nl/2011/11/dom-improvements">DOM Improvements</a></dt>
<dd>Nachdem zunächst überhaupt erst einmal ein Gremium aus dem Boden gestampft wurde, das beim W3C für die Standardisierung und Fortentwicklung des DOM-Zugriffs zuständig ist, gibt es nun einen ersten Vorstoß, neuen DOM-Methoden zu spezifizieren. Während des Gesprächs schweifen wir zum Thema <a href="http://www.wordsbyf.at/2011/11/23/selectors-selectoring/">interne Arbeitsweise der jQuery-Selectorengine Sizzle</a> ab.</dd>
<dt>[00:23:21] <a href="http://blogs.msdn.com/b/ie/archive/2011/11/22/evolving-ecmascript.aspx">Evolving ECMAScript</a></dt>
<dd>Auch Microsoft bringt ein paar Vorschläge für neue Methoden, allerdings für JavaScript. Sehr sinnvoll.</a></dd>
<dt>[00:33:13] <a href="http://www.golem.de/1111/87843.html">Verlustlose Kompression und Transparenz für Google WebP</a></dt>
<dd>Spätestens jetzt wird WebP zum Alleskönner, da es in seiner neusten Version bei Bedarf verlustfrei komprimieren kann, Animationen lernt, und obendrein auch mit Transparenz auftrumpft. Dabei sprechen wir u.a. kurz über das gescheiterte Bildformat <a href="http://en.wikipedia.org/wiki/APNG">APNG</a> und wieder mal über mögliche Lösungswege für <a href="https://groups.google.com/forum/#!topic/jquery-standards/rl8886ZRs8o">responsive Bilder</a>.</dd>
<dt>[00:46:12] <a href="http://www.w3.org/2009/dap/">Viele neue APIs</a></dt>
<dd>Es erscheinen immer mehr Working Drafts für APIs für den Hardwarezugriff. So etwa ganz frisch von Nokia ein Vorschlag zu einer <a href="http://www.w3.org/TR/vibration/">Vibration API</a>. Chrome und Firefox warten demnächst mit der <a href="http://techcrunch.com/2011/11/24/chrome-getting-native-gamepad-webcam-and-webrtc-support-in-early-2012/">Gamepad API auf</a>. Und Opera, Chrome und Firefox verfügen bald alle über Zurgriff auf die Webcam oder das Mikrofon. Federführend ist in diesem Bereich die <a href="http://www.w3.org/2009/dap/">Device APIs Working Group</a>, und auch <a href="http://www.golem.de/1108/85920.html">Mozilla ist da stark hinterher</a>, bis Ende des Jahres alle APIs fertig zu haben. <a href="https://wiki.mozilla.org/B2G">Wegen Boot to Gecko</a>.</dd>
</dl>
<dt>[00:55:42] <a href="http://peter.sh/2011/11/cross-fading-css-flexible-box-grid-layout-filters-and-meta-referer/">Cross Fading, CSS Flexible Box, Grid Layout, Filters and Meta Referrer</a></dt>
<dd>WebKit setzt wieder ein paar nette Dinge um, nämlich das neue Flexbox-Model, CSS Shader, Bild-Überblendungen in CSS oder ein meta-Element des Types &#8222;referrer&#8220;, das die Privatsphäre schützt.</a></dd>
<dt>[01:06:06] <a href="http://www.markboulton.co.uk/journal/comments/responsive-advertising">Responsive Advertising</a></dt>
<dd>Mark Boulton spricht den Punkt an, dass zwar unsere Seiten immer &#8222;responsiver&#8220; werden, nicht aber die Werbung und deren Vermakrtungskonzept. Also schlägt er mal was vor.</dd>
</dl>
<h3>[01:15:03] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://maddesigns.de/css3-adventskalender-2011-1107.html">CSS3 Adventskalender</a></dt>
<dd>Wie letztes Jahr bringen <a href="http://maddesigns.de/">Sven Wolfermann</a> und <a href="http://webstandard.kulando.de/">Heiko Stiegert</a> auch dieses Jahr wieder einen Adventskalender vollgepackt mit CSS3-Tricks, bei dem allerlei Gastautoren mit von der Partie sind und es sehr hochkarätige Preise zu gewinnen gibt.</dd>
<dt><a href="http://orchestra.io/">Orchestra.io</a></dt>
<dd>PHP Deployment System, das mit Github arbeitet.</dd>
<dt><a href=http://www.meetup.com/The-SmashingMagazine-Meetup/events/42026332/?a=ea1_grp&#038;rv=ea1">SmashingMagazine Meetup #3 with Paul Irish and Stuttgart GTUG</a></dt>
<dd>Am 21.12. findet in Stuttgart das dritte Smashing Magazine Meetup statt, mit Paul Irish und Chris Heilmann. Meldet Euch an!</dd>
</dl>


Heute hat sich Schepp mit Hans Christian Reinl, alias @drublic hingesetzt, und
zusammen haben wir recht viel schöne Kleinigkeiten für Euch ausgegraben.


SCHAUNOTIZEN

[00:01:40] DEVELOPER TOOLS IN FI…

Heute hat sich Schepp mit Hans Christian Reinl, alias @drublic hingesetzt, und
zusammen haben wir recht viel schöne Kleinigkeiten für Euch ausgegraben.


SCHAUNOTIZEN

[00:01:40] DEVELOPER TOOLS IN FIREFOX AURORA 10

Etwas, das Rodney und Peter in der letzten Woche versäumt haben, holen wir
diesmal nach: Wir werfen einen Blick auf die neuen in Firefox zukünftig
integrierten Entwicklertools. Unserer Meinung nach ein guter Start, der aber
weiter ausgebaut werden muss, da Firebug in eine nicht mehr ganz so rosige
Zukunft blickt und dringend Ersatz braucht.

[00:12:40] DOM IMPROVEMENTS

Nachdem zunächst überhaupt erst einmal ein Gremium aus dem Boden gestampft
wurde, das beim W3C für die Standardisierung und Fortentwicklung des
DOM-Zugriffs zuständig ist, gibt es nun einen ersten Vorstoß, neuen DOM-Methoden
zu spezifizieren. Während des Gesprächs schweifen wir zum Thema interne
Arbeitsweise der jQuery-Selectorengine Sizzle ab.

[00:23:21] EVOLVING ECMASCRIPT

Auch Microsoft bringt ein paar Vorschläge für neue Methoden, allerdings für
JavaScript. Sehr sinnvoll.

[00:33:13] VERLUSTLOSE KOMPRESSION UND TRANSPARENZ FÜR GOOGLE WEBP

Spätestens jetzt wird WebP zum Alleskönner, da es in seiner neusten Version bei
Bedarf verlustfrei komprimieren kann, Animationen lernt, und obendrein auch mit
Transparenz auftrumpft. Dabei sprechen wir u.a. kurz über das gescheiterte
Bildformat APNG und wieder mal über mögliche Lösungswege für responsive Bilder.

[00:46:12] VIELE NEUE APIS

Es erscheinen immer mehr Working Drafts für APIs für den Hardwarezugriff. So
etwa ganz frisch von Nokia ein Vorschlag zu einer Vibration API. Chrome und
Firefox warten demnächst mit der Gamepad API auf. Und Opera, Chrome und Firefox
verfügen bald alle über Zurgriff auf die Webcam oder das Mikrofon. Federführend
ist in diesem Bereich die Device APIs Working Group, und auch Mozilla ist da
stark hinterher, bis Ende des Jahres alle APIs fertig zu haben. Wegen Boot to
Gecko.

[00:55:42] CROSS FADING, CSS FLEXIBLE BOX, GRID LAYOUT, FILTERS AND META
REFERRER

WebKit setzt wieder ein paar nette Dinge um, nämlich das neue Flexbox-Model, CSS
Shader, Bild-Überblendungen in CSS oder ein meta-Element des Types „referrer“,
das die Privatsphäre schützt.

[01:06:06] RESPONSIVE ADVERTISING

Mark Boulton spricht den Punkt an, dass zwar unsere Seiten immer „responsiver“
werden, nicht aber die Werbung und deren Vermakrtungskonzept. Also schlägt er
mal was vor.


[01:15:03] KEINE SCHAUNOTIZEN

CSS3 ADVENTSKALENDER

Wie letztes Jahr bringen Sven Wolfermann und Heiko Stiegert auch dieses Jahr
wieder einen Adventskalender vollgepackt mit CSS3-Tricks, bei dem allerlei
Gastautoren mit von der Partie sind und es sehr hochkarätige Preise zu gewinnen
gibt.

ORCHESTRA.IO

PHP Deployment System, das mit Github arbeitet.

SMASHINGMAGAZINE MEETUP #3 WITH PAUL IRISH AND STUTTGART GTUG

Am 21.12. findet in Stuttgart das dritte Smashing Magazine Meetup statt, mit
Paul Irish und Chris Heilmann. Meldet Euch an!

Revision 49: Devtools und Kleinvieh

<p><a href="http://workingdraft.de/wp-content/uploads/2011/11/beyondtellerrand.png"><img loading="lazy" src="http://workingdraft.de/wp-content/uploads/2011/11/beyondtellerrand.png" alt="" title="beyondtellerrand" width="640" height="82" class="alignnone size-full wp-image-898" srcset="https://workingdraft.de/wp-content/uploads/2011/11/beyondtellerrand.png 640w, https://workingdraft.de/wp-content/uploads/2011/11/beyondtellerrand-300x38.png 300w" sizes="(max-width: 640px) 100vw, 640px" /></a></p>
<p>Minutiös auf die Revision 48 abgestimmt, ließ der liebe <a href="http://twitter.com/#!/marcthiele">Marc Thiele</a> diesen Montag (sowie Sonntag und Dienstag) die <a href="http://2011.beyondtellerrand.com/">beyond tellerrand 2011</a> vom Stapel. Und was sollen wir sagen? Sie war verdammt nochmal exzellent! Das <a href="http://2011.beyondtellerrand.com/conference.php">Lineup</a> war der Hammer und übertraf alle Erwartungen.</p>
<p><iframe src="http://player.vimeo.com/video/32574970?title=0&amp;byline=0&amp;portrait=0" width="640" height="480" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe><br />
<em>Stop Motion Opening Sequence der beyond tellerrand 2011</em></p>
<p>Und weil so viele unserer Hörer und Gäste diese Mutter aller Konferenzen besuchen wollten, entstand die Idee, die hiesige Revision dann auch direkt dort aufzunehmen. Yeah, Baby! Gäste waren <a href="http://twitter.com/anselmhannemann">Anselm Hannemann</a>, <a href="http://twitter.com/fhemberger">Frederic Hemberger</a>, <a href="http://twitter.com/MadeMyDay">Marc Hinse</a>, <a href="http://twitter.com/drublic">Hans Christian Reinl</a>, <a href="http://twitter.com/maddesigns">Sven Wolfermann</a>, <a href="http://twitter.com/rodneyrehm">Rodney Rehm</a> und <a href="http://twitter.com/fernmuendlich">Maik Wagner</a>. Aber auch <a href="http://twitter.com/macx">David Maciejewski</a> von der <a href="http://technikwuerze.de/">Technikwürze</a> war auch vor Ort, so dass man sagen kann: Dies war die erste mit der Technikwürze zusammen koproduzierte Working Draft Revision! Ein großes Dankeschön geht außerdem an Dank Rodney Rehm, dem wir zwei saugeile Funkmikrofone verdankten!</p>
<p><a href="http://www.youtube.com/watch?v=aFEiw0SEMyw" target="_blank"><img loading="lazy" src="http://workingdraft.de/wp-content/uploads/2011/11/wd-48.jpg" alt="Mit Christian Schaefer, Anselm Hannemann, Frederic Hemberger, Marc Hinse, Hans Christian Reinl, David Maciejewski, Naomi Atkinson, Rodney Rehm und Maik Wagner." title="Aufnahme zur Working Draft Revision 48" width="640" height="360" class="alignnone size-full wp-image-891" srcset="https://workingdraft.de/wp-content/uploads/2011/11/wd-48.jpg 640w, https://workingdraft.de/wp-content/uploads/2011/11/wd-48-300x168.jpg 300w" sizes="(max-width: 640px) 100vw, 640px" /></a><br />
<em><a href="http://www.youtube.com/watch?v=aFEiw0SEMyw" target="_blank">Working Draft 48 auf YouTube</a></em></p>
<h3>Schaunotizen</h3>
<dl>
<dt><a href="http://2011.beyondtellerrand.com/">beyond tellerrand 2011</a></dt>
<dd>Wir beginnen damit, den <a href="http://2011.beyondtellerrand.com/workshops.php">Workshoptag</a> am Sonntag und den ersten Tag der Konferenz, den Montag, zu rekapitulieren. Nach circa 10 Minuten stößt die Speakerin <a href="http://naomiatkinsondesign.com/">Naomi Atkinson</a> zu uns, mit der wir über Ihren tollen Vortrag &#8222;<a href="http://2011.beyondtellerrand.com/conference.php#atkinson">Going Beyond</a>&#8220; sprechen, und über die Tatsache, dass wir Deutschen aufgrund unserer Sprachbarriere zu sehr im eigenen Saft schmoren. Im Anschluss führen wir die anfangs begonnene Konferenz-Rekapitulation zu Ende.</dd>
</dl>
<h3>Keine Schaunotizen</h3>
<dl>
<dt><a href="http://vimeo.com/channels/beyondtellerrand">beyond tellerrand Videos</a></dt>
<dd>Hier erscheinen in den kommenden Tagen die Videoaufzeichnungen aller Talks.</dd>
</dl>


Minutiös auf die Revision 48 abgestimmt, ließ der liebe Marc Thiele diesen
Montag (sowie Sonntag und Dienstag) die beyond tellerrand 2011 vom Stapel. Und
was sollen wir sagen? Sie war verdammt nochmal…

Minutiös auf die Revision 48 abgestimmt, ließ der liebe Marc Thiele diesen
Montag (sowie Sonntag und Dienstag) die beyond tellerrand 2011 vom Stapel. Und
was sollen wir sagen? Sie war verdammt nochmal exzellent! Das Lineup war der
Hammer und übertraf alle Erwartungen.


Stop Motion Opening Sequence der beyond tellerrand 2011

Und weil so viele unserer Hörer und Gäste diese Mutter aller Konferenzen
besuchen wollten, entstand die Idee, die hiesige Revision dann auch direkt dort
aufzunehmen. Yeah, Baby! Gäste waren Anselm Hannemann, Frederic Hemberger, Marc
Hinse, Hans Christian Reinl, Sven Wolfermann, Rodney Rehm und Maik Wagner. Aber
auch David Maciejewski von der Technikwürze war auch vor Ort, so dass man sagen
kann: Dies war die erste mit der Technikwürze zusammen koproduzierte Working
Draft Revision! Ein großes Dankeschön geht außerdem an Dank Rodney Rehm, dem wir
zwei saugeile Funkmikrofone verdankten!


Working Draft 48 auf YouTube


SCHAUNOTIZEN

BEYOND TELLERRAND 2011

Wir beginnen damit, den Workshoptag am Sonntag und den ersten Tag der Konferenz,
den Montag, zu rekapitulieren. Nach circa 10 Minuten stößt die Speakerin Naomi
Atkinson zu uns, mit der wir über Ihren tollen Vortrag „Going Beyond“ sprechen,
und über die Tatsache, dass wir Deutschen aufgrund unserer Sprachbarriere zu
sehr im eigenen Saft schmoren. Im Anschluss führen wir die anfangs begonnene
Konferenz-Rekapitulation zu Ende.


KEINE SCHAUNOTIZEN

BEYOND TELLERRAND VIDEOS

Hier erscheinen in den kommenden Tagen die Videoaufzeichnungen aller Talks.

Revision 48: Direkt von der beyond tellerrand. In Bewegtbild!

<p>Während Schepp sich von der Release-Party seines Forks erholte und Markus am Ereignishorizont eines schwarzen Internet-Lochs festhing, trümmerten Peter und <a href="http://rodneyrehm.de/en/">Rodney Rehm</a> zu zweit die fällige Revision ein.</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:00:34] <a href="https://plus.google.com/100063817839650840647">Working Draft bei Google Plus</a></dt>
<dd>Seid dabei und kreist uns ein!</dd>
<dt>[00:01:10] <a href="https://developer.mozilla.org/en/Firefox_8_for_developers">Firefox 8</a></dt>
<dd>Firefox 8 bietet neben verbesserter Performance und einer Reihe von Bugfixes ein Update für Web Sockets, eine erste Implementierung von FileReaderSync, sowie die Möglichkeit HTML5-Kontextmenus zu definieren. Letzteres ist aber so dermaßen defekt, dass man lieber zu <a href="http://medialize.github.com/jQuery-contextMenu/demo/html5-polyfill-firefox8.html">Rodneys jQuery-Polyfill</a> greift. Außerdem will man die eh nicht verwenden, weil die nur verwirren. Anlässlich der Performance-Frage schweifen wir in Richtung Externe-Scripts-sind-die-Pest-Rants ab (Werbung ist am schlimmsten) und kommen zum Schluss: <a href="http://www.heise.de/newsticker/meldung/Facebook-Co-2-Klicks-fuer-mehr-Datenschutz-1335091.html">die 2-Klick-Methode von Heise</a> sollte man jenseits aller Facebook-Paranoia allein schon aus Performance-Gründen verwenden.</dd>
<dt>[00:25:10] <a href="http://hacks.mozilla.org/2011/11/announcing-firefox-aurora-10/">Firefox Aurora 10</a></dt>
<dd>Firefox Aurora 10 ist raus und hat 3D-Transforms, Load- und Error-Events auf Stylesheets, die Battery API, die Fullscreen API und vieles mehr an Bord.</dd>
<dt>[00:29:06] <a href="http://blog.jquery.com/2011/11/08/building-a-slimmer-jquery/">jQuery soll wieder schlanker werden</a></dt>
<dd>jQuery findet sich zu dick und will abnehmen. Ist das wirklich nötig? Warum nicht gleich Microframeworks verwenden, z.B. mit <a href="http://ender.no.de/">Ender</a>? Letztlich wohl eine Frage der persönlichen Präferenz. Außerdem: Sollte man Code lieber undokumentiert oder gar nicht veröffentlichen?</dd>
<h3>[00:51:00] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://shapecatcher.com/">Shapecatcher</a></dt>
<dd>Shapecatcher ist ein Unicode-Zeichen-Finder nach dem Malen-nach-Zahlen-Prinzip.</dd>
<dt><a href="https://twitter.com/#!/rauschma/status/134710592257802241">Mag.js sucht Autoren</a></dt>
<dd>Das JavaScript-Magazin <a href="http://www.magjs.de/">Mag.js</a> sucht Autoren. Ruhm und Ehre sind eimerweise in Aussicht.</dd>
</dl>


Während Schepp sich von der Release-Party seines Forks erholte und Markus am
Ereignishorizont eines schwarzen Internet-Lochs festhing, trümmerten Peter und
Rodney Rehm zu zweit die fällige Revision ei…

Während Schepp sich von der Release-Party seines Forks erholte und Markus am
Ereignishorizont eines schwarzen Internet-Lochs festhing, trümmerten Peter und
Rodney Rehm zu zweit die fällige Revision ein.


SCHAUNOTIZEN

[00:00:34] WORKING DRAFT BEI GOOGLE PLUS

Seid dabei und kreist uns ein!

[00:01:10] FIREFOX 8

Firefox 8 bietet neben verbesserter Performance und einer Reihe von Bugfixes ein
Update für Web Sockets, eine erste Implementierung von FileReaderSync, sowie die
Möglichkeit HTML5-Kontextmenus zu definieren. Letzteres ist aber so dermaßen
defekt, dass man lieber zu Rodneys jQuery-Polyfill greift. Außerdem will man die
eh nicht verwenden, weil die nur verwirren. Anlässlich der Performance-Frage
schweifen wir in Richtung Externe-Scripts-sind-die-Pest-Rants ab (Werbung ist am
schlimmsten) und kommen zum Schluss: die 2-Klick-Methode von Heise sollte man
jenseits aller Facebook-Paranoia allein schon aus Performance-Gründen verwenden.

[00:25:10] FIREFOX AURORA 10

Firefox Aurora 10 ist raus und hat 3D-Transforms, Load- und Error-Events auf
Stylesheets, die Battery API, die Fullscreen API und vieles mehr an Bord.

[00:29:06] JQUERY SOLL WIEDER SCHLANKER WERDEN

jQuery findet sich zu dick und will abnehmen. Ist das wirklich nötig? Warum
nicht gleich Microframeworks verwenden, z.B. mit Ender? Letztlich wohl eine
Frage der persönlichen Präferenz. Außerdem: Sollte man Code lieber
undokumentiert oder gar nicht veröffentlichen?


[00:51:00] KEINE SCHAUNOTIZEN

SHAPECATCHER

Shapecatcher ist ein Unicode-Zeichen-Finder nach dem Malen-nach-Zahlen-Prinzip.

MAG.JS SUCHT AUTOREN

Das JavaScript-Magazin Mag.js sucht Autoren. Ruhm und Ehre sind eimerweise in
Aussicht.

Revision 47: Firefox 8, Aurora 10 und jQuery-Diät mit dem dynamischen Duo

<p>Nach gefühlten Ewigkeiten waren mal wieder alle festen Hosts beieinander. Und noch jemand war da, nämlich <a href="http://twitter.com/#!/draftkraft">Haymo Meran</a>, CTO und Mitbegründer des Wiener Unternehmens <a href="http://gentics.com/">Gentics</a> und vor allem geistiger Vater des <a href="http://aloha-editor.org/">HTML5 Aloha Richtext Editors</a>.</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:02:14] <a href="http://blog.jquery.com/2011/11/03/jquery-1-7-released/">jQuery 1.7 released</a></dt>
<dd>Eine neue jQuery-Version wurde auf die Welt losgelassen, die die neue Methoden <code>on</code> und <code>off</code> für das Eventmanagment einführt, delegierte/gebubbelte Events schneller macht und nicht zuletzt ein HTML5 <a href="http://jdbartlett.com/innershiv/">innerShiv</a> Polyfill von Haus aus integriert.</dd>
<dt>[00:14:33] <a href="http://simsalabim.github.com/sisyphus/">Sisyphus.js &#8211; Gmail-like client-side drafts and bit more</a></dt>
<dd>Ein sehr praktisches jQuery-Plugin, das Formulareingaben vor dem expliziten Absenden vor Verlust schützt. Peter findet es in dem Zusammenhang jedoch schade, dass so viele Tools auf jQuery bauen, obwohl es eigentlich gar nicht nötig wäre.</dd>
<dt>[00:26:13] <a href="http://zomigi.com/blog/essential-considerations-for-crafting-quality-media-queries/">CSS Media Queries</a></dt>
<dd>Einige kleinere Geschichten, nämlich <a href="http://twitter.com/#!/simurai/statuses/132845594329874434">einsetzende Ernüchterung</a> einerseits und ein <a href="http://www.paulrhayes.com/2011-11/use-css-transitions-to-link-media-queries-and-javascript/">schöner Trick</a> andererseits, welche diese Woche zu CSS Media Queries über den Äther gingen, sind für uns der Anlass, über Responsive Web Design im Allgemeinen zu reden.</a></dd>
<dt>[00:42:13] <a href="http://www.w3.org/2011/web-apps-ws/papers/Sencha.html">Sencha Offline Web Apps Workshop Position Paper</a></dt>
<dd>James Pearce von Sencha nutzte die diesjährige <a href="http://www.w3.org/2011/11/TPAC/">W3C Technical Plenary / Advisory Committee Meetings Week, kurz TPAC</a>, um den W3C Theoretikern mal klar zu machen, was für ein Stück dampfender Bockmist der <a href="http://appcachefacts.info/">HTML5 App Cache</a> aktuell ist.</dd>
<dt>[00:55:33] <a href="http://aloha-editor.org">Aloha Editor &#8211; HTML5 WYSIWYG Editor</a></dt>
<dd>Haymo erzählt uns ein wenig was zum Aloha Editor, einem WYSIWYG/Richtext Editor der ein anderes Implementierungskonzept verfolgt als etwa TinyMCE oder der CKEditor. Dieses fußt nämlich auf HTML5 und so könnte man Aloha eigentlich auch als <code>contenteditable</code>-Polyfill einstufen.</dd>
</dl>
<h3>[01:19:52] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://blog.nodejs.org/2011/11/05/node-v0-6-0/">Node v0.6.0</a></dt>
<dd>Node.js ist in der Version 0.6 erschienen und zum ersten Mal <a href="http://nodejs.org/#download">nativ für Windows erhältlich</a>. Hurray!</dd>
<dt><a href="http://larsjung.de/h5ai/">h5ai &#8211; a beautified Apache index</a></dt>
<dd>Mit h5ai kann man das Browsen durch Apache Verzeichnis Indizes optisch um einige Lichtjahre in die Zukunft katapultieren. <a href="http://larsjung.de/h5ai/sample">Schaut selbst</a>.</dd>
</dl>


Nach gefühlten Ewigkeiten waren mal wieder alle festen Hosts beieinander. Und
noch jemand war da, nämlich Haymo Meran, CTO und Mitbegründer des Wiener
Unternehmens Gentics und vor allem geistiger Vate…

Nach gefühlten Ewigkeiten waren mal wieder alle festen Hosts beieinander. Und
noch jemand war da, nämlich Haymo Meran, CTO und Mitbegründer des Wiener
Unternehmens Gentics und vor allem geistiger Vater des HTML5 Aloha Richtext
Editors.


SCHAUNOTIZEN

[00:02:14] JQUERY 1.7 RELEASED

Eine neue jQuery-Version wurde auf die Welt losgelassen, die die neue Methoden
on und off für das Eventmanagment einführt, delegierte/gebubbelte Events
schneller macht und nicht zuletzt ein HTML5 innerShiv Polyfill von Haus aus
integriert.

[00:14:33] SISYPHUS.JS – GMAIL-LIKE CLIENT-SIDE DRAFTS AND BIT MORE

Ein sehr praktisches jQuery-Plugin, das Formulareingaben vor dem expliziten
Absenden vor Verlust schützt. Peter findet es in dem Zusammenhang jedoch schade,
dass so viele Tools auf jQuery bauen, obwohl es eigentlich gar nicht nötig wäre.

[00:26:13] CSS MEDIA QUERIES

Einige kleinere Geschichten, nämlich einsetzende Ernüchterung einerseits und ein
schöner Trick andererseits, welche diese Woche zu CSS Media Queries über den
Äther gingen, sind für uns der Anlass, über Responsive Web Design im Allgemeinen
zu reden.

[00:42:13] SENCHA OFFLINE WEB APPS WORKSHOP POSITION PAPER

James Pearce von Sencha nutzte die diesjährige W3C Technical Plenary / Advisory
Committee Meetings Week, kurz TPAC, um den W3C Theoretikern mal klar zu machen,
was für ein Stück dampfender Bockmist der HTML5 App Cache aktuell ist.

[00:55:33] ALOHA EDITOR – HTML5 WYSIWYG EDITOR

Haymo erzählt uns ein wenig was zum Aloha Editor, einem WYSIWYG/Richtext Editor
der ein anderes Implementierungskonzept verfolgt als etwa TinyMCE oder der
CKEditor. Dieses fußt nämlich auf HTML5 und so könnte man Aloha eigentlich auch
als contenteditable-Polyfill einstufen.


[01:19:52] KEINE SCHAUNOTIZEN

NODE V0.6.0

Node.js ist in der Version 0.6 erschienen und zum ersten Mal nativ für Windows
erhältlich. Hurray!

H5AI – A BEAUTIFIED APACHE INDEX

Mit h5ai kann man das Browsen durch Apache Verzeichnis Indizes optisch um einige
Lichtjahre in die Zukunft katapultieren. Schaut selbst.

Revision 46: Aloha Editor, jQuery 1.7 und halbgare Zukunftstechniken

Wöchentlicher Podcast für Frontend Devs, Design Engineers und Web-Entwickler:innen

PODLIST

Working Draft

Wöchentlicher Podcast für Frontend Devs, Design Engineers und Web-Entwickler:innen.

Neue Episoden

Revision 57: IDBExplorer, Gradient Syntax & Wrap.js

Working Draft

Revision 56: Font.js, CSS3 UI & Wunderkit

Working Draft

Revision 55: Webfundstücke und Devtools

Working Draft

Revision 54: Ein Sack voll Firefox, lahmes CSS und Media Queries

Working Draft

Revision 53: At the Smashing Magazine meetup!

Working Draft

Revision 52: Android 4.0, Webvideo & CoffeeScript

Working Draft

Revision 51: AMD, jQuery Plugin Repo & Alphatier-Gekabbel

Working Draft

Revision 50: P3P olé!

Working Draft

Revision 49: Devtools und Kleinvieh

Working Draft

Revision 48: Direkt von der beyond tellerrand. In Bewegtbild!

Working Draft

Revision 47: Firefox 8, Aurora 10 und jQuery-Diät mit dem dynamischen Duo

Working Draft

Revision 46: Aloha Editor, jQuery 1.7 und halbgare Zukunftstechniken

Working Draft