<p>Scheppman, Hans, Rodney und Kahlil trafen sich dieses mal wieder, um in illustrer Runde so zu tun, als hätten Sie eine Ahnung von Webentwicklung und so.</p>
<h3>[00:00:15] News</h3>
<dl>
<dt><a href="https://hacks.mozilla.org/2012/07/getusermedia-is-ready-to-roll/">getUserMedia() ist in Firefox gelandet</a></dt>
</dl>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:00:39] <a href="http://daneden.me/max-css/">styles.max.css</a></dt>
<dd>Daniel Eden schlägt vor, das CSS generell auch dekomprimiert auf dem Server bereit zu halten, damit Anfänger davon lernen können.</dd>
<dt>[00:12:40] <a href="http://www.nczonline.net/blog/2012/07/11/its-time-to-stop-blaming-internet-explorer/">It’s time to stop blaming Internet Explorer</a></dt>
<dd>Den Nicholas C. Zakas ermüdet das ewige IE-Gebashe und wir stimmen in diesen Kanon mit ein.</dd>
<dt>[00:22:06] <a href="http://bricss.net/post/24672339016/box-decoration-break-finally-coming-to-more-browsers">box-decoration-break in Anmarsch</a></dt>
<dd>So langsam kommt <a href="http://www.w3.org/TR/css3-background/#box-decoration-break">box-decoration-break</a> in die Browser. Der Schepp und Rodney sinnieren über die Sinnhaftigkeit des Propertys.</dd>
<dt>[00:40:22] <a href="http://weblog.latte.ca/blake/employment/mozilla/x-tags.html">X-tag &#8211; reduce your html</a></dt>
<dd>Der Autor behilft sich mit JavaScript, um HTML-Code zu sparen. Wir sinnieren auch hier über die Sinnhaftigkeit dessen.</dd>
</dl>
<h3>[00:49:48] Keine Schaunotizen</h3>
<dl>
<dt><a href="https://moqups.com/">Moqup</a></dt>
<dd>Mockups mit HTML5.</dd>
<dt><a href="http://www.smashingmagazine.com/2012/07/11/avoiding-faux-weights-styles-google-web-fonts/">Avoiding Faux Weights And Styles With Google Web Fonts</a></dt>
<dd>Ein Artikel über die richtige Einbindung von Google Web Fonts.</dd>
<dt><a href="http://www.xanthir.com/blog/b4Ju0">CSS Parser</a></dt>
<dd>Ein CSS Parser aus JavaScript.</dd>
<dt><a href="http://dailyjs.com/2012/07/09/function-2/">DailyJS: JS101: The Function Constructor</a></dt>
<dd>DailyJS erzählt Euch mal was über den Function Constructor.</dd>
<dt><a href="http://2012.jsconf.us/">JSConf.US 2012 Videos</a></dt>
<dd>Die Vorträge von JSConf.US</dd>
</dl>


Scheppman, Hans, Rodney und Kahlil trafen sich dieses mal wieder, um in
illustrer Runde so zu tun, als hätten Sie eine Ahnung von Webentwicklung und so.


[00:00:15] NEWS

GETUSERMEDIA() IST IN FIREFO…

Working Draft

Scheppman, Hans, Rodney und Kahlil trafen sich dieses mal wieder, um in
illustrer Runde so zu tun, als hätten Sie eine Ahnung von Webentwicklung und so.


[00:00:15] NEWS

GETUSERMEDIA() IST IN FIREFOX GELANDET


SCHAUNOTIZEN

[00:00:39] STYLES.MAX.CSS

Daniel Eden schlägt vor, das CSS generell auch dekomprimiert auf dem Server
bereit zu halten, damit Anfänger davon lernen können.

[00:12:40] IT’S TIME TO STOP BLAMING INTERNET EXPLORER

Den Nicholas C. Zakas ermüdet das ewige IE-Gebashe und wir stimmen in diesen
Kanon mit ein.

[00:22:06] BOX-DECORATION-BREAK IN ANMARSCH

So langsam kommt box-decoration-break in die Browser. Der Schepp und Rodney
sinnieren über die Sinnhaftigkeit des Propertys.

[00:40:22] X-TAG – REDUCE YOUR HTML

Der Autor behilft sich mit JavaScript, um HTML-Code zu sparen. Wir sinnieren
auch hier über die Sinnhaftigkeit dessen.


[00:49:48] KEINE SCHAUNOTIZEN

MOQUP

Mockups mit HTML5.

AVOIDING FAUX WEIGHTS AND STYLES WITH GOOGLE WEB FONTS

Ein Artikel über die richtige Einbindung von Google Web Fonts.

CSS PARSER

Ein CSS Parser aus JavaScript.

DAILYJS: JS101: THE FUNCTION CONSTRUCTOR

DailyJS erzählt Euch mal was über den Function Constructor.

JSCONF.US 2012 VIDEOS

Die Vorträge von JSConf.US

Revision 80: X-Tag, Print Styles und IE-Basher bashen

<p>Schepp war nicht da, aber mit Rodney, Hans, Kahlil und Peter an Bord waren wir trotzdem beschlussfähig. Haben wir schon erwähnt, dass Rodney seit letzter Woche offizieller Bestandteil der Crew von Working Draft ist? Glückwunsch Rodney!</p>
<h3>[00:00:22] News</h3>
<dl>
<dt><a href="http://www.w3.org/TR/2012/WD-fullscreen-20120703/">Fullscreen-API</a></dt>
<dd>Jetzt offizieller Working Draft</dd>
<dt><a href="http://paulrouget.com/e/unprefixing-in-firefox-16/">Weniger Prefixes in Firefox</a></dt>
<dd>Ab Version&nbsp;16 sind Animationen, Transitions, Transforms und Gradients nicht mehr geprefixt</dd>
</dl>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:01:14] <a href="http://hacks.mozilla.org/2012/07/why-no-filesystem-api-in-firefox/">Why no FileSystem API in Firefox?</a></dt>
<dd>Jonas Sicking erklärt, warum wir nicht damit rechnen sollten, die <a href="http://dev.w3.org/2009/dap/file-system/file-dir-sys.html">File System</a> und <a href="http://dev.w3.org/2009/dap/file-system/file-writer.html">File Writer</a> zeitnah im Firefox vorzufinden. Andere APIs wie z.B. <a href="https://developer.mozilla.org/en/IndexedDB">Indexed&nbsp;DB</a> und <a href="http://www.w3.org/TR/webstorage/">Web Storage</a> können fast alle Aufgaben der FS-API übernehmen. Wir gehen im Prinzip d‘accord und finden auch, dass die Alternativen einfach viel schöner sind, als der elaboriert-javaeske Code, der bei der FS-API anfällt&nbsp;&ndash; man sehe sich nur mal <a href="http://www.html5rocks.com/de/tutorials/file/filesystem/">dieses Tutorial</a> an. Und wer gar nicht ohne File System API kann, dem helfen (auf Indexed&nbsp;DB aufsetzende) <a href="https://github.com/ebidel/idb.filesystem.js">Polyfills</a>.</dd>
<dt>[00:16:06] <a href="http://dailyjs.com/2012/07/05/evolution-chrome-apps/">Chrome Apps: JavaScript Desktop Development</a></dt>
<dd>Google hat auf der diesjährigen Google I/O mal wieder die Revolution <a href="https://www.youtube.com/watch?v=j8oFAr1YR-0">angekündigt</a>&nbsp;&ndash; diesmal sollen‘s Webapps auf dem Desktop werden. Klingt eigentlich ganz schön, nur Peter fühlt sich an <a href="http://www.adobe.com/products/air.html">Adobe Air</a> erinnert und fragt sich, warum man sich Web-Gefrickel auf der Clientseite wünschen sollte. Immerhin sollen die entstehenden Technologien in die <a href="http://www.w3.org/2012/05/sysapps-wg-charter.html">System Applications Working Group</a> eingebracht werden, so dass vielleicht der eine oder andere Webstandard daraus entsteht.</dd>
</dl>
<h3>[00:30:42] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://try.github.com/levels/1/challenges/1">Git in 15 Minutes</a></dt>
<dd>Großartiges interaktives Tutorial.</dd>
<dt><a href="https://github.com/blog/1187-github-android-app-released">GitHub Android App Released</a></dt>
<dd>Github&nbsp;&ndash; jetzt auch für alle, die sich kein iPhone leisten können!</dd>
<dt><a href="http://www.phptherightway.com/">PHP&nbsp;&ndash; The right way</a></dt>
<dd>Versucht, den zahllosen ranzigen Tutorials im Web die Stirn zu bieten.</dd>
<dt><a href="http://james.padolsey.com/javascript/replacing-text-in-the-dom-solved/">Replacing Text in DOM</a></dt>
<dd>Diese Technik kommt auch mit größeren Tag-Verschachtelungen klar und liefert ein valides Ergebnis.</dd>
<dt><a href="http://www.nczonline.net/blog/2012/07/05/ios-has-a-hover-problem/">iOS has a :hover problem</a></dt>
<dd>Erklärt, unter welchen Umstände iOS einen Klick/Tap als :hover interpretiert.</dd>
<dt><a href="http://wiki.typo3.org/Code_Sprint_Freiburg_2012">TYPO3 Codesprint Freiburg</a></dt>
<dd>Hans will mit euch am 13. Juli Typo3 aufmöbeln.</dd>
</dl>


Schepp war nicht da, aber mit Rodney, Hans, Kahlil und Peter an Bord waren wir
trotzdem beschlussfähig. Haben wir schon erwähnt, dass Rodney seit letzter Woche
offizieller Bestandteil der Crew von Wor…

Schepp war nicht da, aber mit Rodney, Hans, Kahlil und Peter an Bord waren wir
trotzdem beschlussfähig. Haben wir schon erwähnt, dass Rodney seit letzter Woche
offizieller Bestandteil der Crew von Working Draft ist? Glückwunsch Rodney!


[00:00:22] NEWS

FULLSCREEN-API

Jetzt offizieller Working Draft

WENIGER PREFIXES IN FIREFOX

Ab Version 16 sind Animationen, Transitions, Transforms und Gradients nicht mehr
geprefixt


SCHAUNOTIZEN

[00:01:14] WHY NO FILESYSTEM API IN FIREFOX?

Jonas Sicking erklärt, warum wir nicht damit rechnen sollten, die File System
und File Writer zeitnah im Firefox vorzufinden. Andere APIs wie z.B. Indexed DB
und Web Storage können fast alle Aufgaben der FS-API übernehmen. Wir gehen im
Prinzip d‘accord und finden auch, dass die Alternativen einfach viel schöner
sind, als der elaboriert-javaeske Code, der bei der FS-API anfällt – man sehe
sich nur mal dieses Tutorial an. Und wer gar nicht ohne File System API kann,
dem helfen (auf Indexed DB aufsetzende) Polyfills.

[00:16:06] CHROME APPS: JAVASCRIPT DESKTOP DEVELOPMENT

