Working Draft

By 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 Webde... more

Download on the App Store

Download on the App Store

Get it on Google Play

FAQs about Working Draft:

How many episodes does Working Draft have?

The podcast currently has 1,128 episodes available.

Working Draft episodes:

December 25, 2015 Revision 246: Der Blick in die Glaskugel
Da sich das Jahr dem Ende zuneigt, haben sich Rodney und Schepp die Glaskugel geschnappt und wagen ein paar Prognosen für 2016: Welche Webtechnologien werden massenfähig? Welches Framework spielt eine gewichtige Rolle? Mit welcher neuen Technologie dürfen wir herumspielen?
[00:00:14] Unsere Prognosen für 2016
Apple kommt in die Pötte
Service Workers allerorten
Eine exponentielle Zunahme von HTTPS
Viele Webserver werden auf HTTP/2 upgraden
Immer mehr Produkte werden REST Schnittstellen haben (siehe auch JSON API und HAL)
Angular 2
Web Components werden ohne groß Tammtamm eingesetzt (siehe auch What happened to Web Components? und The state of Web Components)
Wir werden erste Webseiten mit CSS Grids bauen
ES7/Next/2016 kommt auf uns zu und wird dank Babel direkt nutzbar sein (siehe auch: nativer Browsersupport)
WebAssembly könnte ein paar interessante Dinge hervorbringen
[01:05:03] Keine Schaunotizen
The “Blur Up” Technique for Loading Background Images
Schöne Art und Weise, niedrigaufgelöste weichgezeichnete Bilder als Platzhalter für die höher aufgelösten zu verwenden
...more
1h 7min
December 19, 2015 Revision 245: Web Components und Links
Schepp, Stefan und Peter debattierten Web Components und verteilten die allwöchentliche Ladung Links.
Schaunotizen
[00:00:10] Web Components und Gremlin.js
Angeregt durch das Erscheinen der Minimal-Web-Components-Library Gremlin.js (nicht zu verwechseln mit dem Test-Tool Gremlins.js) plaudern wir über Web Components allgemein. Neben Web Components in unserem Alltag (nicht existent) geht es um Custom Elements, WAI-ARIA, Mutation Observers, und
Handlebars.js sowie die möglichen Alternativ-Libraries X-Tag und Polymer. Am Ende stellen wir in Frage, ob für man für den Funktionsumfang von Gremlin.js überhaupt Gremlin.js selbst braucht.
[00:37:20] Keine Schaunotizen
Zwei Flexbox-Links
Flexbox Grid Finesse gibt Tipps für den Einsatz von Flexbox für Grid-Layouts. Flexbox’s Best-Kept Secret zeigt, was man im Flexbox-Kontext mit Auto-Margins anstellen kann.
Taking Let’s Encrypt for a Spin
Tim Kadlec beschreibt, wie einfach es ist, Let’s encrypt zu verwenden.
Optimizing performance of multi-tier web applications using HTTP/2 push
Das Push-Feature von HTTP/2 erklärt.
HTTP/2 is here! Goodbye SPDY? Not quite yet
Warum SPDY auch in einer Welt mit HTTP/2 erst mal noch wichtig ist.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
...more
41min
December 19, 2015 Revision 245: Web Components und Links
Schepp, Stefan und Peter debattierten Web Components und verteilten die allwöchentliche Ladung Links.
Schaunotizen
[00:00:10] Web Components und Gremlin.js
Angeregt durch das Erscheinen der Minimal-Web-Components-Library Gremlin.js (nicht zu verwechseln mit dem Test-Tool Gremlins.js) plaudern wir über Web Components allgemein. Neben Web Components in unserem Alltag (nicht existent) geht es um Custom Elements, WAI-ARIA, Mutation Observers, und
Handlebars.js sowie die möglichen Alternativ-Libraries X-Tag und Polymer. Am Ende stellen wir in Frage, ob für man für den Funktionsumfang von Gremlin.js überhaupt Gremlin.js selbst braucht.
[00:37:20] Keine Schaunotizen
Zwei Flexbox-Links
Flexbox Grid Finesse gibt Tipps für den Einsatz von Flexbox für Grid-Layouts. Flexbox’s Best-Kept Secret zeigt, was man im Flexbox-Kontext mit Auto-Margins anstellen kann.
Taking Let’s Encrypt for a Spin
Tim Kadlec beschreibt, wie einfach es ist, Let’s encrypt zu verwenden.
Optimizing performance of multi-tier web applications using HTTP/2 push
Das Push-Feature von HTTP/2 erklärt.
HTTP/2 is here! Goodbye SPDY? Not quite yet
Warum SPDY auch in einer Welt mit HTTP/2 erst mal noch wichtig ist.
...more
41min
December 04, 2015 Revision 244: Accessibility Deep Dive und ally.js
Zur Feierlichkeit des ally.js Release haben sich Rodney, Anselm und Hans niemand geringeren als Marco Zehe eingeladen, der für Mozilla im Bereich Accessibility arbeitet.
Schaunotizen
[00:01:44] Marcos iPhone Accessibility Erfahrungen
Etwas abseits vom Web-Thema lassen wir uns von Marco erzählen, warum iPhones solch eine tolle Sache für Blinde sind und wie er sich damit schnell und einfach selbst in fremden Regionen zurechtfinden kann.
[00:17:42] What even is a table? A quick look at Accessibility APIs
Wir nehmen dann einen Talk als Anlass, über die Zugänglichkeit von Tabellen zu sprechen und schweifen ab in generelle Diskussionen über Semantik. Wer aber zum Beispiel mit responsive Tables arbeiten möchte, der kann mit einigen Tricks arbeiten und bewusst eine div-Suppe kreieren, die dann mit aria-roles ausgestattet wird, um semantisch wieder zur Tabelle zu werden. Wichtig ist allerdings, dass man abschließend ein aria-readonly="true" Attribut setzt, denn sonst wäre die Tabelle als bearbeitbar gekennzeichnet.
[00:47:30] ally.js
Unser Rodney hat sich 14 Monate lang damit auseinandergesetzt, wie Accessibility in verschiedenen Browsern umgesetzt wird und eine Art jQuery für Barrierefreiheit gebaut. In diesem kleinen Tutorial kannst du lernen, wie du einen accessible Dialog bauen kannst. Wir besprechen die Probleme damit, dass es viel zu tun gibt und wir hoffen, dass die Library in vielen Projekten zukünftig zu finden sein wird.
[01:19:55] Abschließende Accessibility Tipps
Abschließend wollte Anselm von Rodney und Marco noch ein paar kleine Alltags-Tipps wissen, die jeder von uns umsetzen kann. Rodney beschreibt seinen Ansatz von Accessibility aus Eigennutz durch Tastaturnutzung, Marco erklärt, warum ein leeres alt="" oft wichtiger ist als gar keins, dass Kontraste wichtig sind und wie ärgerlich es ist, wenn Seiten pinch-to-zoom deaktivieren.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
...more
1h 26min
December 04, 2015 Revision 244: Accessibility Deep Dive und ally.js
Zur Feierlichkeit des ally.js Release haben sich Rodney, Anselm und Hans niemand geringeren als Marco Zehe eingeladen, der für Mozilla im Bereich Accessibility arbeitet.
Schaunotizen
[00:01:44] Marcos iPhone Accessibility Erfahrungen
Etwas abseits vom Web-Thema lassen wir uns von Marco erzählen, warum iPhones solch eine tolle Sache für Blinde sind und wie er sich damit schnell und einfach selbst in fremden Regionen zurechtfinden kann.
[00:17:42] What even is a table? A quick look at Accessibility APIs
Wir nehmen dann einen Talk als Anlass, über die Zugänglichkeit von Tabellen zu sprechen und schweifen ab in generelle Diskussionen über Semantik. Wer aber zum Beispiel mit responsive Tables arbeiten möchte, der kann mit einigen Tricks arbeiten und bewusst eine div-Suppe kreieren, die dann mit aria-roles ausgestattet wird, um semantisch wieder zur Tabelle zu werden. Wichtig ist allerdings, dass man abschließend ein aria-readonly="true" Attribut setzt, denn sonst wäre die Tabelle als bearbeitbar gekennzeichnet.
[00:47:30] ally.js
Unser Rodney hat sich 14 Monate lang damit auseinandergesetzt, wie Accessibility in verschiedenen Browsern umgesetzt wird und eine Art jQuery für Barrierefreiheit gebaut. In diesem kleinen Tutorial kannst du lernen, wie du einen accessible Dialog bauen kannst. Wir besprechen die Probleme damit, dass es viel zu tun gibt und wir hoffen, dass die Library in vielen Projekten zukünftig zu finden sein wird.
[01:19:55] Abschließende Accessibility Tipps
Abschließend wollte Anselm von Rodney und Marco noch ein paar kleine Alltags-Tipps wissen, die jeder von uns umsetzen kann. Rodney beschreibt seinen Ansatz von Accessibility aus Eigennutz durch Tastaturnutzung, Marco erklärt, warum ein leeres alt="" oft wichtiger ist als gar keins, dass Kontraste wichtig sind und wie ärgerlich es ist, wenn Seiten pinch-to-zoom deaktivieren.
...more
1h 26min
December 02, 2015 Revision 243: Unlearning und Diversity
Diesmal haben wir (Peter, Schepp, Hans und Anselm) Mathias Schäfer eingeladen und unterhalten uns über Unlearning und Diversity, sowie den Einstieg in die Webentwicklung.
Schaunotizen
[00:01:40] Unlearning
Mathias hat durch seine Arbeit früher bei selfhtml und heute bei OpenTechSchool tiefe Einblicke in die „Kultur“ der Webentwickler-Community. Wir nehmen das als Anlass und lassen uns von Problemen erzählen, wie schwierig es für Neulinge ist, sich in einer Entwicklergemeinde willkommen zu fühlen. Wir sprechen über Initiativen wie die RailsGirls, nehmen ein Velocity-Conference Video als Anlass darüber, wie wir mehr Diversity erreichen können und kommen leider zwangsläufig auf Negativbeispiele und die Nicht-Willkommenskultur zu sprechen. Wir finden jedoch auch Lösungen, wie zum Beispiel die, privat oder bei der Open Tech School Mentor zu werden.
[00:58:51] Links
A Cartoon Intro To Redux
Eine anschauliche Erklärung der Unterschiede zwischen Flux und Redux als Cartoon.
JavaScript dates, trains, Passover, and Henry VIII
Wir haben einen sehr interessanten, wenn auch lang und komplizierten Beitrag zum Thema JavaScript Dates gefunden.
Mozilla’s Service Workers Cookbook
Eine Kollektion an Service Worker Beispielen. Und hier könnt ich nachsehen, welche Service Worker features ihr wo benutzen könnt.
Model View Culture Magazine
Passend zu unserem Hauptthema haben wir hier noch einen Link zu einem guten Magazin über Technologie und Diversity-Kultur.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
...more
1h 2min
December 02, 2015 Revision 243: Unlearning und Diversity
Diesmal haben wir (Peter, Schepp, Hans und Anselm) Mathias Schäfer eingeladen und unterhalten uns über Unlearning und Diversity, sowie den Einstieg in die Webentwicklung.
Schaunotizen
[00:01:40] Unlearning
Mathias hat durch seine Arbeit früher bei selfhtml und heute bei OpenTechSchool tiefe Einblicke in die „Kultur“ der Webentwickler-Community. Wir nehmen das als Anlass und lassen uns von Problemen erzählen, wie schwierig es für Neulinge ist, sich in einer Entwicklergemeinde willkommen zu fühlen. Wir sprechen über Initiativen wie die RailsGirls, nehmen ein Velocity-Conference Video als Anlass darüber, wie wir mehr Diversity erreichen können und kommen leider zwangsläufig auf Negativbeispiele und die Nicht-Willkommenskultur zu sprechen. Wir finden jedoch auch Lösungen, wie zum Beispiel die, privat oder bei der Open Tech School Mentor zu werden.
[00:58:51] Links
A Cartoon Intro To Redux
Eine anschauliche Erklärung der Unterschiede zwischen Flux und Redux als Cartoon.
JavaScript dates, trains, Passover, and Henry VIII
Wir haben einen sehr interessanten, wenn auch lang und komplizierten Beitrag zum Thema JavaScript Dates gefunden.
Mozilla’s Service Workers Cookbook
Eine Kollektion an Service Worker Beispielen. Und hier könnt ich nachsehen, welche Service Worker features ihr wo benutzen könnt.
Model View Culture Magazine
Passend zu unserem Hauptthema haben wir hier noch einen Link zu einem guten Magazin über Technologie und Diversity-Kultur.
...more
1h 2min
November 30, 2015Revision 242: Nützliche Services und a11y im täglichen Job
Eine einfache Sendung mit allgemeinen Themen ohne Aufhänger.
[00:00:16] News
Object.observe ist tot
Das ECMAScript-Komitee hat entschieden, Object.observe als „veraltet“ zu markieren und aus der Spezifikation zu streichen, da die Funktionalität nicht den erwarteten Anklang findet.
Schaunotizen
[00:01:00] Welche Services nutzen wir als Web-Entwickler in Projekten („SaaS“)?
Bezahlte Services werden im Entwickler-Alltag immer gebräuchlicher. Wir sprechen darüber, welche Dienste wir nutzen und warum. Ingesamt lässt sich feststellen, dass jeder von uns für Dienste zahlt, es als Freelancer jedoch schwierig ist bei jedem Projekt die Dienste zu verwenden, die man gerne nutzen würde. Ähnlich verhält es sich auch bei großen Firmen, wie Rodney schildert.
Einige der erwähnten Dienste:
BrowserStack and SauceLabs – bieten VMs für automatisiertes Testing, kostenlos für Open Source Projekte
Code Climate – automatisierte Code Analyse, kostenlos für Open Source Projekte
Travis CI – Build server, kostenlos für Open Source Projekte
MaxCDN – Content Delivery Network, kostenlos für Open Source Projekte
newrelic.com – Logging und mehr für Front- und Backend
[00:26:45] Wie gehen wir mit Accessibility in der täglichen Arbeit um?
Jeder behandelt die Zugänglichkeit von Websites in Projekten anderes. Offizielle Stellen müssen sich an bestimmte Guidelines und Standards halten, die freie Industrie hingegen nicht. Wie wir mit Accessibility in unserer Arbeit umgehen besprechen wir ausführlich. Manchmal ist es schon ganz einfach, wie dieser Artikel von Ebays Techteam zeigt.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
...more
1h 1min
November 30, 2015 Revision 242: Nützliche Services und a11y im täglichen Job
Eine einfache Sendung mit allgemeinen Themen ohne Aufhänger.
[00:00:16] News
Object.observe ist tot
Das ECMAScript-Komitee hat entschieden, Object.observe als „veraltet“ zu markieren und aus der Spezifikation zu streichen, da die Funktionalität nicht den erwarteten Anklang findet.
Schaunotizen
[00:01:00] Welche Services nutzen wir als Web-Entwickler in Projekten („SaaS“)?
Bezahlte Services werden im Entwickler-Alltag immer gebräuchlicher. Wir sprechen darüber, welche Dienste wir nutzen und warum. Ingesamt lässt sich feststellen, dass jeder von uns für Dienste zahlt, es als Freelancer jedoch schwierig ist bei jedem Projekt die Dienste zu verwenden, die man gerne nutzen würde. Ähnlich verhält es sich auch bei großen Firmen, wie Rodney schildert.Einige der erwähnten Dienste:
BrowserStack and SauceLabs – bieten VMs für automatisiertes Testing, kostenlos für Open Source Projekte
Code Climate – automatisierte Code Analyse, kostenlos für Open Source Projekte
Travis CI – Build server, kostenlos für Open Source Projekte
MaxCDN – Content Delivery Network, kostenlos für Open Source Projekte
newrelic.com – Logging und mehr für Front- und Backend
[00:26:45] Wie gehen wir mit Accessibility in der täglichen Arbeit um?
Jeder behandelt die Zugänglichkeit von Websites in Projekten anderes. Offizielle Stellen müssen sich an bestimmte Guidelines und Standards halten, die freie Industrie hingegen nicht. Wie wir mit Accessibility in unserer Arbeit umgehen besprechen wir ausführlich. Manchmal ist es schon ganz einfach, wie dieser Artikel von Ebays Techteam zeigt.
...more
1h 1min
November 08, 2015Revision 241: WebGL
Diesmal konnten wir wieder einen Gast bei uns begrüßen, und zwar Kai Niklas. Kai beschäftigt sich seit einiger Zeit mit OpenGL und seinem Abkömmling WebGL, programmiert 3D-Anwendungen und tourt als Trainer für OpenGL durch Deutschland. Und so verwundert es kaum, dass wir mit ihm zusammen das Thema „WebGL“ erkunden.
Schaunotizen
[00:01:54] WebGL
Im Laufe unseres Gesprächs fielen diverse Stichworte und Links, die Ihr nachfolgend findet:
Die Khronos Group spezifiziert OpenGL und WebGL
OpenCL und WebCL, analog zu OpenGL und WebGL die „Compute Languages“ zum Berechnen von Dingen
WebGL Browsersupport
Anwendungsfälle: Virtuelle Museen, 3D Charts, Produkt Konfiguratoren oder Customer Experiences
Die WebGL-Frameworks Three.js Babylon.js und Blend4Web
Blender als Autorenwerkzeug für 3D (also Modellieren, Szenerien zusammenstellen, Beleuchten, Texturieren)
Autodesks ImageModeler als ein Werkzeug, das 3D-Modelle aus Fotografien erzeugen kann
Shadertoy, Shdr und RenderMonkey als Autorenwerkzeuge für WebGL-Shader (Vertex-, sowie Pixel-/Fragement-Shader)
Die Swiftless-Online-Tutorials zum Erlernen der OpenGL/WebGL Basics
Die Seiten von Three.js, Shadertoy, sowie die Chrome WebGL Experiments als Inspirationsquellen (und zum Abgucken)
Und ein Blick in die Zukunft auf den OpenGL-Nachfolger „Vulkan„
[00:45:31] Keine Schaunotizen
mdcss
Mit mdcss kann man Markdown-Kommentare direkt in seinem CSS verbauen und aus diesem CSS dann einen Styleguide kompilieren.
Buchtipp: CSS Secrets
Lea Verou hat ein Buch geschrieben, in das nicht nur die CSS Tricksereien ihrer vergangenen Talks geflossen sind, sondern noch einige Geheimnisse mehr stecken. Das Gute an dem Buch ist: Die Tipps haben durchaus Praxisrelevanz.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
...more
48min

