---
title: "This Week's HTML5 and Browser Technology News (Issue 213)"
publication: "Frontend Focus"
issue: 213
published_at: "2015-11-04"
canonical_url: "https://frontendfoc.us/issues/213"
---

This Week's HTML5 and Browser Technology News (Issue 213)

[Read this e-mail on the Web](http://frontendfoc.us/issues/213)

Frontend FocusIssue 213 — November 4, 2015[HTML5 on the Rise: No Longer Ahead Of Its Time](http://techcrunch.com/2015/10/28/html5-on-the-rise-no-longer-ahead-of-its-time/?utm_source=frontendfocus&utm_medium=email) ‘Today marks the anniversary of the World Wide Web Consortium (W3C) declaring the HTML5 standard complete’ and other reflections on HTML5’s maturity.  TechCrunch 
[Flexbox For Interfaces All The Way](http://www.smashingmagazine.com/2015/11/flexbox-interfaces-tracks-case-study/?utm_source=frontendfocus&utm_medium=email) A look at how a webapp leant on layout patterns well suited to the Flexible Box Layout (flexbox) system now supported by most browsers.  Smashing Magazine 
[DevTools Challenger: Explore Firefox's Animation Tools](http://devtoolschallenger.com/?utm_source=frontendfocus&utm_medium=email) Some hands-on exercises with all of Firefox’s new visual design tools. Fun stuff.  Firefox 
[![Frontend Masters\](https://copm.s3.amazonaws.com/579770c6.jpg)](https://frontendmasters.com/workshops/algorithms-data-structures-js/?utm_source=frontendfocus&utm_medium=email)[4-Day Workshop: Algorithms and Data Structures in JavaScript](https://frontendmasters.com/workshops/algorithms-data-structures-js/?utm_source=frontendfocus&utm_medium=email)This is a practical class for students who are very comfortable with the JavaScript language but want to level up on their Data Structures and Algorithms knowledge.
_[Join us Nov 17-20th](https://frontendmasters.com/workshops/algorithms-data-structures-js/) online or in-person._ Frontend MastersSponsor
[The Front-End Handbook](http://www.frontendhandbook.com/?utm_source=frontendfocus&utm_medium=email) Telerik’s Cody Lindley has produced a guide for ‘anyone to learn the practice of front-end development’ made up of brief insights and curated links.  Cody Lindley 
[ResponsiveVoice.js: Cross-Platform Text-to-Speech](http://responsivevoice.org/?utm_source=frontendfocus&utm_medium=email) Designed to add voice features to sites and apps across all major platforms. It supports 51 languages and has no dependencies. We had a lot of fun playing with this, but be aware of the licensing.  Learnbrite 
[The Image Replacement Museum](https://css-tricks.com/the-image-replacement-museum/?utm_source=frontendfocus&utm_medium=email) CSS image replacement is the technique of replacing a text element with an image. This post looks at the long line of techniques that have been used to implement it over the years.  Marie Mosley 
[The Simple Way to Scrape an HTML Table: Google Docs](https://eagereyes.org/data/scrape-tables-using-google-docs?utm_source=frontendfocus&utm_medium=email) Google Docs supports pulling in HTML table into a spreadsheet using a single `=ImportHtml` expression.  Robert Kosara 
[So How Does The Browser Actually Render A Website?](http://www.thecssninja.com/browser/jsconfeu15?utm_source=frontendfocus&utm_medium=email) A 30 minute talk from JSConf EU 2015 coupled with slides.  Ryan Seddon 


Jobs [![Supported by Hired.com\](http://s3.cooperpress.com.s3.amazonaws.com/hired1.png)](https://hired.com/join/?utm_source=petercooperpress&utm_medium=sponsor&utm_campaign=%28b2c%29%28l-all%29%28r-swe%29%28q2-17-frontend-focus%29&utm_content=newsletter)

- [Want to spend less time job searching? Apply to the best startups in 60 seconds.](https://underdog.io/?utm_source=newsletters&utm_medium=html5weekly&utm_content=spendlesstime&utm_campaign=q4_15)If you’re accepted, startup decision-makers will email you as soon as next Monday. You decide where to interview and where to work. Now open in SF, NYC, and remote. Join the Underdog.io platform today! Underdog.io

Can't find the right job? Want companies to apply to _you?_ [Try Hired.com.](https://hired.com/?utm_source=newsletters&utm_medium=petercooperpress&utm_term=cat-tech-frontend&utm_campaign=q2-17-frontend)

In Brief

['The HTML5 spec has 609,160 words in it. That's longer than Infinite Jest.'](https://twitter.com/waxpancake/status/661601979198672896?utm_source=frontendfocus&utm_medium=email) news
Paul Ford

[Goo Create Adds Support for Bringing HTML into WebGL Scenes](http://goocreate.com/blog/1168/put-html-in-your-webgl/?utm_source=frontendfocus&utm_medium=email) news tools 
If you thought you included WebGL in an HTML document, well.. now think about including HTML documents inside your WebGL scenes as well..
Goo Create

[How Google’s AMP Project Speeds Up The Web - by Sandblasting HTML](http://arstechnica.com/information-technology/2015/11/googles-amp-an-internet-giant-tackles-the-old-myth-of-the-web-is-too-slow/?utm_source=frontendfocus&utm_medium=email) news
Ars Technica

[Which Input When?](http://morgancarter.com.au/design-solutions/which-input-when/?utm_source=frontendfocus&utm_medium=email) tutorial 
A look at which form input types to use in certain contexts.
Morgan Carter

[Animating the `content` Property](https://css-tricks.com/animating-the-content-property/?utm_source=frontendfocus&utm_medium=email) tutorial
Robin Rendle

[How to connect to a MySQL database with JavaScript](http://blog.dreamfactory.com/how-to-connect-to-a-mysql-database-with-javascript?utm_source=html5_weekly&utm_medium=newsletter&utm_campaign=connect) tutorial 
With the DreamFactory REST API platform, database connections for web apps are a breeze. In this tutorial, we lay out how to build a simple address book with MySQL, DreamFactory, and JavaScript.
DreamFactorySponsor

[How To Style and Position SVG Text With The tspan Element](http://vanseodesign.com/web-design/svg-text-tspan-element/?utm_source=frontendfocus&utm_medium=email) tutorial
Steven Bradley

[Your First Offline Web App](https://developers.google.com/web/fundamentals/getting-started/your-first-offline-web-app/?utm_source=frontendfocus&utm_medium=email) featured 
Learn how to integrate a service worker into an existing application to make it work offline.
Google Developers

[Bouncing Ball Game using HTML5 Canvas Element - Part 1](http://www.codingdefined.com/2015/10/bouncing-ball-game-using-html5-canvas.html?utm_source=frontendfocus&utm_medium=email) tutorial
Hemant Joshi

[Three Years with CSS Grid Layout](https://rachelandrew.co.uk/archives/2015/11/03/three-years-with-css-grid-layout/?utm_source=frontendfocus&utm_medium=email) opinion
Rachel Andrew

[Why Static Website Generators Are The Next Big Thing](http://www.smashingmagazine.com/2015/11/modern-static-website-generators-next-big-thing/?utm_source=frontendfocus&utm_medium=email) opinion tools
Smashing Magazine

[img2css: Convert Any Image to A Pure CSS Image](https://github.com/javierbyte/img2css?utm_source=frontendfocus&utm_medium=email) tools 
A tool that converts an image into an element with a colored CSS shadow for every pixel. Beware - this gets highly inefficient with images that aren’t small.
Javier Bórquez

[canvid.js: Tiny Library to Play 'Videos' on Canvas Elements](http://gka.github.io/canvid/?utm_source=frontendfocus&utm_medium=email) code 
Essentially plays many small JPEG frames. Helps get around autoplay restrictions of videos.

[Gendy.js: A Module for Dynamic Stochastic Web Audio Synthesis](http://abbernie.github.io/gendy/?utm_source=frontendfocus&utm_medium=email) code
Andrew Bernstein and Ben Taylor

[Discover 52 tips to improve your .NET performance](http://www.red-gate.com/products/dotnet-development/ants-performance-profiler/entrypage/52-net-performance-tips?utm_source=html5weekly&utm_medium=displayemail&utm_content=52_net_tips&utm_campaign=antsperformanceprofiler&utm_term=email-24154) rawurl 
Our new eBook features dozens of tips and tricks to boost your .NET performance. [Download your free copy.](http://www.red-gate.com/products/dotnet-development/ants-performance-profiler/entrypage/52-net-performance-tips?utm_source=html5weekly=displayemail=52_net_tips=antsperformanceprofiler=email-24154)
antsperformanceprofilerSponsor

[Google Web Font Inspiration in HTML and CSS](http://tobiasahlin.com/typesource/?utm_source=frontendfocus&utm_medium=email) demo
Tobias Ahlin

[WebGL-powered Starmap for Star Citizen](https://robertsspaceindustries.com/starmap?utm_source=frontendfocus&utm_medium=email) demo 
A beautiful use of WebGL, based on a forthcoming space game by the creator of _Wing Commander._
Roberts Space Industries

Curated by [Peter Cooper](http://twitter.com/peterc) and [Chris Brandrick](http://twitter.com/chrisbrandrick) and published by [Cooperpress](https://cooperpress.com/).

[Stop getting FrontEnd Focus](*|UNSUB|*) : [Change email address](*|UPDATE_PROFILE|*) : [Read this issue on the Web](http://frontendfoc.us/issues/213)

Cooper Press Ltd. Office 30, Lincoln Way, Louth, LN11 0LS, UK