Google hat auf der diesjährigen Google I/O mal wieder die Revolution
angekündigt – diesmal sollen‘s Webapps auf dem Desktop werden. Klingt eigentlich
ganz schön, nur Peter fühlt sich an Adobe Air erinnert und fragt sich, warum man
sich Web-Gefrickel auf der Clientseite wünschen sollte. Immerhin sollen die
entstehenden Technologien in die System Applications Working Group eingebracht
werden, so dass vielleicht der eine oder andere Webstandard daraus entsteht.


[00:30:42] KEINE SCHAUNOTIZEN

GIT IN 15 MINUTES

Großartiges interaktives Tutorial.

GITHUB ANDROID APP RELEASED

Github – jetzt auch für alle, die sich kein iPhone leisten können!

PHP – THE RIGHT WAY

Versucht, den zahllosen ranzigen Tutorials im Web die Stirn zu bieten.

REPLACING TEXT IN DOM

Diese Technik kommt auch mit größeren Tag-Verschachtelungen klar und liefert ein
valides Ergebnis.

IOS HAS A :HOVER PROBLEM

Erklärt, unter welchen Umstände iOS einen Klick/Tap als :hover interpretiert.

TYPO3 CODESPRINT FREIBURG

Hans will mit euch am 13. Juli Typo3 aufmöbeln.

Revision 79: File System API, Chrome Apps und ein Haufen Links

<p>Die gesamte Crew war an Bord, allerdings leider auch die Skype-Dämonen. Wir hoffen dass die Themen-Menge für die sporadischen Audio-Fails kompensiert.</p>
<h3>[00:00:16] News</h3>
<dl>
<dt><a href="http://lists.webkit.org/pipermail/webkit-dev/2012-June/021315.html">New (experimental) CSS feature: Hierarchies</a></dt>
<dd>Jetzt zum ausprobieren in Webkit Nightlies</dd>
<dt><a href="http://www.w3.org/TR/2012/WD-web-intents-20120626/">Web Intents</a></dt>
<dd>Seit kurzem offizieller W3C-Draft</dd>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:01:08] Editoren &amp; IDEs</dt>
<dd>Web-IDE Cloud9 stellt (unter anderem) sein neues <a href="http://c9.io/site/blog/2012/06/cloud9ide-new-features/">Collaboration-Feature</a> vor, während Adobe mit <a href="http://brackets.io/">Brackets</a> seine eigene Fassung eines Online-Codeeditors veröffentlicht (mit einigen sehr schicken Features). In der Offline-Welt ist derweil <a href="http://www.sublimetext.com/blog/articles/sublime-text-2-0-released">Sublime Text 2.0 Stable</a> erschienen. Ebenfalls offline, aber nicht ganz so traditionell kommt <a href=http://www.kickstarter.com/projects/ibdknox/light-table">Light Table</a> daher, von dem es mittlerweile <a href="http://www.chris-granger.com/2012/06/24/its-playtime/">erste Brocken</a> zu sehen gibt. Wir finden die Auswahl super, aber können Online-IDEs auch wirklich alles leisten, was ihre Offline-Verwandten können, z.B. Buildprozesse mit PNG-Optimierung? <a href="http://richardassar.github.com/pngcrush.js/">Möglich sein sollte es eigentlich.</a> Peter baut sich seinen eigenen Cloud-Editor, indem er sein Sublime Text&nbsp;2 nebst Einstellungen mittels <a href="https://one.ubuntu.com/">Ubuntu One</a> zwischen seinen Rechnern synchronisiert.</dd>
<dt>[00:20:42] Die Zukunft von jQuery</dt>
<dd><a href="http://blog.jquery.com/2012/06/22/jquery-1-8-beta-1-see-whats-coming-and-going/">jQuery 1.8 ward angekündigt!</a> Neu ist neben automatischen Vendor-Prefixes und so mancher internen Aufräumaktion vor allem Modularität, ganz ähnlich wie bei <a href="http://mootools.net/core/">MooTools</a>. Auch für die Versionen 1.9 und 2.0 <a href="http://blog.jquery.com/2012/06/28/jquery-core-version-1-9-and-beyond/">laufen bereits die Planungen</a>. Beide Versionen sollen die gleiche API haben&nbsp;&ndash; der einzige Unterschied ist, dass sich 2.0 die Unterstützung für alte Internet Explorer spart. Genaueres ist den <a href="http://www.slideshare.net/dmethvin/jquery-conference-2012-keynote">Slides der jQuery Conference 2012 keynote</a> zu entnehmen.</dd>
<dt>[00:34:20] <a href="http://yeoman.io/">Yeoman</a></dt>
<dd>Yeoman hält sich für eine Sammlung von Tools für Frontend-Entwicklung, Kahlil spricht hingegen einfach von &#8222;<a href="https://github.com/cowboy/grunt">Grunt</a> auf Crack&#8220;. Zusätzliche Features sind im wesentlichen Presents und ein paar Extra-Plugins für Grunt. Peter sieht nicht ganz ein, warum er sich von irgendwelchen Hanseln Grunt vorkonfigurieren lassen sollte, wenn er das doch selbst ganz gut kann.</dd>
<dt>[00:54:23] <a href="http://www.mobilexweb.com/blog/chrome-ios-android-4-1-jelly-bean-html5">Chrome für iOS</a></dt>
<dd>Chrome für iOS ist da und findet durchaus unser Gefallen. Er kommt zwar notgedrungen ohne V8 daher und ist daher sogar eigentlich noch langsamer als Safari, aber <a href="http://robert.accettura.com/blog/2012/06/28/perception-of-performance/comment-page-1/#comment-1761355">ein paar Speed-Schmankerl</a> gibt es trotzdem.</dd>
</dl>
<h3>[01:04:47] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://f.cl.ly/items/192E3I3O3o1w2b0a1g2l/How%20to%20Retinafy%20your%20Website.pdf">Retinafy your Website</a></dt>
<dd>Zum Ausdrucken und aufhängen.</dd>
<dt><a href="http://tommoor.github.com/tinycon/">Tinycon &#8211; Favicon Alert Bubbles</a></dt>
<dd><q lang="en">A small library for manipulating the favicon</q></dd>
<dt><a href="http://coding.smashingmagazine.com/2012/06/27/introduction-to-javascript-unit-testing/">Introduction To JavaScript Unit Testing</a></dt>
<dd>Autor <a href="http://bassistance.de/">Jörn Zaefferer</a> ist für <a href="http://docs.jquery.com/QUnit">QUnit</a>, das Testframework von jQuery, verantwortlich.</dd>
<dt><a href="http://symbolset.com/">Symbolset</a></dt>
<dd>Eine bessere Icon-Font.</dd>
<dt><a href="http://googlewebmastercentral.blogspot.de/2012/06/recommendations-for-building-smartphone.html">Recommendations for building smartphone-optimized websites</a></dt>
<dd>Google sagt wie sie&#8217;s gern hätten.</dd>
<dt><a href="http://christianheilmann.com/2012/07/02/google-io-2012-notes-lots-of-them/">Google IO 2012 Notes</a></dt>
<dd>Gesammelt von Christian Heilmann.</dd>
<dt><a href="https://github.com/SirPepe/HTML5Resources">SirPepe/HTML5Resources</a></dt>
<dd>Peter sammelt Links.</dd>
<dt><a href="http://darcyclarke.me/dev/repojs/">Repo.js</a></dt>
<dd>Sehr schick: Github-Projekte direkt in Websites einbetten!</dd>
<dt><a href="http://benpickles.github.com/peity/">Peity</a></dt>
<dd>Dynamisch generierte Inline-Graphen.</dd>
</dl>


Die gesamte Crew war an Bord, allerdings leider auch die Skype-Dämonen. Wir
hoffen dass die Themen-Menge für die sporadischen Audio-Fails kompensiert.


[00:00:16] NEWS

NEW (EXPERIMENTAL) CSS FEATURE…

Die gesamte Crew war an Bord, allerdings leider auch die Skype-Dämonen. Wir
hoffen dass die Themen-Menge für die sporadischen Audio-Fails kompensiert.


[00:00:16] NEWS

NEW (EXPERIMENTAL) CSS FEATURE: HIERARCHIES

Jetzt zum ausprobieren in Webkit Nightlies

WEB INTENTS

Seit kurzem offizieller W3C-Draft


SCHAUNOTIZEN

[00:01:08] EDITOREN & IDES

Web-IDE Cloud9 stellt (unter anderem) sein neues Collaboration-Feature vor,
während Adobe mit Brackets seine eigene Fassung eines Online-Codeeditors
veröffentlicht (mit einigen sehr schicken Features). In der Offline-Welt ist
derweil Sublime Text 2.0 Stable erschienen. Ebenfalls offline, aber nicht ganz
so traditionell kommt Light Table daher, von dem es mittlerweile erste Brocken
zu sehen gibt. Wir finden die Auswahl super, aber können Online-IDEs auch
wirklich alles leisten, was ihre Offline-Verwandten können, z.B. Buildprozesse
mit PNG-Optimierung? Möglich sein sollte es eigentlich. Peter baut sich seinen
eigenen Cloud-Editor, indem er sein Sublime Text 2 nebst Einstellungen mittels
Ubuntu One zwischen seinen Rechnern synchronisiert.

[00:20:42] DIE ZUKUNFT VON JQUERY

jQuery 1.8 ward angekündigt! Neu ist neben automatischen Vendor-Prefixes und so
mancher internen Aufräumaktion vor allem Modularität, ganz ähnlich wie bei
MooTools. Auch für die Versionen 1.9 und 2.0 laufen bereits die Planungen. Beide
Versionen sollen die gleiche API haben – der einzige Unterschied ist, dass sich
2.0 die Unterstützung für alte Internet Explorer spart. Genaueres ist den Slides
der jQuery Conference 2012 keynote zu entnehmen.

[00:34:20] YEOMAN

Yeoman hält sich für eine Sammlung von Tools für Frontend-Entwicklung, Kahlil
spricht hingegen einfach von „Grunt auf Crack“. Zusätzliche Features sind im
wesentlichen Presents und ein paar Extra-Plugins für Grunt. Peter sieht nicht
ganz ein, warum er sich von irgendwelchen Hanseln Grunt vorkonfigurieren lassen
sollte, wenn er das doch selbst ganz gut kann.

[00:54:23] CHROME FÜR IOS

Chrome für iOS ist da und findet durchaus unser Gefallen. Er kommt zwar
notgedrungen ohne V8 daher und ist daher sogar eigentlich noch langsamer als
Safari, aber ein paar Speed-Schmankerl gibt es trotzdem.


[01:04:47] KEINE SCHAUNOTIZEN

RETINAFY YOUR WEBSITE

Zum Ausdrucken und aufhängen.

TINYCON – FAVICON ALERT BUBBLES

A small library for manipulating the favicon

INTRODUCTION TO JAVASCRIPT UNIT TESTING

Autor Jörn Zaefferer ist für QUnit, das Testframework von jQuery,
verantwortlich.

SYMBOLSET

Eine bessere Icon-Font.

RECOMMENDATIONS FOR BUILDING SMARTPHONE-OPTIMIZED WEBSITES

Google sagt wie sie’s gern hätten.

GOOGLE IO 2012 NOTES

Gesammelt von Christian Heilmann.

SIRPEPE/HTML5RESOURCES

