

Working Draft
Vanessa Otto, Peter Kröner, Hans Christian Reinl, Stefan Baumgartner, Christian »Schepp« Schaefer
Working Draft ist der deutschsprachige Podcast für Frontend-Entwicklung, Webdesign und UI Engineering.
Bei uns geht’s um HTML, CSS, JavaScript, Frameworks wie React, Vue und Angular, Responsive Webdesign, User-Interfaces, moderne UI-Patterns, Barrierefreiheit, Tooling, Design-Systeme, Webstandards und mehr.
Unser Team besteht aus erfahrenen Frontend-Entwickler:innen aus Deutschland und Österreich – mit Gästen aus der Praxis, die regelmäßig Einblicke in aktuelle Tech-Themen geben. Ob neue CSS-Features, die Zukunft von JavaScript, KI im Frontend-Workflow oder einfach gute UI-Erfahrungen: Wir reden drüber – jede Woche neu.
Bei uns geht’s um HTML, CSS, JavaScript, Frameworks wie React, Vue und Angular, Responsive Webdesign, User-Interfaces, moderne UI-Patterns, Barrierefreiheit, Tooling, Design-Systeme, Webstandards und mehr.
Unser Team besteht aus erfahrenen Frontend-Entwickler:innen aus Deutschland und Österreich – mit Gästen aus der Praxis, die regelmäßig Einblicke in aktuelle Tech-Themen geben. Ob neue CSS-Features, die Zukunft von JavaScript, KI im Frontend-Workflow oder einfach gute UI-Erfahrungen: Wir reden drüber – jede Woche neu.
Episodes
Mentioned books

Apr 3, 2012 • 54min
Revision 65: Infinite Transition Delays, jQuery Hooks, ECMAScript 6
Mit allen Mann an Bord ging es um die aprilscherzbedingt nicht besonders zahlreichen Themen der Woche.
Schaunotizen
[00:00:31] Maintaining CSS Style States using Infinite Transition Delays
Kreativer Gebrauch von CSS3-Selektoren und -Transitions für Funktionalität, für die man normalerweise den JavaScript-Hut aufsetzen würde. Das funktioniert zwar (hier kurz erklärt), aber ist es wirklich eine gute Idee?
[00:14:55] SVG Stacks
Wir besprechen die besseren CSS-Sprites, lobpreisen Inkscape und granteln über den SVG-Support in Browsern. Der ist zwar im Prinzip da, doch wenn es an die Einzelfeatures geht, wird es schnell unangenehm. Noch! Außerdem sprachen wir über das Kapseln von Bitmapgrafiken in SVG, wie von Dirk Weber beschrieben und über die Möglichekeit, eine background-position von unten rechts aus anzugeben (siehe Example 12).
[00:27:05] jQuery Hooks
Rodney Rehm über ein undokumentiertes, aber möglicherweise sehr nützliches jQuery-Feature. Wir empfehlen neben dem Artikel selbst die diversen Walkthroughs durch den jQuery-Source.
[00:38:34] Peters ES6-Serie
Eine Artikelserie über den neuen JavaScript-Standard ECMAScript 6 ist am entstehen und soll ausgebaut werden, sobald mehr von den neuen Features implementiert werden.
[00:51:21] Keine Schaunotizen
Timeline
Zeitleisten mit jQuery gestalten.
Intelligist
jQuery-Plugin zum Einbetten von Github Gists.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/

