Working Draft

Vanessa Otto, Peter Kröner, Hans Christian Reinl, Stefan Baumgartner, Christian »Schepp« Schaefer
undefined
Mar 23, 2014 • 1h 9min

Revision 162: Indie UI

In Revision 162 sind zwei Gäste mit von der Partie. Zum einen Mozillas Accessibility Experte Marco Zehe, der bereits zu Gast war, sowie Tomas Caspers, der sich seit vielen Jahren mit dem Thema Accessibility beschäftigt und bei uns zum ersten Mal dabei ist. [00:01:43] News Sass 3.3.0 Sass ist in der Version 3.3.0 veröffentlicht worden und bringt einige Neuerungen mit sich. Schaunotizen [00:02:28] Indie UI und Accessibility Mit unseren beiden Themen-Gästen sprechen wir über das Thema Accessibility. Aufhänger dafür ist der Editors-Draft zu Indie UI, der sich mit der Verallgemeinerung von Benutzer-Input Events und sichtbaren Einstellungen beschäftigt. Marco ist, wie auch manch anderer, mit dem Konzept von Indie UI nicht so ganz einverstanden und diskutiert seine Position mit Tomas, der den Ansatz der Spezifikation schon mal richtig findet. Im Laufe der Diskussion driften wir auf die Erfahrungen der beiden mit dem allgemeinen Thema Accessibility ab. [01:03:25] Keine Schaunotizen Grunt YSlow Grunt YSlow ist eine Grunt Task, die die Performance einer Website anhand der Metriken von Yahoo!s YSlow analysiert. Grunt PageSpeed Grunt PageSpeed ist das Pendant zur YSlow Implementierung als Grunt Task, basierend auf Google PageSpeed. Parker Das CSS Analyse-Tool Parker ermittelt Metriken eines Stylesheets und ist als CLI verfügbar. Bootstrap Accessibility Plugin Die Entwickler bei Paypal haben die Grundfunktionalität von Bootstrap so erweitert, dass die einzelnen Module zugänglicher sind und dies in ein Plugin verpackt. Umstieg von Mac auf Windows Marco hat sich für die Rückkehr zu Windows entschieden und beschreibt warum er diesen Schritt geht. Content Strategy Forum Vom 1. bis 3. Juli findet in Frankfurt das Content Strategy Forum. Im Call For Papers sind die Organisatoren auch an Front-End Entwicklung und die Schnittmengen mit der Content-Erstellung interessiert.
undefined
Mar 11, 2014 • 1h 15min

Revision 161: Too Easy, Didn’t Learn

Es war Rosenmontag und der großteil des Workingdraft-Teams bereitete sich auf das halten diverser Workshops vor. Um einem Monolog zu entkommen lud sich Rodney die Herren Christian Heilmann und Sebastian Golasch ein, um ein wenig über Christians Vortrag an der jQuery Europe zu schnacken. Schaunotizen [00:01:04] TE;DL – Too Easy, Didn’t Learn (video) Mit jedem Tool und mit jeder Abstraktion vereinfachen wir uns die Arbeit. Was wir jedoch nicht vereinfachen ist das Lernen und Verstehen der Dinge, die wir in eine Abstraktion oder Tool gepresst haben. Wir beleuchten den »Just build a tool for that«-Hype einmal von der anderen Seite. [00:46:04] W3C HTML JSON form submission (Unofficial Draft) Ein Vorschlag <form> Elemente neben application/x-www-form-urlencoded auch als application/json absenden zu lassen. Wir diskutieren die Vorzüge und Probleme des Vorschlags. Wir kommen auch kurz auf das recht unbekannte Objekt FormData zu sprechen, von dem wir dachten, dass es den Umgang mit Formularen bereits vereinfachen würde – was sich dann leider doch nicht als der heilige Gral der Formulardatenverarbeitung herausstellt. [01:06:53] Keine Schaunotizen CSS performance revisited: selectors, bloat and expensive styles Komplexe CSS Selektoren sind wohl eine kleinere Bremse als überschüssiges, ungenützes CSS. Cross-browser Web Fonts part 3: Hyphens, Text Rendering, and Font Feature Settings Der Artikel erklärt wie das Beeinflussen von Ligaturen, Kerning, Fractionals, Ordinals, etc. funktioniert. How to Use The HTML5 Sectioning Elements Wann nutze ich <section>, wann <article> und wann doch lieber nur ein <div>? layout thrashing in jQuery Welche jQuery-Funktionen können sich negativ auf die Rendering-Performance auswirken? Rewriting A WebApp in ES6 Man nehme eine Backbone Applikation und schreibe große Teile davon mit EcmaScript6 neu. Weil man kann.
undefined
Mar 2, 2014 • 1h 17min