Peter sammelt Links.

REPO.JS

Sehr schick: Github-Projekte direkt in Websites einbetten!

PEITY

Dynamisch generierte Inline-Graphen.

Revision 78: Editoren, jQuery, Yeoman, Browser

<p>Überraschung: Sowohl Schepp als auch Peter waren zur Abwechlsung mal wieder an Bord. <a href="http://blog.rodneyrehm.de/">Der ewige Rod</a> vertrat Hans und Kahlil.</p>
<h3>[00:00:22] News</h3>
<dl>
<dt><a href="http://www.webmonkey.com/2012/06/its-official-css-media-queries-are-a-web-standard">It&#8217;s Official, CSS Media Queries Are a Web Standard</a></dt>
<dd>CSS3 Media Queries sind eine fertige W3C Recommendation</dd>
</dl>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:00:55] <a href="http://laboratorium.net/archive/2012/06/19/the_sabotage_of_do_not_track">The Sabotage of Do Not Track</a></dt>
<dd>Kommt er oder kommt er nicht, der Do-Not-Track-Header? Und wenn ja, wie? Seit der Microsoft-Ankündigung, <a href="http://blogs.technet.com/b/microsoft_on_the_issues/archive/2012/05/31/advancing-consumer-trust-and-privacy-internet-explorer-in-windows-8.aspx">den IE10 per Default DNT:1 schicken zu lassen</a> regt sich Widerstand bei den Werbenetzwerken. Ohne irgendwelche Gesetzgebung, als reiner Webstandard, wird es wohl schwer für Do Not Track&nbsp;&hellip;</dd>
<dt>[00:18:30] <a href="http://www.backalleycoder.com/2012/04/25/i-want-a-damnodeinserted/">I Want a DAMNodeInserted Event</a></dt>
<dd>Epischer Hack implementiert einen primitiven DOM-Observer für Insertions, quasi als Teil-Polyfill für die in <a href="http://workingdraft.de/71/">Revision&nbsp;71</a> schon besprochenen <a href="http://hacks.mozilla.org/2012/05/dom-mutationobserver-reacting-to-dom-changes-without-killing-browser-performance/">DOM Mutation Observers</a>. Der Trick ist zwar recht abgefahren, für Dinge wie <a href="https://github.com/yatil/accessifyhtml5.js">accessifyhtml5.js</a> aber sicher von Wert (falls man nicht gerade jQuery verwendet und <a href="http://blog.rodneyrehm.de/archives/11-jQuery-Hooks.html">die entsprechenden Hooks</a> benutzt).</dd>
<dt>[00:29:05] <a href="https://air.mozilla.org/x-tags/">X-Tag – Web Components Workshop</a> und <a href="http://blogs.adobe.com/webplatform/2012/06/25/working-with-css-regions-and-shadow-dom/">Working with CSS Regions and Shadow DOM</a></dt>
<dd>Präsentation eines Polyfills für <a href="http://mozilla.github.com/x-tag/">Web Components</a> (ihr wisst schon, <a href="http://glazkov.com/2011/01/14/what-the-heck-is-shadow-dom/">Shadow DOM</a> und so) und ein Adobe-Artikel zur Kombination von Shadow DOM und <a href="http://vimeo.com/32126964">CSS3 Regions</a>.</dd>
<dt>[00:42:35] <a href="http://www.perun.net/2012/06/24/kommentar-der-ihk-zwang-muss-abgeschafft-werden/">Der IHK-Zwang muss abgeschafft werden</a></dt>
<dd> Vladimir Simovic erklärt uns warum der IHK-Zwang in die Tonne getreten gehört. Wir gehen d&#8217;accord und fordern <a href="https://epetitionen.bundestag.de/index.php?action=petition%3Bsa%3Dsign%3Bpetition%3D24793%3Blimit%3D10%3Bsort%3Dpet_sign_nr%3Bdir%3Ddown%3Bstart%3D0">zum Unterzeichnen der dazugehörigen Petition</a> auf.</dd>
</dl>
<h3>[00:57:05] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://refiddle.com/">reFiddle</a></dt>
<dd>JSFiddle für Regex.</dd>
<dt><a href="http://www.2ality.com/2012/06/continuation-passing-style.html">Asynchronous programming and continuation-passing style in JavaScript</a></dt>
<dd>Der Doktor erleuchtet uns über asynchrones JS.</dd>
<dt><a href="http://dailyjs.com/tags.html#js101">DailyJS #js101</a></dt>
<dd>Artikel für JavaScript-Einsteiger.</dd>
<dt><a href="http://jsfiddle.net/cowboy/qzRjD/show/">Grunt plugins published to Npm</a></dt>
<dd>Damit man nicht mehr selbst Tasks bauen muss.</dd>
<dt><a href="http://tracelytics.github.com/pageguide/">pageguide.js</a></dt>
<dd><q lang="en">An interactive guide for web page elements using jQuery and CSS3.</q></dd>
<dt><a href="http://www.netmagazine.com/features/10-things-you-didnt-know-javascript-could-do">10 things you didn&#8217;t know JavaScript could do</a></dt>
<dd>Von <a href="https://twitter.com/asciidisco">@asciidisco</a>.</dd>
<dt><a href="http://www.w3.org/Provider/Style/URI.html">Cool URIs don&#8217;t change</a></dt>
<dd>Steinalt, aber immer noch relevant und richtig.</dd>
<dt><a href="http://badassjs.com/post/25369867558/shumway-mozillas-flash-vm-and-runtime-in-javascript">Shumway</a> &#038; <a href="http://vimeo.com/44090302">bikeshed.js</a></dt>
<dd>Flash-Interpreter in JS.</dd>
<dt><a href="http://www.456bereastreet.com/archive/201205/css_generated_content_and_screen_readers/">CSS generated content and screen readers</a></dt>
<dd>Die lesen das Zeug vor!</dd>
<dt><a href="https://github.com/Prinzhorn/skrollr">Skrollr</a></dt>
<dd>Scrolling-Library ohne Dependencies.</dd>
</dl>


Überraschung: Sowohl Schepp als auch Peter waren zur Abwechlsung mal wieder an
Bord. Der ewige Rod vertrat Hans und Kahlil.


[00:00:22] NEWS

IT’S OFFICIAL, CSS MEDIA QUERIES ARE A WEB STANDARD

CSS3…

Überraschung: Sowohl Schepp als auch Peter waren zur Abwechlsung mal wieder an
Bord. Der ewige Rod vertrat Hans und Kahlil.


[00:00:22] NEWS

IT’S OFFICIAL, CSS MEDIA QUERIES ARE A WEB STANDARD

CSS3 Media Queries sind eine fertige W3C Recommendation


SCHAUNOTIZEN

[00:00:55] THE SABOTAGE OF DO NOT TRACK

Kommt er oder kommt er nicht, der Do-Not-Track-Header? Und wenn ja, wie? Seit
der Microsoft-Ankündigung, den IE10 per Default DNT:1 schicken zu lassen regt
sich Widerstand bei den Werbenetzwerken. Ohne irgendwelche Gesetzgebung, als
reiner Webstandard, wird es wohl schwer für Do Not Track …

[00:18:30] I WANT A DAMNODEINSERTED EVENT

Epischer Hack implementiert einen primitiven DOM-Observer für Insertions, quasi
als Teil-Polyfill für die in Revision 71 schon besprochenen DOM Mutation
Observers. Der Trick ist zwar recht abgefahren, für Dinge wie accessifyhtml5.js
aber sicher von Wert (falls man nicht gerade jQuery verwendet und die
entsprechenden Hooks benutzt).

[00:29:05] X-TAG – WEB COMPONENTS WORKSHOP UND WORKING WITH CSS REGIONS AND
SHADOW DOM

Präsentation eines Polyfills für Web Components (ihr wisst schon, Shadow DOM und
so) und ein Adobe-Artikel zur Kombination von Shadow DOM und CSS3 Regions.

[00:42:35] DER IHK-ZWANG MUSS ABGESCHAFFT WERDEN

Vladimir Simovic erklärt uns warum der IHK-Zwang in die Tonne getreten gehört.
Wir gehen d’accord und fordern zum Unterzeichnen der dazugehörigen Petition auf.


[00:57:05] KEINE SCHAUNOTIZEN

REFIDDLE

JSFiddle für Regex.

ASYNCHRONOUS PROGRAMMING AND CONTINUATION-PASSING STYLE IN JAVASCRIPT

Der Doktor erleuchtet uns über asynchrones JS.

DAILYJS #JS101

Artikel für JavaScript-Einsteiger.

GRUNT PLUGINS PUBLISHED TO NPM

Damit man nicht mehr selbst Tasks bauen muss.

PAGEGUIDE.JS

An interactive guide for web page elements using jQuery and CSS3.

10 THINGS YOU DIDN’T KNOW JAVASCRIPT COULD DO

Von @asciidisco.

COOL URIS DON’T CHANGE

Steinalt, aber immer noch relevant und richtig.

SHUMWAY & BIKESHED.JS

Flash-Interpreter in JS.

CSS GENERATED CONTENT AND SCREEN READERS

Die lesen das Zeug vor!

SKROLLR

Scrolling-Library ohne Dependencies.

Revision 77: Do not Track, IHK-Petition und Web Components