FAQs about Working Draft:

How many episodes does Working Draft have?

The podcast currently has 1,128 episodes available.

More shows like Working Draft

Bits und so by Undsoversum GmbH

Bits und so

25 Listeners

Freak Show by Metaebene Personal Media - Tim Pritlove

Freak Show

9 Listeners

AstroGeo - Geschichten aus Astronomie und Geologie by Karl Urban und Franziska Konitzer

AstroGeo - Geschichten aus Astronomie und Geologie

3 Listeners

Geschichten aus der Geschichte by Richard Hemmer und Daniel Meßner

Geschichten aus der Geschichte

181 Listeners

c’t uplink - der IT-Podcast aus Nerdistan by c’t Magazin

c’t uplink - der IT-Podcast aus Nerdistan

8 Listeners

Stay Forever - Retrogames & Technik by Stay Forever Team

Stay Forever - Retrogames & Technik

31 Listeners

Logbuch:Netzpolitik by Metaebene Personal Media - Tim Pritlove

Logbuch:Netzpolitik

5 Listeners

programmier.bar – der Podcast für App- und Webentwicklung by programmier.bar

programmier.bar – der Podcast für App- und Webentwicklung

1 Listeners

Podcasts von Tichys Einblick by Tichys Einblick

Podcasts von Tichys Einblick

19 Listeners

eat.READ.sleep. Der Podcast, der das Lesen feiert. by NDR

eat.READ.sleep. Der Podcast, der das Lesen feiert.

26 Listeners

Finanzen ganz einfach - von Saidi, Sophie & Emil by Finanztip

Finanzen ganz einfach - von Saidi, Sophie & Emil

11 Listeners

Lanz + Precht by ZDF, Markus Lanz & Richard David Precht

Lanz + Precht

312 Listeners

{ungeskriptet} - Der Meinungsfreiheit verpflichtet. by Ben Berndt

{ungeskriptet} - Der Meinungsfreiheit verpflichtet.

42 Listeners

KI-Update – ein heise-Podcast by Isabel Grünewald, heise online

KI-Update – ein heise-Podcast

7 Listeners

Engineering Kiosk by Wolfgang Gassler, Andy Grunwald

Engineering Kiosk

0 Listeners