Revision 160: Node, JavaScript, Links

Für diese Revision luden sich Schepp und Peter den Node-Nerd Golo Roden (Twitter, Webseite) ein und plauderten über Node.JS und ganz allgemein den Zustand von JavaScript in Gegenwart und Zukunft. Schaunotizen [00:01:50] JavaScript aus der Perspektive eines Backend-Entwicklers Golo erzählt, wie man aus der C#-Welt an JavaScript gerät und das ganze dann auch vernünftig lernt. Gemeinsam sind wir der Auffassung, dass nach den ersten Copy-Paste-Basteleien die Lektüre von The Good Parts und The Definitive Guide angebracht sind. [00:15:50] ES6 und Async Golo und Peter debattieren die Vor- und Nachteile von ES6-Features wie Arrow Functions, Klassen und Generator Functions (nebst Libraries), wobei neben Async.js auch die Artikel Execution in the Kingdom of Nouns und What Made Lisp different zur Sprache kommen. [00:43:22] Node 0.12 Nachdem wir festgestellt haben, dass wir alle schon Node benutzt haben bevor es cool war (Version 0.4) erzählt Golo ein wenig über das kommende Node-Release 0.12. Wir sprechen über instabile APIs und Module, TJ Holowaychuk, SpiderNode (mittlerweile eingestellt) und die Causa Joyent versus Strongloop. [00:57:50] Hörer-Frage: Koa vs Express Bei der Frage Express versus Koa (beides Webframeworks) sind wir uns einig: Koa taugt erstmal nur als Spielzeug. Golo weist darauf hin, dass ES6 noch nicht in Node Standardmäßig aktiviert ist und Peter hat obendrein noch kein Vertrauen in die Stabilität von Koa selbst. Der aktuelle Hype erinnert uns ein wenig an die leicht überhypte Frage Grunt versus Gulp. [01:03:44] Wie lernt man am besten Node? Peter behauptet, Node wäre ganz einfach, sofern man JavaScript schon kann; die APIs lernt man besten, indem man wie in jeder anderen Programmiersprache einfache Programme schreibt. Golo geht im Prinzip d‘accord, sieht die größte Hürde im etwas unübersichtlichen Ökosystem von Node. Hilfe findet man natürlich am besten in Golos Buch Node.js & Co: Skalierbare, hochperformante und echtzeitfähige Webanwendungen professionell in JavaScript entwickeln. [01:09:27] EnterJS Golo erzählt von seiner Konferenz EnterJS, die vom 30. Juni bis 2. Juli in Köln stattfindet. Thema ist JavaScript im Unternehmenskontext. [01:13:19] Keine Schaunotizen Random User Generator Placekitten für User-Daten. noPrefixes flag in Modernizr Stefan bloggt über Fortschritte im Kampf gegen Vendor-Prefixes an der Modernizr-Front Installable Standalone WebApps Ein Überblick über den Status Quo. WURFL.js – Client Side, meet Server Side Die bekannte Device Detection Library jetzt auch clientseitig. The 4 Slice Scaling Technique for SVG SVG-Nerd Dirk Weber SVG-Slicing für Fortgeschrittene. Using blend modes in HTML Canvas Ein weniger bekanntes HTML5-Feature wird vom Adobe-Team beleuchtet.
undefined
Mar 2, 2014 • 56min

Revision 159: Grunt im Einsatz