<p>Dieses mal trafen sich Hans, <a href="http://www.asciidisco.com">Sebastian Golasch</a> aka <a href="https://twitter.com/#!/asciidisco">@asciidisco</a> und Kahlil in Skype, um sich durch einen stattliche Anzahl an Themen zu arbeiten. </p>
<h3>[00:00:40] News</h3>
<dl>
<dt><a href="http://www.w3.org/TR/css3-images/#image-resolution">image-resolution in Webkit</a></dt>
<dt><a href="http://trac.webkit.org/changeset/120154">CSS Variables in WebKit (prefixed)</a></dt>
<dt><a href="http://dbaron.org/log/20120612-border-image">Border-Image in Firefox 15</a></dt>
<dt><a href="http://my.opera.com/ODIN/blog/hello-opera-12">Opera 12 ist da</a></dt>
<dt><a href="http://www.kogan.com/au/blog/new-internet-explorer-7-tax/">Die IE7-Steuer</a></dt>
</dl>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:02:21] <a href="http://zombie.labnotes.org/">Zombie.js</a></dt>
<dd>Ein schneller, kopfloser Browser auf Node.js Basis um JavaScript zu testen. Nützlich?</dd>
<dt>[00:14:15] <a href="http://bradfrostweb.com/blog/mobile/test-on-real-mobile-devices-without-breaking-the-bank/">Auf echten mobilen Endgeräten testen ohne Bankrott zu gehen</a></dt>
<dd>Brad Frost spricht über die Anschaffungskosten für mobile Endgeräte, die man zum testen braucht und macht Vorschläge, wie man Kosten sparen kann. Wir reden darüber und über die weiteren Aufwände, die beim Testen von mobilen Geräten aufkommen.</dd>
<dt>[00:25:34] <a href="http://taitems.tumblr.com/post/24936855546/what-ios-6-mobile-safari-offers-front-end-devs">Mobile Safari auf iOS 6</a></dt>
<dd>Welche Features bringt Safari in iOS 6 für uns Webentwickler?</dd>
<dt>[00:31:42] <a href="https://github.com/volojs/volo">Volo.js</a></dt>
<dd>Sebastian erklärt uns ausführlich was es mit Volo.js und anderen Dependency Managern für JavaScript im Frontend auf sich hat.</dd>
<dt>[00:45:54] JavaScript Doc Tools</dt>
<dd>Sebastian und Kahlil tauschen sich über ihre Erfahrungen mit JavaScript Dokumentations-Tools wie <a href="http://yui.github.com/yuidoc/">YUI Doc</a> und <a href="http://jashkenas.github.com/docco/">docco</a> aus.</dd>
</dl>
<h3>[00:56:05] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://gradientfinder.com/">Gradient Finder</a></dt>
<dd>Findet CSS-Gradients in einem Bild.</dd>
<dt><a href="https://developer.mozilla.org/en/CSS/CSS_Reference/Mozilla_Extensions">Mozilla CSS Extensions</a></dt>
<dd>Liste aller mozillaspezifischen CSS-Erweiterungen.</dd>
<dt><a href="http://www.igvita.com/2012/06/14/debunking-responsive-css-performance-myths/">Debunking Responsive CSS Performance Myths</a></dt>
<dd>CSS Performance-Mythen entkräften</dd>
<dt><a href="http://www.peterkroener.de/es6-maps-sets-weak-maps/">ECMAScript 6: Maps, Sets und Weak Maps</a></dt>
<dd>Peter Kröner über neue JavaScript-Features.</dd>
<dt><a href="https://github.com/millermedeiros/requirejs-hogan-plugin">Require.js Hogan Plugin</a></dt>
<dd>Templates im Buildprozess direkt kompilieren.</dd>
<dt><a href="http://editorconfig.org">EditorConfig</a></dt>
<dd>Editoreinstellungen projektweit festlegen.</dd>
<dt><a href="http://vimeo.com/44182484">How Browsers Work Internally (Video)</a></dt>
<dd>Talk von Tali Garsiel auf der Front-Trends 2012.</dd>
<dt><a href="http://www.golem.de/news/memsql-mysql-kompatibel-aber-30-mal-schneller-1206-92595.html">memSQL</a></dt>
<dd>memSQL ist angeblich 30 mal schneller als SQL</dd>
<dt><a href="http://blogs.adobe.com/bparadie/2012/05/07/the-pew-pew-manifesto/">Pew Pew Manifesto</a></dt>
<dd>Adobe propagiert, daß sich JavaScript für große Projekte nicht eignet.</dd>


Dieses mal trafen sich Hans, Sebastian Golasch aka @asciidisco und Kahlil in
Skype, um sich durch einen stattliche Anzahl an Themen zu arbeiten.


[00:00:40] NEWS

IMAGE-RESOLUTION IN WEBKIT

CSS VARI…

Dieses mal trafen sich Hans, Sebastian Golasch aka @asciidisco und Kahlil in
Skype, um sich durch einen stattliche Anzahl an Themen zu arbeiten.


[00:00:40] NEWS

IMAGE-RESOLUTION IN WEBKIT

CSS VARIABLES IN WEBKIT (PREFIXED)

BORDER-IMAGE IN FIREFOX 15

OPERA 12 IST DA

DIE IE7-STEUER


SCHAUNOTIZEN

[00:02:21] ZOMBIE.JS

Ein schneller, kopfloser Browser auf Node.js Basis um JavaScript zu testen.
Nützlich?

[00:14:15] AUF ECHTEN MOBILEN ENDGERÄTEN TESTEN OHNE BANKROTT ZU GEHEN

Brad Frost spricht über die Anschaffungskosten für mobile Endgeräte, die man zum
testen braucht und macht Vorschläge, wie man Kosten sparen kann. Wir reden
darüber und über die weiteren Aufwände, die beim Testen von mobilen Geräten
aufkommen.

[00:25:34] MOBILE SAFARI AUF IOS 6

Welche Features bringt Safari in iOS 6 für uns Webentwickler?

[00:31:42] VOLO.JS

Sebastian erklärt uns ausführlich was es mit Volo.js und anderen Dependency
Managern für JavaScript im Frontend auf sich hat.

[00:45:54] JAVASCRIPT DOC TOOLS

Sebastian und Kahlil tauschen sich über ihre Erfahrungen mit JavaScript
Dokumentations-Tools wie YUI Doc und docco aus.


[00:56:05] KEINE SCHAUNOTIZEN

GRADIENT FINDER

Findet CSS-Gradients in einem Bild.

MOZILLA CSS EXTENSIONS

Liste aller mozillaspezifischen CSS-Erweiterungen.

DEBUNKING RESPONSIVE CSS PERFORMANCE MYTHS

CSS Performance-Mythen entkräften

ECMASCRIPT 6: MAPS, SETS UND WEAK MAPS

Peter Kröner über neue JavaScript-Features.

REQUIRE.JS HOGAN PLUGIN

Templates im Buildprozess direkt kompilieren.

EDITORCONFIG

Editoreinstellungen projektweit festlegen.

HOW BROWSERS WORK INTERNALLY (VIDEO)

Talk von Tali Garsiel auf der Front-Trends 2012.

MEMSQL

memSQL ist angeblich 30 mal schneller als SQL

PEW PEW MANIFESTO

Adobe propagiert, daß sich JavaScript für große Projekte nicht eignet.

Revision 76: Testen, Dokumentieren und Abhängigkeiten verwalten

<p>Eine Kombination aus Sommerloch, EM, WWDC und Schepps Urlaub sorgt erneut für Magerkost bei den Themen. Kann man nichts machen! Dafür führen wir mit den News einen neuen Sendungsbestandteil ein, bei dem es in Zukunft (?) immer ein paar kurze Update-Durchsagen geben soll.</p>
<h3>[00:00:11] News</h3>
<dl>
<dt><a href="http://www.w3.org/blog/CSS/2012/06/06/resolutions-40/">Transitions, Transforms and Animations may be released unprefixed</a></dt>
<dd>Die CSS Working Group erklärt Transitions, Transforms und Animationen für praktisch fertig und der IE 10 <a href="http://msdn.microsoft.com/en-US/library/ie/hh673560.aspx">verzichtet</a> auch bereits auf Vendor-Prefixes hierfür.</dd>
<dt><a href="https://www.secmaniac.com/blog/2012/06/11/massive-mysql-authentication-bypass-exploit/">MySQL Root Exploit</a></dt>
<dd>In manche MySQL-Versionen kann man sich mit beliebigen Passwörtern einloggen.</dd>
</dl>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:01:19] JSON vs. MessagePack vs. JSON5</dt>
<dd>Mit <a href="http://msgpack.org/">MessagePack</a>, einer binären Abwandlung des JSON-Formats, <a href="http://indiegamr.com/cut-your-data-exchange-traffic-by-up-to-50-with-one-line-of-code-msgpack-vs-json/">meint jemand</a> seinen Traffic halbieren zu können. Uns kommt das wie Blödsinn vor und wir sehen auch nicht so wirklich viel Potenzial für MessagePack in der Webentwicklung. Auch der Autor von MessagePack <a href="https://gist.github.com/2908191">geht d‘accord</a>. Besser finden wir da schon <a href="https://github.com/aseemk/json5">JSON5</a>, eine ECMAScript5-konforme Erweiterung von JSON, die etwas weniger strikt ist&nbsp;&ndash; eine gute Idee für Konfigurationsdateien.</dd>
</dl>
<h3>[00:11:02] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://weblog.bocoup.com/third-party-javascript-development-future/">Third-Party JavaScript Development: The Future!</a></dt>
<dd>Bocoup spekuliert über die Mittel der Zukunft für Third-Party-JS.</dd>
<dt><a href="http://hpneo.github.com/gmaps/examples.html">gmaps.js</a></dt>
<dd>Wrapper für die Google Maps-API, der alles sehr sehr sehr viel bequemer macht.</dd>
<dt><a href="http://ryanseddon.github.com/bunyip/">Bunyip</a></dt>
<dd>Automatisches, paralleles Client-Side-Unittesting in beliebigen Browsern.</dd>
<dt><a href="http://www.2ality.com/2012/06/for-of-ff13.html">Trying out ECMAScript.next’s for&#8230;of loop in Firefox 13</a></dt>
<dd>Axel Rauschmayer über Iteratoren im kommenden ECMAScript-Standard.</dd>
</dl>


Eine Kombination aus Sommerloch, EM, WWDC und Schepps Urlaub sorgt erneut für
Magerkost bei den Themen. Kann man nichts machen! Dafür führen wir mit den News
einen neuen Sendungsbestandteil ein, bei d…

Eine Kombination aus Sommerloch, EM, WWDC und Schepps Urlaub sorgt erneut für
Magerkost bei den Themen. Kann man nichts machen! Dafür führen wir mit den News
einen neuen Sendungsbestandteil ein, bei dem es in Zukunft (?) immer ein paar
kurze Update-Durchsagen geben soll.


[00:00:11] NEWS

TRANSITIONS, TRANSFORMS AND ANIMATIONS MAY BE RELEASED UNPREFIXED

Die CSS Working Group erklärt Transitions, Transforms und Animationen für
praktisch fertig und der IE 10 verzichtet auch bereits auf Vendor-Prefixes
hierfür.

MYSQL ROOT EXPLOIT

In manche MySQL-Versionen kann man sich mit beliebigen Passwörtern einloggen.


SCHAUNOTIZEN

[00:01:19] JSON VS. MESSAGEPACK VS. JSON5

Mit MessagePack, einer binären Abwandlung des JSON-Formats, meint jemand seinen
Traffic halbieren zu können. Uns kommt das wie Blödsinn vor und wir sehen auch
nicht so wirklich viel Potenzial für MessagePack in der Webentwicklung. Auch der
Autor von MessagePack geht d‘accord. Besser finden wir da schon JSON5, eine
ECMAScript5-konforme Erweiterung von JSON, die etwas weniger strikt ist – eine
gute Idee für Konfigurationsdateien.


[00:11:02] KEINE SCHAUNOTIZEN

THIRD-PARTY JAVASCRIPT DEVELOPMENT: THE FUTURE!

Bocoup spekuliert über die Mittel der Zukunft für Third-Party-JS.

GMAPS.JS

Wrapper für die Google Maps-API, der alles sehr sehr sehr viel bequemer macht.

BUNYIP

Automatisches, paralleles Client-Side-Unittesting in beliebigen Browsern.

TRYING OUT ECMASCRIPT.NEXT’S FOR…OF LOOP IN FIREFOX 13

Axel Rauschmayer über Iteratoren im kommenden ECMAScript-Standard.

Revision 75: News, Links und die diesmal wirklich kürzeste Revision aller Zeiten