Apr 1, 2012 • 1h 13min
Revision 64: Source Maps, Event Capturing & beyond tellerrand – play
Zur Revision 64 haben wir uns Marc Thiele eingeladen, der zusammen mit dem Schepp, Kahlil und Hans über seine Konferenzen und seine Musik spricht. Zunächst haben wir uns aber dem Tagesgeschäft gewidmet. Hier sind die Themen:
Schaunotizen
[00:02:42] Introduction to JavaScript Source Maps
Source Maps helfen beim Debuggen von minimierten und konkatenierten JavaScripts. Sie zeigen uns Entwicklern den weg zu unserem ursprünglichen Fehler im entpackten Code. Seit einigen Tagen sind die Source Maps nun im Chrome Canary verfügbar. Support von Meta-Sprachen, wie CoffeeScript oder auch SASS ist in Planung und wird das Debuggen in Zukunft noch leichter machen.
[00:10:50] Using event capturing to improve Basecamp page load times
Normalerweise hört man in JavaScript auf Events, in dem man das Bubbeling von Events nutzt. Die smarten Jungs von Basecamp haben festgestellt, dass man viel schneller auf Nutzereingaben reagieren kann, wenn man das Capturing nutzt, welches direkt vor dem Bubbeling passiert. Der Vorteil dabei ist, dass man während des Bubbelings schon auf das im Capturing festgelegte Verhalten reagieren kann.
Die angesprochene Bibliothek von Steve Souders heisst ControlJS.
[00:18:14] About HTML semantics and front-end architecture
Nicolas Gallagher beschreibt wie er Klassen im CSS vergibt und auf was er achtet, um die Übersichtlichkeit zu wahren. Dabei beschreibt er, dass Klassen nicht unbedingt semantisch sein müssen. Seine Ausführungen spiegeln die Gedanken aus OOCSS und SMACSS wieder. In diesem Zusammenhang
[00:32:43] [css4-images] The image-set() function (for responsive images)
Monatelang diskutieren schlaue Leute darüber, wie man mit Bildern auf verschiedenen Geräten und Bildschirmgrößen umgehen soll. Sogar ein neues HTML-Element hat man sich überlegt. Apple macht nun einigen eigenen Vorschlag, wie man dieses Problem lösen kann und implementiert es gleich mal in Webkit. Aber reicht das wirklich oder brauchen wir doch noch mehr Hilfsmittel, mit denen wir die Geschwindigkeit der Internetverbindung prüfen können?
[00:43:21] beyond tellerrand – play
Mit Marc sprechen wir über die beyond tellerrand – play und die angekündigte Smashing Conf. Dabei erklärt er uns, wie es eigentlich dazu kam, dass er diese Konferenzen organisiert und wieso die beyond tellerrand so günstig ist. Für die beyond tellerrand – play sucht Marc noch ein paar Helfer. Schreibt ihm am besten einfach eine E-Mail oder haut ihn auf Twitter an.
[01:05:27] Keine Schaunotizen
Hammer.js – A javascript library for multi-touch gestures
Multi-Touch-Gesten-Erkennung leicht gemacht mit Hammer.js.
CSS Gradient Editor
Gradients wie in der Patterns Gallery selbst bauen.
Love Hotels and Unicode
Über die Weiterentwicklung des UTF-Zeichensatzes.
jSVG – An attempt to bring simple SVG Asset Management into modern browsers
Ein Packer für SVG – weniger HTTP-Requests ist das Ziel
AliceJS – A Lightweight Independent CSS Engine
Von Blackberry entwickelte JS-Library, die das Nutzen von Hardwarebeschleunigung vor allem für CSS3 erleichtern soll.
backlift
Mit Backlift Backbone.js Anwendungen entwickeln, verwalten und hosten. Deployment mit nur drei Zeilen auf der Konsole.
swagger
Swagger ist ein Dokumentationsframework für RESTful APIs.
BrowserQuest – a massively multiplayer HTML5 (WebSocket + Canvas) game experiment
Ein realtime Browsergame auf HTML5-Basis.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/