Gästefrei sind diesmal Schepp, Rodney und Stefan mit am Start, um mit Grunt nach dem Hype in Klausur zu gehen. Schaunotizen [00:00:29] Grunt Grunt ist ja nun schon eine Weile bekannt und im Einsatz, und erfreut sich immer größerer Beliebtheit bei den Entwicklern. Sogar Schepp hat seine selbstgebastelten Buildscripts für diverse Projekte verlassen und ist in die Grunt-Welt eingetaucht. Wird reden über den Einsatz des Buildtools in großen und kleinen Projekten, und wie man sich das effiziente Entwickeln, vor allem in Hinblick auf CI und CD ohne Grunt eigentlich nicht mehr vorstellen kann. Plugins die erwähnt werden sind unter anderem spritesmith, autoprefixer, svgmin, cssmin und connect. Außerdem empfiehlt Rodney, statt load-grunt-tasks besser matchdep zu verwenden. Wer übrigens das letzte aus Grunt herauskitzeln will, dem empfehlen wir Paul Bakaus Artikel auf HTML5 Rocks [00:47:27] Keine Schaunotizen Chrome CLI Viel im Terminal? Mit der Chrome CLI kann man seinen Entwicklungsbrowser nun auch bequem von der Kommandozeile aus steuern. What nobody told you about Sass @extend Hugo Giraudel schreibt über die Funktionsweise und Gefahren der Sass @extend Methode. Try Handlebars Handlebars templates direkt im Browser ausprobieren und sehen, ob selbstgeschriebene Helper funktionieren. Geht hier. Pageres Mit Sindre Sorhus neuem Tool kann man Screenshots von der Kommandozeile aus machen. Refactoring Techniques Wie man richtig Refactoring betreibt wird in diesem Artikel erklärt. JavaScript Code Style Checker Ein weiterer Code Style Checker, aber höchst konfigurierbar und bis aufs kleinste anzupassen Web Animation at Work Rachel Nabors beschreibt ihr Steckenpferd in diesem List Apart Artikel. Draggable elements that push others out of way Chris Coyier schreibt über ein Design Pattern, und die unterschiedlichen Wege und Bibliotheken, es zufriedenstellend umzusetzen. [00:53:25] Tipp der Woche Including data from Github Tipp von Rodney: Wenn man mal Github files im Rohformat braucht, hat man mit diesen Services viel Freude.
undefined
Feb 16, 2014 • 1h 3min

Revision 158: Performance, Performance, Performance; sowie Leserfragen