<p>Schepp war im Urlaub, Kahlil verhindert und die Themenliste war leer. Also besprachen Hans und Peter diesmal eben nur ein einziges Thema.</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:01:02] <a href="http://informationarchitects.net/blog/sweep-the-sleaze/">Sweep the Sleaze</a></dt>
<dd>Oliver Reichenstein meint, dass der Nutzen von Social-Media-Buttons (Facebook, Twitter usw.) zweifelhaft, der bei ihrem Einsatz entstehende Schaden für Image und Seitenperformance hingegen ziemlich sicher sei. Peter mag nicht ganz zustimmen und meint: wenn man es richtig macht, stören die Dinger zumindest nicht.</dd>
</dl>
<h3>[00:18:03] Keine Schaunotizen</h3>
<dl>
<dt><a href="https://github.com/fawek/codepainter">Code Painter</a></dt>
<dd><q lang="en">Code Painter is a JavaScript beautifier that instead of asking you to manually specify the desired formatting style, can infer it from a code sample provided by you.</q></dd>
<dt><a href="http://www.youtube.com/view_play_list?p=PL75AC4484E6866741">Videos von Fluent 2012</a></dt>
<dd>Kurzweilige Vorträge von Nerds mit Kaliber.</dd>
<dt><a href="http://blog.rodneyrehm.de/archives/14-Sorting-Were-Doing-It-Wrong.html">Sorting &#8211; We&#8217;re Doing It Wrong</a></dt>
<dd>Rodney Rehm steigt aber mal so richtig tief in das Thema „sortieren in JavaScript ein“.</dd>
</dl>


Schepp war im Urlaub, Kahlil verhindert und die Themenliste war leer. Also
besprachen Hans und Peter diesmal eben nur ein einziges Thema.


SCHAUNOTIZEN

[00:01:02] SWEEP THE SLEAZE

Oliver Reichenste…

Schepp war im Urlaub, Kahlil verhindert und die Themenliste war leer. Also
besprachen Hans und Peter diesmal eben nur ein einziges Thema.


SCHAUNOTIZEN

[00:01:02] SWEEP THE SLEAZE

Oliver Reichenstein meint, dass der Nutzen von Social-Media-Buttons (Facebook,
Twitter usw.) zweifelhaft, der bei ihrem Einsatz entstehende Schaden für Image
und Seitenperformance hingegen ziemlich sicher sei. Peter mag nicht ganz
zustimmen und meint: wenn man es richtig macht, stören die Dinger zumindest
nicht.


[00:18:03] KEINE SCHAUNOTIZEN

CODE PAINTER

Code Painter is a JavaScript beautifier that instead of asking you to manually
specify the desired formatting style, can infer it from a code sample provided
by you.

VIDEOS VON FLUENT 2012

Kurzweilige Vorträge von Nerds mit Kaliber.

SORTING – WE’RE DOING IT WRONG

Rodney Rehm steigt aber mal so richtig tief in das Thema „sortieren in
JavaScript ein“.

Revision 74: Social-Media-Buttons, Links und die kürzeste Revision aller Zeiten

<p>Zu Gast war diese Woche <a href="http://anselm-hannemann.com/">Anselm Hannemann</a>, den wir mit seinem Fachwissen gerne <a href="http://workingdraft.de/36/">wieder eingeladen</a> haben. Außerdem waren der Schepp und Hans mit von der Partie.</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:00:00] <a href="http://dvcs.w3.org/hg/quota/raw-file/tip/Overview.html">Quota Management API</a></dt>
<dd>Wenn man mit client-seitigem Speicher experimentiert (localStorage, IndexedDB, File API) ist es schwierig abzuschätzen, wann der Speicher eines Geräts erschöpft ist. Dafür gibt es die neue Quota Management API, die genau dieses Problem lösen soll.</dd>
<dt>[00:00:00] <a href="http://adobe.github.com/web-platform/demos/compositing/">CSS Compositing &#038; Blending</a></dt>
<dd>Adobe veröffentlicht die neusten Spielereien, die sie sich ausgedacht haben. Dazu gehören das Composing und das Blending, die aus Photoshop, Illustrator und anderer Adobe Software bekannt sind. Für <a href="http://dev.w3.org/SVG/modules/compositing/publish/">SVG gibt es diese Effekte bereits</a>, nun also auch für CSS. Wir finden diese Entwicklungen super; nach Flash erkennt Adobe worauf es im Web ankommt!</dd>
<dt>[00:00:00] <a href="http://louisremi.com/2011/12/06/cors-an-insufficient-solution-for-same-origin-restrictions/">CORS: Louis Rémi reicht&#8217;s nicht</a></dt>
<dd>Möchte man asynchron Abfragen zwischen verschiedenen Domains absetzten, ist man aktuell ziemlich beschränkt. Dieses Problem soll durch <a href="http://www.w3.org/TR/cors/">CORS</a> gelöst werden. Louis Rémi ist allerdings der Meinung, dass das nicht reicht, da Dienste wie Twitter oder Facebook ihre Schnittstellen noch nicht CORS-ready zur Verfügung stellen. Der Artikel erschien bereits Ende letzen Jahres.</dd>
<dt>[00:00:00] <a href="http://www.peterkroener.de/die-responsive-images-story/">Die Responsive Images Story</a></dt>
<dd><a href="https://twitter.com/#!/anselmhannemann">Anselm</a> berichtet über die aktuelle Lage der Responsive Images. Von seinem <a href="http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2011-August/032977.html">ersten Vorschlag auf der Mailinglist</a>, über die Entstehung der <a href="http://www.w3.org/community/respimg/">W3C Community Group</a>, bis hin zu den <a href="http://www.alistapart.com/articles/responsive-images-and-web-standards-at-the-turning-point/">jüngsten Kontroversen</a> gibt Anselm eine gute Übersicht. Wir sprechen außerdem drüber, was unsere Vorstellungen von Responsive Images sind und wie die W3C und die WHATWG ihre Arbeit machen.</dd>
<dt>[00:00:00] <a href="http://getkirby.com/blog/smashingconf">Über die Smashing Conference</a></dt>
<dd>Die <a href="http://smashingconf.com/">Smashing Conference</a> wird zum ersten mal in Freiburg abgehalten. Bastian Allgeier hat die Website für die Konferenz mit seinem file-basierten <a href="http://getkirby.com/">CMS Kirby</a> gebaut und beschreibt wie. Wir sind große Fans von Kirby und unterstützen auch die Smashing Conference gerne. Wer mehr Infos zu Freiburg möchte, schreibt <a href="mailto:info@drublic.de">Hans</a> gerne eine Mail.</dd>
</dl>
<h3>[00:00:00] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://www.youtube.com/watch?v=xirIHMtpc4c&#038;feature=youtu.be">Adobe Brackets: An Introduction</a></dt>
<dd>Eine Einführung in Adobes Open Source Code Editor, der für Front-end Entwickler gemacht wird. Das Projekt ist <a href="https://github.com/adobe/brackets">auf GitHub</a> und in HTML, CSS und JavaScript programmiert.</dd>
<dt><a href="http://magazin.numboo.de/03/deckblatt/">NUMBOO Magazin</a></dt>
<dd>Das NUMBOO Magazin ist ein deutsches Magazin für Webdesign und Webentwicklung mit einigen interessanten Themen.</dd>
<dt><a href="http://www.andismith.com/blog/2012/05/css3-flexbox-carousel/">CSS Flexbox Carousel</a></dt>
<dd>Andi Smith zeigt, wie man ein Carousel mit Flexbox bauen kann.</dd>
<dt><a href="http://javascriptsql.sourceforge.net/ARCH/en/index.html">JavaScriptSQL</a></dt>
<dd>Eine Datenbank-Engine komplett in JavaScript geschrieben.</dd>
<dt><a href="http://remysharp.com/2012/05/24/issues-with-position-fixed-scrolling-on-ios/">Über fixe Positionierung und scrollen in iOS</a></dt>
<dd>Remy Sharp geht auf die Probleme mit fix positionierten Elementen im zusammenwirken mit dem Scrollen auf iOS-Geräten ein und beschriebt die besten Lösungswege.</dd>
</dl>


Zu Gast war diese Woche Anselm Hannemann, den wir mit seinem Fachwissen gerne
wieder eingeladen haben. Außerdem waren der Schepp und Hans mit von der Partie.


SCHAUNOTIZEN

[00:00:00] QUOTA MANAGEMEN…

Zu Gast war diese Woche Anselm Hannemann, den wir mit seinem Fachwissen gerne
wieder eingeladen haben. Außerdem waren der Schepp und Hans mit von der Partie.


SCHAUNOTIZEN

[00:00:00] QUOTA MANAGEMENT API

Wenn man mit client-seitigem Speicher experimentiert (localStorage, IndexedDB,
File API) ist es schwierig abzuschätzen, wann der Speicher eines Geräts
erschöpft ist. Dafür gibt es die neue Quota Management API, die genau dieses
Problem lösen soll.

[00:00:00] CSS COMPOSITING & BLENDING

Adobe veröffentlicht die neusten Spielereien, die sie sich ausgedacht haben.
Dazu gehören das Composing und das Blending, die aus Photoshop, Illustrator und
anderer Adobe Software bekannt sind. Für SVG gibt es diese Effekte bereits, nun
also auch für CSS. Wir finden diese Entwicklungen super; nach Flash erkennt
Adobe worauf es im Web ankommt!

[00:00:00] CORS: LOUIS RÉMI REICHT’S NICHT

Möchte man asynchron Abfragen zwischen verschiedenen Domains absetzten, ist man
aktuell ziemlich beschränkt. Dieses Problem soll durch CORS gelöst werden. Louis
Rémi ist allerdings der Meinung, dass das nicht reicht, da Dienste wie Twitter
oder Facebook ihre Schnittstellen noch nicht CORS-ready zur Verfügung stellen.
Der Artikel erschien bereits Ende letzen Jahres.

[00:00:00] DIE RESPONSIVE IMAGES STORY

Anselm berichtet über die aktuelle Lage der Responsive Images. Von seinem ersten
Vorschlag auf der Mailinglist, über die Entstehung der W3C Community Group, bis
hin zu den jüngsten Kontroversen gibt Anselm eine gute Übersicht. Wir sprechen
außerdem drüber, was unsere Vorstellungen von Responsive Images sind und wie die
W3C und die WHATWG ihre Arbeit machen.

[00:00:00] ÜBER DIE SMASHING CONFERENCE

Die Smashing Conference wird zum ersten mal in Freiburg abgehalten. Bastian
Allgeier hat die Website für die Konferenz mit seinem file-basierten CMS Kirby
gebaut und beschreibt wie. Wir sind große Fans von Kirby und unterstützen auch
die Smashing Conference gerne. Wer mehr Infos zu Freiburg möchte, schreibt Hans
gerne eine Mail.


[00:00:00] KEINE SCHAUNOTIZEN

ADOBE BRACKETS: AN INTRODUCTION

Eine Einführung in Adobes Open Source Code Editor, der für Front-end Entwickler
gemacht wird. Das Projekt ist auf GitHub und in HTML, CSS und JavaScript
programmiert.

NUMBOO MAGAZIN

Das NUMBOO Magazin ist ein deutsches Magazin für Webdesign und Webentwicklung
mit einigen interessanten Themen.

CSS FLEXBOX CAROUSEL

Andi Smith zeigt, wie man ein Carousel mit Flexbox bauen kann.

JAVASCRIPTSQL

Eine Datenbank-Engine komplett in JavaScript geschrieben.