Mar 29, 2012 • 1h 21min
Revision 63: Responsiver Content, Firefox 11 und Offene Datenquellen
Hans und Peter sprechen mit Stammgast Rodney Rehm über die Neuerungen der vergangenen Woche.
Auch diese Woche hatten wir wieder einen Live-Stream am Start. Danke für alle, die zugehört und im Chat mit diskutiert haben.
Wer dieses mal noch nicht dabei war, aber nächstes mal gerne auch mitdiskutieren möchte, folgt uns am besten auf Twitter und macht sich mit IRC vertraut. Unseren Chat findet ihr auf Freenote im Channel #workingdraft.
Schaunotizen
[00:00:17] CSS: The Bad Parts
Louis Lazaris beschreibt in seinem Blog, dass CSS, ähnlich wie JavaScript, nicht nur gute Seite hat. Darunter zählen seiner Meinung nach u. a. das Standart Box Modell, Floats und Vendor Prefixes. Zum Glück gibt es für einige Sachen recht einfache Abhilfe: Beim Box Modell ist das zum Beispiel die generelle Benutzung vom Border-Box Modell, wie Paul Irish es beschreibt. Dabei kann Schepps Polyfill für alte Browser ziemlich hilfreich sein.
[00:13:14] iPad – Retina Display FTW oder WTF?
Das neue iPad (aka. iPad 3) ist da. Angesichts der großen Auflösung des iPad-Displays gibt es für uns als Entwickler ein paar Probleme: Wie liefern wir Content (zum Beispiel Bilder), der auch bei dieser Auflösung noch gut aussieht über viel zu langsame Internet-Verbindungen? Oder jammern wir hier auf einem sehr hohen Niveau?
[00:28:50] Responsive Werbung
Rob Flaherty präsentiert eine Möglichkeit, wie man Werbung mittels JavaScript auf Mobile Endgeräte anpassen kann. Rodney berichtet von seinen Erfahrungen mit Werbe-Agenturen und sieht das Problem nicht bei der Implementierung sondern viel mehr bei der Erstellung der Werbung. Mark Boulton schrieb vor einiger Zeit zu diesem Thema einen sehr interessanten Artikel.
[00:50:43] Firefox 11
Firefox 11 ist gerade frisch raus gekommen. Was gibt es neues für uns Entwickler? Zu erwähnen ist da auf jeden Fall die 3D View in den Developer-Tools. Außerdem sprechen wir über die Device APIs wie z. B. der Zugriff auf die Batterie.
[01:01:28] Open Source Data
Zum Abschluss sprechen wir über offene Datenquellen, die für uns internet-affine Menschen sehr nützlich sein können. Mit dem Projekt Brighter Planet passiert hier etwas. Um leichter an Daten aus Deutschland zu kommen, hat sich Frag den Staat zur Aufgabe gemacht, diese Anfragen zu Sammeln und an den Staar zu stellen.
[01:15:25] Keine Schaunotizen
Paul Irish über nen heißesten Scheiß im Chrome auf der SXSW
Interesante Neuerungen, wie z. B. CSS Regions und Filters oder einige Device APIs
ScrollPath
Ein jQuery Plugin zum einfachen definieren von eigenen Scroll-Pfaden
JavaScript Extremoptimierungssport
Einige Artikel zum Thema Performance: [1], [2], [3]. Außerdem: JS Mythen aufgedeckt!
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/

Mar 13, 2012 • 57min
Revision 62: Adobe Shadow, Mobile und Gerante – Live!
Diesmal erhielten Schepp und Peter Unterstützung von Pascal Szewczyk (peppmedien.de, @derPepo) und kämpften sich live durch die Themen der Woche.
Schaunotizen
[00:00:56] Adobe Shadow
Luxuriöses Remote Debugging auf Basis von Weinre. Das gefällt besonders den Windows- und Mac-Usern unter uns. Eine Ghetto-Version des Tools (ohne GUI) gibt es unter debug.phonegap.com – noch!
[00:12:16] Hardware-accelerated audio/video decoding in Gecko?
Wird der mobile Firefox demnächst den H.264-Codec des Android-Systems nutzen um Videos abzuspielen? Sollte er? Wenn ja, was passiert dann mit dem Desktop? Kann man überhaupt mehr tun, als wild zu spekulieren? Und ist das Thema nicht langsam durch?
[00:20:38] Web developer relations management in the mobile world
PPK jammert, dass er nicht von allen Herstellern kostenlose Mobilgeräte zum Testen bekommt. Wir bekämen zwar auch gern kostenloses Spielzeug nachgeworfen, können uns aber nicht drauf einigen, ob dieser Ansatz wirklich so ohne weiteres skaliert. PPKs Primärziel, Mozillas B2G, ist jedenfalls entschuldigt.
[00:35:33] Mit der Gesamtsituation unzufrieden
Schepp und Pascal können sich des Eindrucks nicht erwehren, dass Deutschland Internettechnologie-Entwicklungsland sei. Sie berichten von leeren Workshops und stumpfen Veranstaltungen. Peter ist skeptisch. Was sagt ihr?
[00:51:10] Wir senden live!
Die Aufzeichnung von Working Draft wird ab jetzt (hoffentlich) jeden Montag gegen 20:00 Uhr live geschehen. Wo der Stream dann jeweils im einzelnen zu finden sein wird, ist noch nicht ganz klar (eventuell weiterhin bei Livestream.com), aber der Chat in #workingdraft auf Freenode ist bereits jetzt eine Institution.
[00:53:44] Keine Schaunotizen
SASS Video Tutorials
Wer einen Einstieg in das Thema SASS braucht, findet ihn hier.
udacity.com
Großkalibrige Informatik-Universitätskurse zum Anschauen im Internet!
Least
CSS-nach-LESS/SASS/Stylus-Converter.
Fantomas Icon Font Generator
Erzeugt Icon-Fonts auf Knopfdruck.
Cutter.js
JS-Lib, die Text schneidet, ohne die enthaltenen HTML-Tags in Mitleidenschaft zu ziehen.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/