In der heutigen Revision haben Hans, Peter und Stefan den Performance-König Tobias Baldauf eingeladen, um über aktuelle Trends und gute Ratschläge in Sachen Webperformance zu plaudern. [00:01:08] News Firefox 27 Neuer Release des Independent Browser, mit der neuen CSS Eigenschaft all:unset und einigen anderen Änderungen. Schaunotizen [00:01:56] Bleeding Edge Bildoptimierung Tobias erzählt über aktuelle Trends in der Bildoptimierung, und wie man aus langgedienten Grafikformaten wie JPEG dank Machine Learning noch weitere 10% rausholen möchte. [00:07:56] Renderingoptimierungsmöglichkeiten bei Webfonts Chrome hat seinen Webfont Renderingprozess neu gelöst, und zeigt nach 30 Sekunden ohne geladener Font eine Fallbackschrift an. Außerdem erzählen wir welche weiteren Steuerungsmöglichkeiten es gibt, ob text-rendering Unterschiede macht und wie man Subsetting richtig einsetzen kann! [00:13:15] Automatisiert Performance Metriken generieren Performance kann und soll man klarerweise messen. Tobias gibt Tipps und verweist auf Tools wie Phantomas (samt Grunt-Plugin) und das HTTP Archive. [00:17:41] Viele Schriftschnitte vs. Performance Der Schriftenkaiser Gerrit van Aaken ruft zu Recht auf, verschiedene Fettschnitte in Webfonts zu beachten. Doch was des Designers Freud‘ ist des Performanceoptimierers Leid. Wo liegt die optimale Grenze, und welche Möglichkeiten würden wir uns wünschen um beide Welten zufrieden zu stellen. Wir philosophieren. [00:22:06] Performance-Guidelines und -Budgets Performance ist wichtig und kann auch gut argumentiert bzw. verkauft werden! Stefan erzählt von Kompromissen aus dem täglichen Agenturleben und welche Probleme man sich fernhält, wenn man das Performance-Augenmerk von Anfang an in Betracht zieht. Der Rest stimmt in der Reflexion mit ein und gibt Ratschläge. [00:27:58] Leserfrage: Unsere Erfahrungen zu custom styled Inputs Stammhörer Christoph Rumpel fragt, wie man Formularelemente am besten stylen kann, und welche Bibliotheken bzw. Tools wir dafür nehmen. Eine Antwort mit einem Plottwist. Erwähnt werden: Ryan Seddons Technik über :checked Attribut und das ähnlich funktionierende Navigataur. Außerdem wird es Zeit alert und confirm wieder aus ihrer Versenkung zu bringen! [00:35:37] Layoutgeschwindigkeit von CSS Flexbox CSS Flexbox rendert langsam und hat nicht unbedenkliche Aufbaustrukturen. Doch lieber CSS3 Grid-Layouts verwenden! Doch was, wenn manches davon noch gar nicht in den aktuellen Browsern implementiert wurde? Wir ranten über Angebot und Nachfrage, den IE9 und die Zukunft des Internet Explorers, und geben Peter in einer spontanen Selbsthilfegruppensitzung Platz. [00:46:47] Leserfrage: Gute Onlinecommunities für Webentwicklung? Christian fragt: Welche guten Onlinecommunities gibt es? Die Leute kurz vor oder jenseits der 30 erzählen mit weißen Rauschebärten über die gute, alte Forenzeit, dass deren Abgesang eigentlich eh nicht so schlecht ist, und warum Twitter und Co. sich in den letzten Jahren behauptet haben. [00:58:52] Keine Schaunotizen CSS Above the fold Inliner Dinge, die über der Fenstergrenze passieren sollten auch besonders schnell sichtbar sein. Dieses PhantomJS basierte Tool hilft! Responsive Images & Lazy Loading Der sehr aktive Sven Wolfermann über Responsive Images und Lazy Loading. Pflichtartikel Tipp der Woche Topcoat.io Man braucht fesches UI, ohne sich dabei gleich Boliden wie Bootstrap oder Foundation zu installieren, hat Ansprüche auf Performance und Anpassung? Dann sollte man auf Adobes Topcoat einen genaueren Blick werfen.
undefined
Feb 9, 2014 • 1h 11min

Revision 157: Komplexes Markup, Styles Inlinen und HTTP/2

Keine Gäste, trotzdem Themen in einer – mal wieder – etwas längeren Sendung. Keine News Schaunotizen [00:00:20] HTML is too complex Wir stellen uns die Frage, ob HTML mit den Additionen in HTML5 zu komplex für uns Developer geworden ist. Hans vertritt die Meinung, dass mehr Möglichkeiten auch verbesserte Semantik mit sich bringt. Rodney ist da eher skeptisch, in wie fern dies dem durchschnittlichen Web Entwickler tatsächlich hilft. [00:12:00] Putting CSS in the head Basierend auf Hans‘ Artikel und dessen Vorläufer „What’s with putting the CSS in the head?“ diskutieren wir die Vor– und Nachteile von der Platzierung des CSS inline im Head-Element einer Website. Wir sprechen über allgemeine Performance, CDNs und die Use Cases dieser Technik. [00:29:19] Nine Things to Expect from HTTP/2 Wir erklären HTTP/2 und SPDY etwas genauer. Die beiden neuen Netzwerk-Technologien sind gerade auf dem aufsteigenden Ast und werden uns Web-Entwicklern die Arbeit, gerade im Bezug auf Netzwerk-Performance erleichtern, sobald sie dann bei der breiten Masse angekommen sind. Testen, ob eine Website SPDY einsetzt, kann man mit SPDY-Check und eine gute Erklärung zum Thema SPDY Push gibt’s in diesem Video. [00:49:19] CSS Will Change Aktuell nutzen wir CSS 3D-Transforms um Grafik-Hardware-Beschleunigung für Elemente zu erreichen, damit diese flüssiger rendern. Mit der CSS-Eigenschaft will-change soll diesem Hack nun abgeholfen werden. [00:55:06] Glücksrad HTML5 Media Die Audio- und Video-API sind wichtige Bestandteile von HTML5. Leider sind diese allerdings für komplexere Anwendungen noch ziemlich inkonsistent in den verschiedenen Browsers implementiert. Schepp erzählt von seinen Erfahrungen. [01:04:06] Keine Schaunotizen Static Site Generators Eine Sammlung von Static Site Generatoren gibt Sven Wolfermann inklusive Wertung. Hans möchte zusätzlich sein INIT Projekt anpreisen. Take Off Conf Videos Die Videos der Take Off Conference, die Ende Januar statt fand, sind bereits online. Service Worker Ein Slidedeck mit allen Infos zu Service Workern.
undefined
Jan 30, 2014 • 52min