ÜBER FIXE POSITIONIERUNG UND SCROLLEN IN IOS

Remy Sharp geht auf die Probleme mit fix positionierten Elementen im
zusammenwirken mit dem Scrollen auf iOS-Geräten ein und beschriebt die besten
Lösungswege.

Revision 73: Von CSS Blenden, Cross-Domain-Requests und responsiven Bildern

<p>Die Stammbesatzung trat an und brauchte zum Sortieren der Themen länger als für die Aufnahme. Trotzdem ist noch einiges an Material übrig geblieben.</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:00:22] <a href="http://css-tricks.com/sass-vs-less/">SASS versus LESS</a></dt>
<dd>Chris Coyier vergleicht SASS mit LESS und kürt ersteres zum Gewinner. Für rechten Widerspruch reicht es bei uns nicht, da wir SASS in Kombination mit <a href="http://compass-style.org/">Compass</a> und <a href="https://incident57.com/codekit/">CodeKit</a> auch nicht so ganz schlecht finden. Die etwas nerdigere Fraktion findet aber auch die Kombination <a href="http://learnboost.github.com/stylus/">Stylus</a> + <a href="https://github.com/visionmedia/nib">Nib</a> + <a href="https://github.com/cowboy/grunt">Grunt</a> ganz gut. Naja, jeder wie er will :)</dd>
<dt>[00:22:00] <a href="http://dev.w3.org/csswg/css4-mediaqueries/">Media Queries Level 4</a></dt>
<dd>CSS4 ist im Anmarsch und die neuen Media Queries führen neben einem Script-Detektor auch ein Feature ein, mit dem man herausfinden kann, ob ein Gerät so etwas wie ein „Mousover“ (d.h. die Hover-Pseudoklasse) überhaupt leisten kann. Ob ein Gerät einen Tochscreen hat, kann man zwar schon mit <a href="https://developer.mozilla.org/en/CSS/Media_queries#-moz-touch-enabled">proprietären Mitteln</a> herausfinden, aber <a href="http://blog.gsmarena.com/sony-xperia-sola-official-video-ad-demonstrates-the-hover-touch/">ein Touchscreen muss Mouseover-Funktionalität ja nicht zwingend ausschließen</a>.</dd>
<dt>[00:27:57] <a href="http://swapped.tumblr.com/post/23133779276/google-bot-now-crawls-arbitrary-javascript-sites">Google Bot now crawls arbitrary Javascript sites</a></dt>
<dd>Wir sind uns überhaupt nicht einig, ob das nicht schon alter Käse ist und ob man aus dieser Entdeckung irgend etwas für die tägliche Arbeit ableiten sollte. Was meint ihr?</dd>
<dt>[00:41:20] <a href="https://plus.google.com/115133653231679625609/posts/Dk5UhZ6zfF3">Google Chrome Canary: webkitdirectory attribute walkthrough</a></dt>
<dd>Addy Osmani erklärt, wie man aus der <a href="http://www.w3.org/TR/FileAPI/">HTML5 File API</a>, einem neuen HTML-Attribut und etwas Trickserei etwas backen kann, dass Drag &amp; Drop von ganzen Verzeichnissen in Webapps ermöglicht.</dd>
</dl>
<h3>[00:47:55] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://angryamoeba.co.uk/spahql-announce/">SpahQL</a></dt>
<dd>Query-Sprache für komplexe JavaScript-Objekte.</dd>
<dt><a href="http://net.tutsplus.com/tutorials/javascript-ajax/meet-crockford%E2%80%99s-jscheck/">JSCheck-Tutorial</a></dt>
<dd>Einführung in <a href="http://www.jscheck.org/">ein neues Test-Framework</a> von Douglas Crockford, das mit Zufalls-Inputs arbeitet.</dd>
<dt><a href="http://www.zurb.com/article/982/a-new-take-on-responsive-tables">Responsive Tables</a></dt>
<dd>Ein Ansatz für Responsive Tabellen.</dd>
<dt><a href="http://tomdale.net/2012/05/ember-routing/">Our Approach to Routing in Ember.js</a></dt>
<dd>Man kann es so oder so machen. <a href="http://emberjs.com/">Ember.js</a> macht es so.</dd>
<dt><a href="http://xing.github.com/wysihtml5/">wysihtml5 &#8211; A better approach to rich text editing</a></dt>
<dd>Qualität aus dem Hause Xing.</dd>
<dt><a href="http://www.smashingmagazine.com/2012/05/21/how-to-choose-the-right-face-for-a-beautiful-body/">How To Choose The Right Face For A Beautiful Body</a></dt>
<dd>Typoraphie-Tutorial.</dd>
<dt><a href="https://github.com/blog/1127-github-for-windows">GitHub for Windows</a></dt>
<dd>Nach dem Github-Client für Mac gibt es nun auch einen für Windows.</dd>
</dl>


Die Stammbesatzung trat an und brauchte zum Sortieren der Themen länger als für
die Aufnahme. Trotzdem ist noch einiges an Material übrig geblieben.


SCHAUNOTIZEN

[00:00:22] SASS VERSUS LESS

Chris …

Die Stammbesatzung trat an und brauchte zum Sortieren der Themen länger als für
die Aufnahme. Trotzdem ist noch einiges an Material übrig geblieben.


SCHAUNOTIZEN

[00:00:22] SASS VERSUS LESS

Chris Coyier vergleicht SASS mit LESS und kürt ersteres zum Gewinner. Für
rechten Widerspruch reicht es bei uns nicht, da wir SASS in Kombination mit
Compass und CodeKit auch nicht so ganz schlecht finden. Die etwas nerdigere
Fraktion findet aber auch die Kombination Stylus + Nib + Grunt ganz gut. Naja,
jeder wie er will :)

[00:22:00] MEDIA QUERIES LEVEL 4

CSS4 ist im Anmarsch und die neuen Media Queries führen neben einem
Script-Detektor auch ein Feature ein, mit dem man herausfinden kann, ob ein
Gerät so etwas wie ein „Mousover“ (d.h. die Hover-Pseudoklasse) überhaupt
leisten kann. Ob ein Gerät einen Tochscreen hat, kann man zwar schon mit
proprietären Mitteln herausfinden, aber ein Touchscreen muss
Mouseover-Funktionalität ja nicht zwingend ausschließen.

[00:27:57] GOOGLE BOT NOW CRAWLS ARBITRARY JAVASCRIPT SITES

Wir sind uns überhaupt nicht einig, ob das nicht schon alter Käse ist und ob man
aus dieser Entdeckung irgend etwas für die tägliche Arbeit ableiten sollte. Was
meint ihr?

[00:41:20] GOOGLE CHROME CANARY: WEBKITDIRECTORY ATTRIBUTE WALKTHROUGH

Addy Osmani erklärt, wie man aus der HTML5 File API, einem neuen HTML-Attribut
und etwas Trickserei etwas backen kann, dass Drag & Drop von ganzen
Verzeichnissen in Webapps ermöglicht.


[00:47:55] KEINE SCHAUNOTIZEN

SPAHQL

Query-Sprache für komplexe JavaScript-Objekte.

JSCHECK-TUTORIAL

Einführung in ein neues Test-Framework von Douglas Crockford, das mit
Zufalls-Inputs arbeitet.

RESPONSIVE TABLES

Ein Ansatz für Responsive Tabellen.

OUR APPROACH TO ROUTING IN EMBER.JS

Man kann es so oder so machen. Ember.js macht es so.

WYSIHTML5 – A BETTER APPROACH TO RICH TEXT EDITING

Qualität aus dem Hause Xing.

HOW TO CHOOSE THE RIGHT FACE FOR A BEAUTIFUL BODY

Typoraphie-Tutorial.

GITHUB FOR WINDOWS

Nach dem Github-Client für Mac gibt es nun auch einen für Windows.

Revision 72: SASS vs. LESS & Googlebot vs. JavaScript

<p>Zur aktuellen Sendung fanden sich der Schepp, Kahlil und Hans ein, um wie gewohnt die wichtigsten Neuerungen und Entdeckungen der Woche zu besprechen.</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:00:30] <a href="http://blogs.msdn.com/b/ie/archive/2012/05/10/diagnosing-javascript-errors-faster-with-error-stack.aspx">JavaScript-Fehler schneller Analysieren mit Error.stack</a></dt>
<dd>Das Internet Explorer Team vom Microsoft erläutert, wie man mit dem neuen <code>Error</code>-Objekt in JavaScript leichter debuggen kann. Viel besser als zum Beispiel mit <code>console.log()</code> kann man mit <code>Error.stack</code> eine komplette Stack-Trace des Fehlers bekommen, den man abgefangen hat. Ziemlich gut!</dd>
<dt>[00:08:23] <a href="http://www.iamntz.com/3157/frontend-developer/css-keyframe-based-events/">CSS keyframe based JavaScript events</a></dt>
<dd>Da JavaScript-Events für CSS Keyframe-Animationen irgendwie noch nicht so ausgereift sind, hat sich Ionuţ Staicu darüber Gedanken gemacht, wie man dem Zeit aktuellen Fortschritt einer Animation mit einem Event beschreiben kann. Mithilfe von <code>requestAnimationFrame</code> findet er eine Lösung. Wir grübeln allerdings noch über den exakten Einsatzbereich.</dd>
<dt>[00:15:54] <a href="http://smus.com/physical-units/">Let&#8217;s Get Physical (Units)</a></dt>
<dd>Die aktuellen CSS-Einheiten wie <code>em</code>, <code>px</code> und <code>%</code> findet Boris Smus nicht ausreichend, um Styles für die verschiedenen Geräte der Gegenwart (Smartphones, Desktops, TVs…) zu schreiben. Deshalb plädiert er dafür eine tatsächliche physikalische Einheit einzuführen, die auch richtig funktioniert. Nicht so wie das im Moment mit <code>mm</code>, <code>in</code> und so weiter ist.</dd>
<dt>[00:31:09] <a href="#">Hitch &#8211; Stärke Aussagekraft durch besseres CSS ist die Devise</a></dt>
<dd>Hitch ist eine JavaScript Library, die als “Postprocessor” agiert und das angegebene CSS um Pseudoklassen wie <code>:has</code> erweitert. Damit bekommen Stylesheets ungeahnte Funktionen, die man vielleicht gar nicht braucht.</dd>
<dt>[00:42:46] <a href="http://hacks.mozilla.org/2012/05/dom-mutationobserver-reacting-to-dom-changes-without-killing-browser-performance/">DOM MutationObserver – Auf DOM-Änderungen reagieren ohne die Performance zu killen</a></dt>
<dd>Als Weiterentwicklung der Mutation Events sind die MutationObserver nun auch im Firefox gelandet. Wir sprechen darüber, wozu diese nützlich sein können und wie man sie aktuell einsetzen kann.</dd>
</dl>
<h3>[00:55:15] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://paulirish.com/2012/talk-tooling-the-webapp-development-stack/">Tooling &#038; The Webapp Development Stack</a></dt>
<dd>Auf der jQueryConf präsentierte Paul Irish, welche Tools wir als Web-devs zur Zeit zur Verfügung haben. Gute Zusammenstellung.</dd>
<dt><a href="http://www.alistapart.com/articles/application-cache-is-a-douchebag/">Application Cache is a Douchebag</a></dt>
<dd>Wie man mit dem Applikation fertig werden kann oder eben auch nicht, beschreibt Jake Archibald in seinem ALA-Artikel.</dd>
<dt><a href="http://html5doctor.com/html5-audio-the-state-of-play/">HTML5 Audio — The State of Play</a></dt>
<dd>Von der HTML5 Audio API hat man schon länger nichts mehr gehört. Hier der aktuelle Stand.</dd>
<dt><a href="http://radar.oreilly.com/2012/05/velocity-performance-makeover.html">Giving the Velocity website a performance makeover</a></dt>
<dd>Case Study zum Thema Performance Optimierung anhand der Website der Velocity-Konferenz.</dd>
<dt><a href="http://www.thetoolbox.cc/">The Toolbox</a></dt>
<dd>Eine Sammlung an hilfreichen Apps und Tools aus dem Bereich der Webentwicklung, die man so gerne wieder vergisst.</dd>
<dt><a href="http://jqvmap.com/">jQuery Vector Maps</a></dt>
<dd>SVG-basierte Karten als jQuery Plugin.</dd>
<dt><a href="http://cssarrowplease.com/">cssarrowplease</a></dt>
<dd>Kleine Pfeile mit CSS Pseudo-Elementen kreieren und den Code dazu kopieren!</dd>
<dt><a href="http://anthonyterrien.com/knob/">jQuery Knob</a></dt>
<dd>Interessantes jQuery Plugin, das Rädchen erzeugt, die aussehen, wie ein Volume-Wheel und dazu noch super für Touch-Devices geeignet sind.</dd>
<dt><a href="https://github.com/bshack/jQuery.ish">jQuery.ish</a></dt>
<dd>jQuery.ish ist eine Micro-JS-Library, die ein paar wenige jQuery-Funktionen beinhaltet. Genau richtig in manchen Fällen.</dd>
<dt><a href="http://www.youtube.com/watch?feature=player_embedded&#038;v=-G3RoBHMu-o">How To Survive A Robot Uprising</a></dt>
<dd>Wichtiger “Lehrfilm”, wie man einen Angriff von Robotern auf die Menschheit überlebt. Aufgrund der aktuellen Lage, bitte dringend ansehen!</dd>
</dl>