Mar 7, 2012 • 1h 4min
Revision 61: HTML5 Please API, Boot to Gecko, Image Replacements
Hans, Schepp und Peter granteln über neue CSS-Techniken, bashen ein wenig PHP und lobpreisen die neuesten Entwicklungen aus dem Hause Mozilla.
Schaunotizen
[00:00:12] HTML5 Please API
Zielgerichtete Browser-Update-Forderungen, powered by caniuse.com. Und das beste? Der Hans hat mitentwickelt!
[00:12:16] Boot to Gecko
Mozilla baut ein Smartphone-OS auf Basis von Webtechnologien. Finden wir gut. Und wir denken auch, dass Google das aushält.
[00:23:22] PHP 5.4.0 ist da
Viele neue Features werden geboten. Interessant ist auch, dass das Release mit interessanten Build-Statistik aufwartet. Auch erwähnenswert: das Subreddit „Lolphp“.
[00:31:32] Neue Image Replacement Techniken
Sowohl der heilige Zeldman als auch Nicolas Gallagher kredenzen uns neue Techniken. Wir sind so mittelbegeistert, denn die Vorteile (gleichwohl vorhanden) halten sich doch sehr in Grenzen.
[00:45:44] SQL.js
SQLite im Brower. Schepp ist begeistert, Peter findet, dass man einfach auf IndexedDB warten sollte. Web SQL ist hingegen dem Untergang verdammt und war es eigentlich auch immer.
[00:58:00] Verlosung der Karten für den MMT 29
Wie versprochen verteilen wir drei Karten für den Multimediatreff 29. Die Glücklichen:
Thomas Flad
Torben Leuschner
Ingo van Peeren
Freikarten kommen per Mail. Bei Rückfragen, Mail an comments AT workingdraft PUNKT de.
[00:59:07] Keine Schaunotizen
Anselm’s Weekly Weblinks
Abonniert Anselms Blog, da gibt es wöchentlich schöne Links.
Android x86
Ein Android-Build für PCs. Optimal zur Ergänzung des Arsenals von virtuellen Maschinen für Browsertests.
basket.js
A simple (proof-of-concept) script loader that caches scripts with localStorage
Vendor-prefixed CSS Property Overview
Alle gevendorprefixten CSS-Eigenschaften aller Zeiten.
MapBox
Ein Konkurrent für Google Maps, der sehr fancy daher kommt und bezahlbar ist.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/