Revision 156: Viewport Units in iOS und Gegenwind für CSS Regions

Wenig Themen, viel Diskussion! Peter, Rodney und Stefan besprechen Browserbugs, die keine sein sollten und sinnieren über einen jüngst veröffentlichten A List Apart Artikel, den man wohl ohne Weiteres in die Kategorie „Große Erschütterung der Macht“ stecken darf. [00:00:15] News CSS Editor’s Draft contains links to Shepherd Noch in Beta und in starker Bearbeitung, aber nach jahrelanger Wartezeit endlich Realität: Im CSS Editor’s Draft der W3C werden die Shepherd Tests verlinkt. Schaunotizen [00:01:00] Viewport Units in iOS Trotz recht weitreichender Kompatibilität und echtem Bedarf sind Viewport Units überaus buggy und beinah unbrauchbar, wie Rodney jüngst herausfinden musste. Wir sprechen über die eigentliche Nutzung und wie man Dank CSSOM zu einem netten Buggyfill kommt (Term coined by Sebastian Golasch. [00:24:05] CSS Regions considered harmful Wenn einer der CSS Erfinder CSS Regions öffentlich für Scheiße erklärt, kann das Internet schonmal Kopf stehen. Browserhersteller treten den Rückzug an und nehmen experimentelle Implementierungen aus der Codebase. Wir sprechen über Sinn und Unsinn, Web vs. Webtechnologie und den Bedarf an „Generated Content“. Außerdem flattert pünktlich zur Sendung ein sehr interessanter Pro-Artikel von Sara Soueidan zum Thema herein. [00:44:31] Glücksrad Table Sorting Model Tabellensortieren im Browser, wie einst beim guten, alten jQuery Tablesorter! Existiert momentan allerdings nur am Papier. [00:49:25] Keine Schaunotizen Drag & Drop für Dateien Peter beschreibt eine uralte API, mit der man sogar ganz brauchbare Dinge anstellen kann. Erster Teil einer Minireihe. Avoiding anonymous JavaScript funcitons Todd Motto erklärt anonyme Funktionen, deren Nachteil und wie man sie vermeidet. Markdown.js Markdown Parser in JavaScript. Mitsamt Abstract Syntax Tree.
undefined
Jan 30, 2014 • 57min

Revision 155: Sass.js und die Konferenzen 2014

Revision 155 ging zwar ohne Gäste an den Start, dafür war Rodney aber top in Form und erzählt über sein letztes Projekt. Über Kommentare zu den Themen freuen wir uns und beantworten diese (manchmal zeitversetzt). Keine News Schaunotizen [00:00:18] Sass.js Rodney und Sebastian arbeiteten vor kurzer Zeit an einem Port von libsass nach JavaScript mit Emscripten um Sass im Browser kompilieren zu können (zum Beispiel für Services wie Dabblet). libsass ist eine C-Compiler für Sass, der unter anderem auch in node-sass Anwendung findet. Rod erzählt über seine Reise hinab ins C++-Kaninchenloch und weist auf eine Shoptalk Folge mit dem SASS-Erfinder und libsass-Autoren) hin. Fazit: solide C/C++-Kenntnisse sind empfohlen für Emscripten-Experimente [00:29:51] Konferenzen 2014 Auf die Hörerfrage von Malte antworten wir mit einer Liste: Welche Konferenzen sollte man 2014 besuchen, wenn man die Working Draft Crew treffen will? Reasons, London dConstruct, Brighton LXJS, Lissabon JavaScript Days / HTML5 Days, München jQuery Europe, Wien Smashing Conf, Oxford Edge Conf, London Beyond Tellerrand, Düsseldorf Fronteers, Amsterdam dotJS, Paris Diese Woche haben wir nicht am Glücksrad gedreht [00:51:41] Keine Schaunotizen Speaking.io Eine Website, die sich ums Public Speaking dreht und wertvolle Tips für Speaker bereit hält. GistBoxApp GistBoxApp ergänzt gist.github.com mit tagging, suche und weiterem. Also quasi alles Nützliche, was fehlt. Zone.js Execution Context für JavaScript Development. Principles for making things for the web Eine Zusammenstellung an Richtlinien, die man beachten sollte, wenn man fürs Web entwickelt.
undefined
Jan 22, 2014 • 51min