Zur aktuellen Sendung fanden sich der Schepp, Kahlil und Hans ein, um wie
gewohnt die wichtigsten Neuerungen und Entdeckungen der Woche zu besprechen.


SCHAUNOTIZEN

[00:00:30] JAVASCRIPT-FEHLER SCHN…

Zur aktuellen Sendung fanden sich der Schepp, Kahlil und Hans ein, um wie
gewohnt die wichtigsten Neuerungen und Entdeckungen der Woche zu besprechen.


SCHAUNOTIZEN

[00:00:30] JAVASCRIPT-FEHLER SCHNELLER ANALYSIEREN MIT ERROR.STACK

Das Internet Explorer Team vom Microsoft erläutert, wie man mit dem neuen
Error-Objekt in JavaScript leichter debuggen kann. Viel besser als zum Beispiel
mit console.log() kann man mit Error.stack eine komplette Stack-Trace des
Fehlers bekommen, den man abgefangen hat. Ziemlich gut!

[00:08:23] CSS KEYFRAME BASED JAVASCRIPT EVENTS

Da JavaScript-Events für CSS Keyframe-Animationen irgendwie noch nicht so
ausgereift sind, hat sich Ionuţ Staicu darüber Gedanken gemacht, wie man dem
Zeit aktuellen Fortschritt einer Animation mit einem Event beschreiben kann.
Mithilfe von requestAnimationFrame findet er eine Lösung. Wir grübeln allerdings
noch über den exakten Einsatzbereich.

[00:15:54] LET’S GET PHYSICAL (UNITS)

Die aktuellen CSS-Einheiten wie em, px und % findet Boris Smus nicht
ausreichend, um Styles für die verschiedenen Geräte der Gegenwart (Smartphones,
Desktops, TVs…) zu schreiben. Deshalb plädiert er dafür eine tatsächliche
physikalische Einheit einzuführen, die auch richtig funktioniert. Nicht so wie
das im Moment mit mm, in und so weiter ist.

[00:31:09] HITCH – STÄRKE AUSSAGEKRAFT DURCH BESSERES CSS IST DIE DEVISE

Hitch ist eine JavaScript Library, die als “Postprocessor” agiert und das
angegebene CSS um Pseudoklassen wie :has erweitert. Damit bekommen Stylesheets
ungeahnte Funktionen, die man vielleicht gar nicht braucht.

[00:42:46] DOM MUTATIONOBSERVER – AUF DOM-ÄNDERUNGEN REAGIEREN OHNE DIE
PERFORMANCE ZU KILLEN

Als Weiterentwicklung der Mutation Events sind die MutationObserver nun auch im
Firefox gelandet. Wir sprechen darüber, wozu diese nützlich sein können und wie
man sie aktuell einsetzen kann.


[00:55:15] KEINE SCHAUNOTIZEN

TOOLING & THE WEBAPP DEVELOPMENT STACK

Auf der jQueryConf präsentierte Paul Irish, welche Tools wir als Web-devs zur
Zeit zur Verfügung haben. Gute Zusammenstellung.

APPLICATION CACHE IS A DOUCHEBAG

Wie man mit dem Applikation fertig werden kann oder eben auch nicht, beschreibt
Jake Archibald in seinem ALA-Artikel.

HTML5 AUDIO — THE STATE OF PLAY

Von der HTML5 Audio API hat man schon länger nichts mehr gehört. Hier der
aktuelle Stand.

GIVING THE VELOCITY WEBSITE A PERFORMANCE MAKEOVER

Case Study zum Thema Performance Optimierung anhand der Website der
Velocity-Konferenz.

THE TOOLBOX

Eine Sammlung an hilfreichen Apps und Tools aus dem Bereich der Webentwicklung,
die man so gerne wieder vergisst.

JQUERY VECTOR MAPS

SVG-basierte Karten als jQuery Plugin.

CSSARROWPLEASE

Kleine Pfeile mit CSS Pseudo-Elementen kreieren und den Code dazu kopieren!

JQUERY KNOB

Interessantes jQuery Plugin, das Rädchen erzeugt, die aussehen, wie ein
Volume-Wheel und dazu noch super für Touch-Devices geeignet sind.

JQUERY.ISH

jQuery.ish ist eine Micro-JS-Library, die ein paar wenige jQuery-Funktionen
beinhaltet. Genau richtig in manchen Fällen.

HOW TO SURVIVE A ROBOT UPRISING

Wichtiger “Lehrfilm”, wie man einen Angriff von Robotern auf die Menschheit
überlebt. Aufgrund der aktuellen Lage, bitte dringend ansehen!

Revision 71: Error.stack, Physical Units & DOM Mutation Observers

<p>Als Gast war diesmal wieder <a href="http://frederic-hemberger.de/">Frederic Hemberger</a> am Start, der uns immer gerne mit seinem Fachwissen zur Seite steht.</p>
<p>Wir möchten auch noch einmal auf unseren <a href="http://www.livestream.com/workingdraft">Live-Stream</a> und den <a href="http://webchat.freenode.net/?channels=workingdraft">IRC-Chat auf Freenode im Channel #workingdraft</a> hinweisen. Wir sind immer montags ab 20 Uhr live, wenn nicht anders angekündigt. Die neusten Infos gibt&#8217;s immer auf <a href="https://twitter.com/#!/workingdraft">Twitter</a> und bei <a href="https://plus.google.com/100063817839650840647/posts">Google+</a>.</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:00:18] <a href="http://addyosmani.com/blog/javascript-style-guides-and-beautifiers/">JavaScript Styleguides</a></dt>
<dd>Addy Osmani befasst sich mit Programmierrichtlinien in JavaScript. Er führt dabei <a href="https://github.com/rwldrn/idiomatic.js/">idiomatic.js</a>, den <a href="http://docs.jquery.com/JQuery_Core_Style_Guidelines">jQuery Core Style Guide</a> und viele weitere Best Practices an, die wir diskutieren. Hans hat über seine persönlichen Richtlinien in HTML und CSS <a href="http://drublic.de/blog/my-coding-style-and-guidelines/">einen Post geschrieben</a>.<br />
Außerdem sprechen wir über Ben “Cowboy” Almans <a href="http://benalman.com/news/2012/05/multiple-var-statements-javascript/">Blogpost</a> zum Thema <code>var</code>-Deklarationen.
</dd>
<dt>[00:19:00] <a href="http://www.oliveira-online.net/wordpress/index.php/2012/05/01/barrierefreiheit-und-die-beschwerdekultur-im-internet/">Barrierefreiheit und die Beschwerdekultur im Internet</a></dt>
<dd>Domingos de Oliveira findet es schade, dass Accessibility-Experten sich aufregen, wenn Webseiten nicht perfekt zugänglich sind; sie sollten lieber mal die Dinge loben, die überhaupt gemacht werden. Marco Zehe gibt <a href="https://www.youtube.com/watch?v=QBcV00ZLYDA">mit seinem MMT Talk</a> einen guten Einblick, was es für Sehbehinderte Menschen bedeutet, Barrierefreiheit zu genießen.</dd>
<dt>[00:35:20] <a href="http://www.addthis.com/blog/2012/05/01/a-step-for-open-sharing-addthis-integrates-web-intents/">A Step for Open Sharing: AddThis Integrates Web Intents </a></dt>
<dd>Zum Thema Web Intents: Was ist <a href="http://webintents.org/">das eigentlich</a>? Und nutzt das jemand?<br />
AddThis integriert Web Intents mit Fallback und schreibt darüber. Sieht vielversprechend aus!</dd>
</dl>
<h3>[00:44:28] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://www.youtube.com/watch?v=jZeiZIAjlAk">Videos vom MMT29</a></dt>
<dd>So langsam gehen die Videos vom MMT 29 in Köln online. Hier findet ihr zum beispiel Peters.</dd>
<dt><a href="http://platform.html5.org/">The Web Platform: Browser Technologies</a></dt>
<dd>Schöne Übersicht über die einzelen Specs, Caniuse/MDN-Links, etc.</dd>
<dt><a href="https://github.com/blog/1125-new-git-homepage">Die neue Git-Homepage</a></dt>
<dd>GitHub hat eine neue Präsentationswebseite mit Dokumentation für Git erstellt.</dd>
<dt><a href="https://github.com/c4milo/node-webkit-agent">Node WebKit Agent</a></dt>
<dd>Die WebKit Developer-Tools für Node.</dd>
<dt><a href="http://coenraets.org/blog/2012/05/single-page-crud-application-with-backbone-js-and-twitter-bootstrap/">Backbone.js CRUD Application</a></dt>
<dd>Eine Single-Page <a href="http://de.wikipedia.org/wiki/CRUD">CRUD</a> Application mit Backbone.js und Twitter Bootstrap.</dd>
<dt><a href="https://plus.google.com/113127438179392830442/posts/APArpwWqew3">Bessere Performance mit element.classList</a></dt>
<dd>Mr. Paul Irish zeigt, wie man die Performance von bspw. Animationen mit <code>element.classList</code> drastisch verbessern kann.</dd>
<dt><a href="https://github.com/sindresorhus/screenfull.js">Cross-Browser Fullscreen API</a></dt>
<dd>Sindre Sorhus hat einen Wrapper für die Fullscreen API gebaut, der auf allen browsern funktioniert, die die Fullscreen API supporten.</dd>
<dt><a href="https://plus.google.com/114636678211810483111/posts/5gCXuXiWuLD">G+-Zirkelteiler mit nur JS-Menschen</a></dt>
<dd>Für alle, die noch nicht genug Leute eingekreist haben.</dd>
</dl>