Feb 29, 2012 • 1h 15min
Revision 60: Adobe Edge, Web Components & Informationsquellen
Heute quatschen mal nur der Dirk Jesse, seines Zeichens YAML-Framework-Autor und CSS-Tüftler, und der Schepp über die Themen der Woche. Inklusive Epic Aufnahmefail.
Schaunotizen
[00:00:18] Adobe Edge Preview 4
Schepp erzählt von seinen Erkenntnissen zur aktuellen Preview 4 von Adobe Edge.
[00:10:49] Aktuelle Neuerungen in WebKit
CSS calc materialisiert sich in WebKit. Außerdem implementiert er als erster Browser Scoped Styles
[00:20:57] Web Components (+ Polyfill)
Die Web Components nehmen an Fahrt auf! Passend dazu hat Dimitri Glazkov einen Polyfill gebaut, der das Verhalten der Web Components nachbildet.
[00:33:30] Saving images and files in localStorage
Mozilla hat einen weiteren Artikel rund um die Verwendung von localStorage als Datei-Cache online gestellt. Wir ergänzen ihn mit unserem Erfahrungsschatz.
[00:41:56] Quellen von und Strategien zur Informationsbeschaffung
Passend zum „Brennpunkt Spezial“ der letzten Revision stellen wir die Frage, wie man sich all die Informationen zu aktuellen Entwicklungen beschafft, wie wir sie zum Beispiel wöchentlich für den Podcast recherchieren.
[01:07:36] Verlosung von 3 Karten für den MMT 29
Beide sind wir beim Multimediatreff 29 am 23./24.03.2012 in Köln, nochmals zum Thema „Webtechnologien“. Und für den Konferenztag am Samstag wollen wir gerne 3 Karten unters Volk bringen! Teilnehmen bei der Verlosung tut jeder, der in den Kommentaren eine tiefgründige und aktuelle Quelle für Webentwickler Infos nennt.
[01:08:40] Keine Schaunotizen
Whatfont Tool
Chrome Erweiterung, mit der sich auf einer Seite verwendete Schriftarten herauslesen lassen.
Overthrow: An overflow polyfill for responsive design
Overthrow ist ein Mobilgeräte-Polyfill für overflow: auto; -webkit-overflow-scrolling: touch;
Android Measuring Stick
Dieser Artikel versucht mit Methodik, Licht ins Dunkel der Marktpenetrierung verschiedener Android-Versionen zu bringen. Mit Erfolg.
Chaplin
Chaplin zeigt exemplarisch eine mögliche Nutzungsweise von backbone.js für komplexe Webapps.
HTML5 Game Dev News
Ein Portal voller interessanter aggregierter Artikel rund ums Thema HTML5 Spieleentwicklung.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/

Feb 23, 2012 • 1h 15min
Revision 59: Wie ticken Webentwickler?
Aus akutem Mangel an aktuellen Themen haben Hans, Kahlil und Peter spontan eine Sondersendung eingeschoben. Da letzterer demnächst HTML5 an Entwickler vermitteln soll, die bisher keine Erfahrung mit Web-Frontendentwicklung haben, stellte sich die Frage, wie Webentwickler überhaupt mit der Realität im WWW klarkommen. Anders als „normale“ Programmierer kennt der Web-Nerd keine festen Zielplattformen, die einzelnen Technologien mutieren ohne engere Abstimmung miteinander vor sich hin, es gibt keine irgendwie gearteten „offiziellen“ Tools, keine zentrale Dokumentation und so weiter. Auf der Suche nach des Pudels Kern haben wir dann einfach die Aufnahme mitlaufen lassen und erklären das Ergebnis unserer Diskussion zur Revision 59.
Schaunotizen
[00:02:40] Mozilla Developer Network
MDN ist das, was einer umfassenden Dokumentation von Webtechnologie noch am nächsten kommt.
[00:04:30] Writing forward-compatible websites
Brendan Eich erklärt, wie man Webseiten baut, die auch in 10 Jahren noch funktionieren.
[01:02:30] & [01:06:55] Code Kit und Live Reload
Zwei Tools, die beim Umgang mit Präprozessoren nicht verzichtbar sind (behauptet jedenfalls die Mac-Fraktion)
[01:04:25] Git Tower
Ohne Git Tower würde Hans Git als Zumutung empfinden.
Sublime Text 2
Der aktuell trendigste Texteditor für Webentwickler.
Gesammelte Erkenntnisse und Thesen
Um über Webtechnologie informiert zu sein, muss man sich in den Informationsfluss (Twitter, Blogs usw.) einklinken und drinbleiben.
Kleine, spezialisierte Tools helfen dabei, viele verschiedene (und sich ständig ändernde) Probleme zu jonglieren.
Eine offene Community mit geringen Einstiegshürden trägt viele Informationen nach außen und produziert das Wissen, das anderswo offizielle Dokumentationen bereitstellen.
Man muss jederzeit flexibel sein, Neues lernen und Altes vergessen.
Das latente Design-Fanboytum der Webentwickler rührt daher, dass sie so oft Tools wechseln. Wir haben keine Zeit für schlechte Software!
Haben wir Recht? Haben wir etwas vergessen? Haben wir Blödsinn erzählt? Sagt es uns in den Kommentaren!
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/