Revision 154: Vagrant und Clientside JavaScript Error Reporting

Die Stammbesetzung von Schepp, Peter, Hans und Stefan durfte in der aktuellen Revision Frederic Hemberger als Gast begrüßen, um uns über die unterschiedlichen Use Cases von Vagrant zu informieren. Spontan stieß auch noch unser treuer Hörer Marius hinzu, der ebenfalls in die Lobeshymnen einstimmte. Schaunotizen [00:01:03] Vagrant – Development environments made easy Die Entwicklungsumgebung braucht Java, man will sich die eigene Maschine aber nicht versauen? PHP in einer Uraltversion gefordert, die man lokal nicht mehr zum Laufen kriegt? Oder einfach zwischen den Kollegen die gleichen Rahmenparameter für die Entwicklung herstellen? Mit Vagrant alles kein Problem. Frederic und Stefan sind seit längerem Fan des Commandline Tools, welches das Aufsetzen, Steuern und Konfigurieren von virtuellen (Linux-)Maschinen kinderleicht und versionierbar macht. Die beiden machen — unterstützt von Marius — dem Rest der Truppe die Vor- und Nachteile an einigen Beispielen schmackhaft und sprechen vom ultimativen Test- und Reproduzierbarkeitsnirvana. Wer auf den Geschmack gekommen ist und mehr als Ubuntu braucht, wird übrigens auf Vagrantbox.es fündig. WordPressentwickler sollten sich VagrantPress genauer ansehehn. [00:20:30] Clientside JavaScript Error Reporting Die Hörerfrage von Marius wurde nicht nur über Twitter, sondern auch gleich live in der Sendung vom Fragesteller persönlich eingeworfen: Welche client-seitigen Fehlerreporting Tools verwenden wir eigentlich, und welche Dienste sind uns da am geläufigsten? Frederic schwört auf eine eigene Lösung, bestehend aus ca. 60 Zeilen Code, die ihm beim Ermitteln von Edge Cases schon einige Male enorm geholfen hat. Außerdem gab Paul Irish auf Google Plus einen guten Überblick über geläufige Services. [00:30:48] Glücksrad Application Cache Der Application Cache war als Offlinemechanismus eine durchaus ambitionierte Angelegenheit, ging bei uns aber nie über den Demostatus hinaus. Wir erörtern die Gründe und geben auch Positivbeispiele. Erwähnung findet auch Frederics Manifest Validator und ein Blick in die Zukunft mit Service Workern. [00:40:10] Keine Schaunotizen 10 Reasons we switched from an icon font to SVG Icon Fonts sind toll, haben aber ein paar Nachteile, die für die Autoren des Artikels Grund genug waren komplett auf SVG zu wechseln. How to measure Frontend Performance with Phantomas and Grunt Die 4Waisenkinder erzählen uns wie man Frontend Performance mit Phantomas und Automatisierungstools wie Grunt hervorragend messen kann. Slip Listen, die auf unterschiedliche Gesten unterschiedlich reagieren, gibt’s bei Pornels Slip. Accessibility Tools Frederic wirft drei hervorragende Accessibility Tools ins Rennen: Eine Chrome Extension nebst anschaulichen Lintern bei AccessLint und WAVE. Manageable Sass Components Wer mit Bower und Sass Komponenten arbeitet bzw. solche sogar entwickelt, kann in dieser Ode an das !default Flag erkennen, wie man diese für Außenstehende konfigurierbar macht. Kod.io Linz Stefans Wahlheimatstadt Linz bekommt eine Entwicklerkonferenz. Eine einmalige Gelegenheit mit einem ansehnlichen Line-Up, auch für Frontend Entwickler. I Want To Use Irgendein modernes Browserfeature erwünscht? Nicht sicher ob das alle mobilen Devices auch können? „On mobile, I want to use“ gibt Aufschluss. Donate your dusty device Die Open Device Labs der Welt fordern auf, euer ranziges Smartphone für den guten Testzweck zu spenden. Finden wir unterstützenswert! [00:49:22] Der Tipp der Woche Option-Key + Click Man lernt eben nie aus: Im OS Terminal kann man bei gedrücktem Option Key und einem Klick die Cursorposition ändern. Enorm hilfreich bei langen Commandline-Befehlen.
undefined
Jan 19, 2014 • 53min