Als Gast war diesmal wieder Frederic Hemberger am Start, der uns immer gerne mit
seinem Fachwissen zur Seite steht.

Wir möchten auch noch einmal auf unseren Live-Stream und den IRC-Chat auf
Freenode …

Als Gast war diesmal wieder Frederic Hemberger am Start, der uns immer gerne mit
seinem Fachwissen zur Seite steht.

Wir möchten auch noch einmal auf unseren Live-Stream und den IRC-Chat auf
Freenode im Channel #workingdraft hinweisen. Wir sind immer montags ab 20 Uhr
live, wenn nicht anders angekündigt. Die neusten Infos gibt’s immer auf Twitter
und bei Google+.


SCHAUNOTIZEN

[00:00:18] JAVASCRIPT STYLEGUIDES

Addy Osmani befasst sich mit Programmierrichtlinien in JavaScript. Er führt
dabei idiomatic.js, den jQuery Core Style Guide und viele weitere Best Practices
an, die wir diskutieren. Hans hat über seine persönlichen Richtlinien in HTML
und CSS einen Post geschrieben.
Außerdem sprechen wir über Ben “Cowboy” Almans Blogpost zum Thema
var-Deklarationen.

[00:19:00] BARRIEREFREIHEIT UND DIE BESCHWERDEKULTUR IM INTERNET

Domingos de Oliveira findet es schade, dass Accessibility-Experten sich
aufregen, wenn Webseiten nicht perfekt zugänglich sind; sie sollten lieber mal
die Dinge loben, die überhaupt gemacht werden. Marco Zehe gibt mit seinem MMT
Talk einen guten Einblick, was es für Sehbehinderte Menschen bedeutet,
Barrierefreiheit zu genießen.

[00:35:20] A STEP FOR OPEN SHARING: ADDTHIS INTEGRATES WEB INTENTS

Zum Thema Web Intents: Was ist das eigentlich? Und nutzt das jemand?
AddThis integriert Web Intents mit Fallback und schreibt darüber. Sieht
vielversprechend aus!


[00:44:28] KEINE SCHAUNOTIZEN

VIDEOS VOM MMT29

So langsam gehen die Videos vom MMT 29 in Köln online. Hier findet ihr zum
beispiel Peters.

THE WEB PLATFORM: BROWSER TECHNOLOGIES

Schöne Übersicht über die einzelen Specs, Caniuse/MDN-Links, etc.

DIE NEUE GIT-HOMEPAGE

GitHub hat eine neue Präsentationswebseite mit Dokumentation für Git erstellt.

NODE WEBKIT AGENT

Die WebKit Developer-Tools für Node.

BACKBONE.JS CRUD APPLICATION

Eine Single-Page CRUD Application mit Backbone.js und Twitter Bootstrap.

BESSERE PERFORMANCE MIT ELEMENT.CLASSLIST

Mr. Paul Irish zeigt, wie man die Performance von bspw. Animationen mit
element.classList drastisch verbessern kann.

CROSS-BROWSER FULLSCREEN API

Sindre Sorhus hat einen Wrapper für die Fullscreen API gebaut, der auf allen
browsern funktioniert, die die Fullscreen API supporten.

G+-ZIRKELTEILER MIT NUR JS-MENSCHEN

Für alle, die noch nicht genug Leute eingekreist haben.

Revision 70: JS Styleguides, Barrierefreiheit & Web Intents

<p>Drei Themen, drei Buchstaben&nbsp;&ndash; CSS! Nur die Crew war wieder zu viert am Start.</p>
<h3>Schaunotizen</h3>
<dl>
<dt>[00:00:31] <a href="http://dev.opera.com/articles/view/opera-mobile-emulator-experimental-webkit-prefix-support/">Opera implementiert -webkit-Präfixes</a></dt>
<dd>Zunächst passiert das nur im Mobile-Emulator, aber die Geist geht nicht mehr zurück in die Flasche&nbsp;&ndash; bald werden diverse Webkit-Präfixes auch in Opera funktionieren. Grund ist, dass viele Mobile-Webseiten nur auf Webkit optimiert werden, obwohl Opera in diesem Sektor <a href="http://www.opera.com/smw/2012/03/">einiges an Marktanteil hat</a>. Das Webentwickler-Universum reagiert auf diese Meldung mit <a href="http://stuffandnonsense.co.uk/blog/about/there_i_said_it">Shitstorms</a> und <a href="http://farukat.es/journal/2012/04/650-opera-confirms-webkit-prefix-usage">Mimimi</a>, doch wir sehen das eher entspannt.</dd>
<dt>[00:31:22] <a href="http://adactio.com/journal/5429/">Conditional CSS</a></dt>
<dd>Jeremy Keith erfindet einen überaus komplizierten Nachbau für <a href="https://developer.mozilla.org/en/DOM/window.matchMedia">window.matchMedia</a> und auf CSS-Tricks gibt es auch <a href="http://css-tricks.com/examples/ConditionalCSS/">eine entsprechende Demo</a>. Wozu das Ganze wenn es doch <a href="https://github.com/paulirish/matchMedia.js/">schon Polyfills gibt</a>? Ein Vorteil ist, dass man mit Conditional CSS keine Media Queries mehr in Script und Style duplizieren muss, sondern alles aus CSS heraus steuern kann.</dd>
<dt>[00:43:18] <a href="http://www.jordanm.co.uk/contentchoreography">Content Choreography in Responsive Web Design</a></dt>
<dd>Demo eines Responsive Designs, das auf normalen Bildschirmgrößen Floats und für kleine Maße <a href="http://www.w3.org/TR/css3-flexbox/">Flexbox</a> verwendet. Peter ist nicht sonderlich überzeugt davon, einfach vorauszusetzen, dass alle Geräte mit kleinen Bildschirm Flexbox (was nicht die stabilste Spezifikation ist) beherrschen und beschwört trollend die Geister von Vendor-Prefix-Gate 2.0. Schepp hingegen gefällt es.</dd>
</dl>
<h3>[00:53:03] Keine Schaunotizen</h3>
<dl>
<dt><a href="http://ericbidelman.tumblr.com/post/21649963613/idb-filesystem-js-bringing-the-html5-filesystem-api">idb.filesystem.js</a></dt>
<dd>Filesystem-API-Polyfill via Indexed DB.</dd>
<dt><a href="http://gent.ilcore.com/2012/04/optimizing-with-timeline-panel.html">Optimizing with the timeline panel</a></dt>
<dd>Wie man die Timeline in Web Inspector für Performanceforschung nutzt.</dd>
<dt><a href="http://lea.verou.me/2012/04/background-attachment-local/">CSS background-attachment: local</a></dt>
<dd>Eins von diesen eher unbekannten CSS-Features erklärt und demonstriert.</dd>
</dl>


Drei Themen, drei Buchstaben – CSS! Nur die Crew war wieder zu viert am Start.


SCHAUNOTIZEN

[00:00:31] OPERA IMPLEMENTIERT -WEBKIT-PRÄFIXES

Zunächst passiert das nur im Mobile-Emulator, aber die G…

Drei Themen, drei Buchstaben – CSS! Nur die Crew war wieder zu viert am Start.


SCHAUNOTIZEN

[00:00:31] OPERA IMPLEMENTIERT -WEBKIT-PRÄFIXES

Zunächst passiert das nur im Mobile-Emulator, aber die Geist geht nicht mehr
zurück in die Flasche – bald werden diverse Webkit-Präfixes auch in Opera
funktionieren. Grund ist, dass viele Mobile-Webseiten nur auf Webkit optimiert
werden, obwohl Opera in diesem Sektor einiges an Marktanteil hat. Das
Webentwickler-Universum reagiert auf diese Meldung mit Shitstorms und Mimimi,
doch wir sehen das eher entspannt.

[00:31:22] CONDITIONAL CSS

Jeremy Keith erfindet einen überaus komplizierten Nachbau für window.matchMedia
und auf CSS-Tricks gibt es auch eine entsprechende Demo. Wozu das Ganze wenn es
doch schon Polyfills gibt? Ein Vorteil ist, dass man mit Conditional CSS keine
Media Queries mehr in Script und Style duplizieren muss, sondern alles aus CSS
heraus steuern kann.

[00:43:18] CONTENT CHOREOGRAPHY IN RESPONSIVE WEB DESIGN

Demo eines Responsive Designs, das auf normalen Bildschirmgrößen Floats und für
kleine Maße Flexbox verwendet. Peter ist nicht sonderlich überzeugt davon,
einfach vorauszusetzen, dass alle Geräte mit kleinen Bildschirm Flexbox (was
nicht die stabilste Spezifikation ist) beherrschen und beschwört trollend die
Geister von Vendor-Prefix-Gate 2.0. Schepp hingegen gefällt es.


[00:53:03] KEINE SCHAUNOTIZEN

IDB.FILESYSTEM.JS

Filesystem-API-Polyfill via Indexed DB.

OPTIMIZING WITH THE TIMELINE PANEL

Wie man die Timeline in Web Inspector für Performanceforschung nutzt.

CSS BACKGROUND-ATTACHMENT: LOCAL

Eins von diesen eher unbekannten CSS-Features erklärt und demonstriert.

Revision 69: CSS Battle Royale – Opera <3 -webkit, Conditional CSS &
Content-Choreographie

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 80: X-Tag, Print Styles und IE-Basher bashen

Working Draft

Revision 79: File System API, Chrome Apps und ein Haufen Links

Working Draft

Revision 78: Editoren, jQuery, Yeoman, Browser

Working Draft

Revision 77: Do not Track, IHK-Petition und Web Components

Working Draft

Revision 76: Testen, Dokumentieren und Abhängigkeiten verwalten

Working Draft

Revision 75: News, Links und die diesmal wirklich kürzeste Revision aller Zeiten

Working Draft

Revision 74: Social-Media-Buttons, Links und die kürzeste Revision aller Zeiten

Working Draft

Revision 73: Von CSS Blenden, Cross-Domain-Requests und responsiven Bildern

Working Draft

Revision 72: SASS vs. LESS & Googlebot vs. JavaScript

Working Draft

Revision 71: Error.stack, Physical Units & DOM Mutation Observers

Working Draft

Revision 70: JS Styleguides, Barrierefreiheit & Web Intents

Working Draft

Revision 69: CSS Battle Royale – Opera <3 -webkit, Conditional CSS & Content-Choreographie

Working Draft