Feb 16, 2012 • 1h 32min
Revision 58: -webkit-CSS3, -webkit-SEO und -webkit-MMT
Schaunotizen
[00:00:22] Vendor-Prefix-Gate
Mozilla, Microsoft und Opera wollen CSS-Features mit Webkits Vendor-Prefix implementieren? Was hat die denn geritten und vor allem: wer ist Schuld an der Misere? Wir sondern unsere Meinungen ab und sprechen außerdem über:
PPKs Meinung zu dem Thema
Alternativen zum vendor-Prefix-Modell
Chris Heilmanns Lösugsansatz
[00:28:30] Musings on Preprocessing
Letzte Woche war die Woche, in der mehrere beleibte Männer das Licht der CSS-Präprozessoren gesehen haben. Wir nehmen die Erleuchtung von Chris Coyier zum Anlass, selbst das Thema einmal breit zu treten und unsere beliebtesten Präprozessoren nebst zugehörigen Tools zu lobpreisen. Zur Sprache kommen:
Sass und Compass (Präprozessor plus Framework)
Less (Präprozessor)
Stylus (Präprozessor)
CodeKit, ein GUI für Präprozessoren aller Art
Peters Stylus-Server der Marke Eigenbau
[00:51:42] Neue CSS3-Drafts und neue Möglichkeiten
Wir besprechen den aktuellen Vorschlag für CSS-Variablen, native verschachtelte Selektoren, neue Positionierungs-Möglichkeiten und obskure Winkelmaße aus dem Bergbau. Außerdem empfiehlt Paul Irish, nur noch mit dem Border-Box-Modell zu arbeiten – ein Vorschlag, dem wir uns rundheraus anschließen (Erklärungen hier und hier, Polyfill hier).
[01:05:05] SEO Ranking Faktoren für Deutschland 2012
Zeigt den Artikel euren Chefs, damit die Suchmaschinen-Kaputtoptimierer ihre fettigen Griffel von unserem HTML lassen und sich darauf konzentrieren, bei Twitter rumzuspammen. Denn, man glaubt es kaum, letzteres ist sehr viel erfolgversprechender!
[01:09:47] Mozilla arbeitet an Push-Nachrichten
Mittels Push-Nachricht können euch Webseiten Meldungen schicken, selbst wenn ihr sie gerade nicht offen habt. So ist jedenfalls die Theorie. Wir sagen: her damit!
[01:14:22] Remote Tilt
Ein sehr cooler Service, der die Events Device Orientation– und Device Motion-APIs simuliert. So kann man Mobil-Apps, die die die Lagesensoren der Handys und Tablets verwenden, beqeum am Desktop-Rechner entwickeln.
[01:20:17] Multimediatreff 29
Wir schieben ein wenig dreiste Propaganda für den 29. Multimediatreff, einer Konferenz rund um Webfoo für kleines Geld. Besonders möchten wir auf die dieses Jahr neu eingeführten Workshops verweisen, in denen man sich von absoluten Fach-Nerds mit frischem Wissen ausstatten lassen kann.
[01:24:12] Keine Schaunotizen
ShareJS
Etherpad (und mehr) in JS/Node.
CSS3 Test
Was kann dein Browser?
Warum man das Placeholder-Attribut nicht als Ersatz für Labels nehmen sollte
Es soll ja Leute geben, die das machen.
Addy Osmanis Talk über skalierbares JavaScript
Auch für Nicht-Vollnerds verständlich und wertvoll.
JavaScript Jabber
Neuer JS-Podcast
Music for programming
Speziell für Programmierer zusammengestellte Mixes. Und wenn Kahlil sagt, dass das guter Stoff ist, dann ist das auch guter Stoff.
http://designpepper.com/podcasts-for-hackers
Ganz viele Podcasts für Programmierer.
Better JS with CoffeeScript
Warum CoffeeScript das Haus rockt.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/

Feb 9, 2012 • 50min
Revision 57: IDBExplorer, Gradient Syntax & Wrap.js
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.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/

Jan 26, 2012 • 1h 4min
Revision 56: Font.js, CSS3 UI & Wunderkit
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.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/