Revision 153: Typecsset und die Web Speech API

Zu viert machten wir uns diese Woche auf in die Sendung. Mit von der Partie war als Gast Sebastian Golasch. Keine News Schaunotizen [00:00:25] Typecsset Harry Roberts beschreibt in seinem Artikel Single-direction margin declarations die Vorzüge, margins für Elemente nur in eine Richtung zu verwenden und entwickelt mit Typecsset die passende Library um vertikalen Rhythmus innerhalb einer Seite zu nutzen. Stefan benutzt ein solches Tool, der Rest allerdings noch nicht. Rod und Sebastian kennen bestenfalls Grid Backgrounds (oder auch per Tool). Die Vorteile von Typecsset sind vor allem im Zusammenspiel mit ausgefeilten Designs nicht von der Hand zu weisen. [00:10:46] Web Speech API Mit der Web Speech API lässt sich Sprache in Text umwandeln. Supported wird das Ganze in verschiedenen Sprachen per Google Translate. Aber gerade das ist auch das Manko: Bisher supported nur Google Chrome die API. [00:26:05] Glücksrad Drag ’n‘ Drop Die Drag and Drop API ist quasi in allen Browsern verfügbar. Mittels Progressive Enhancement lässt sich DnD ziemlich einfach für alle Web-Anwendungen, zum Beispiel für File-Uploads, umsetzen. [00:41:21] Keine Schaunotizen Google Analytics für GitHub Mit GA Beacon lässt sich Google Analytics leicht in jedes GitHub-Projekt integrieren. Mittlerweile werden Statistiken auch direkt von GitHub unterstützt. CSS Architecture Ein gutes Wrap-up zum Thema CSS Architektur und Theorien im Allgemeinen. Ocrad.js Ocrad.js ist ein OCR (Optical Character Recognition) Tool, dass mit Emscripten nach JavaScript konvertiert wurde und gescannte Texte in richtigen Text umwandeln kann. Gulp is the new black Eine Einführung in Gulp und die Theorien mit denen Gulp sich beschäftigt. Getting started with Bower Für alle, die noch nicht mit einem Package-Manager im Front-End arbeiten hier eine Einführung in Bower. Endangered species of the web: The Link Christian Heilmann philosophiert darüber, dass Links zu oft missbraucht werden und propagiert man solle sich auf die eigentliche Aufgabe von Links zurückbesinnen. Unify Unify ist ein Tool um den Browser-support von einzelnen Unicode-Zeichen zu überprüfen. Web Color Palette Die Entwickler von Web Color Palette wünschen sich eine neue, verbesserte Color Palette fürs Internet und geben ein schönes Beispiel vor, wie die Standardfarben und dazu gehörende Color-Codes besser gewählt sein können.

The AI-powered Podcast Player

Save insights by tapping your headphones, chat with episodes, discover the best highlights - and more!
App store bannerPlay store banner
Get the app