---
title: "This Week's HTML5, CSS and Browser Tech News #262"
publication: "Frontend Focus"
issue: 262
published_at: "2016-10-19"
canonical_url: "https://frontendfoc.us/issues/262"
---
This Week's HTML5, CSS and Browser Tech News #262
[Read this e-mail on the Web](http://frontendfoc.us/issues/262)
Frontend FocusIssue 262 — October 19, 2016[What's New For Developers in Chrome 54](https://developers.google.com/web/updates/2016/10/nic54?utm_source=frontendfocus&utm_medium=email)Chrome 54, now on the stable release channel, includes support for Custom Elements v1, the BroadcastChannel API, and an origin trial of foreign fetch. Google Developers
[Progressive Enhancement Isn’t Dead, But It Smells Funny](https://nolanlawson.com/2016/10/13/progressive-enhancement-isnt-dead-but-it-smells-funny/?utm_source=frontendfocus&utm_medium=email)Nolan argues that the ‘HTML-first’ approach to progressive enhancement (i.e. without JS) fits a narrow view that may no longer be applicable to the modern web. Nolan Lawson
[Polymer Summit 2016: Recordings of All Talks Now Available](https://www.youtube.com/playlist?list=PLNYkxOF6rcICc687SxHQRuo9TVNOJelSZ)Catch up now on Polymer Summit 2016, including a look at [how to upgrade to Polymer 2.0](https://www.youtube.com/watch?v=iI3G-tzbC_Q&index=10&list=PLNYkxOF6rcICc687SxHQRuo9TVNOJelSZ), an [under the hood look at Polymer 2.0](https://www.youtube.com/watch?v=iJ9hS54BRag&index=8&list=PLNYkxOF6rcICc687SxHQRuo9TVNOJelSZ), and a [fun live coding demo](https://www.youtube.com/watch?v=r94IxRRKR0A&index=38&list=PLNYkxOF6rcICc687SxHQRuo9TVNOJelSZ) (yes, this is a fantastic session). Google
[](https://frontendmasters.com/workshops/intro-react-2/?utm_source=frontendfocus&utm_medium=email)[Updated Workshop: Complete Intro to React (w/Router v4, Jest & more)](https://frontendmasters.com/workshops/intro-react-2/?utm_source=frontendfocus&utm_medium=email)Brian Holt (Netflix) introduces you to React plus surrounding ecosystem including: Redux, React Router v4, Jest for testing, Webpack 2, Yarn and more. Frontend MastersSponsor
[Hyperform: Capture Form Validation Back From The Browser](https://hyperform.js.org/?utm_source=frontendfocus&utm_medium=email)A JavaScript implementation of the full HTML5 form validation and constraints API that replaces or polyfills the browser’s native methods. Kinetiqa
[How the Web Became Unreadable](https://backchannel.com/how-the-web-became-unreadable-a781ddc711b6?utm_source=frontendfocus&utm_medium=email)_“We should be able to build a baseline structure of text in a way that works for most users, regardless of their eyesight. So, as a physicist by training, I started looking for something measurable.”_ Kevin Marks
[11 Interesting Web Browsers (That Aren't Chrome)](https://medium.com/statuscode/11-interesting-web-browsers-that-arent-chrome-a3f976752b21?utm_source=frontendfocus&utm_medium=email)A quick look at some less popular browsers with unique approaches, such as Brave, Ulli, and Blisk. Chris Brandrick
[Measuring The Impact of Autofill on Your Forms](https://paul.kinlan.me/detecting-when-autofill-happens/?utm_source=frontendfocus&utm_medium=email)How to detect when a browser ‘autocomplete’ occurs so that the impact of autofill on forms can be measured. Paul argues that autocomplete is a net-positive for users and businesses. Paul Kinlan
[Building a Website Performance Monitor](https://css-tricks.com/building-website-performance-monitor/?utm_source=frontendfocus&utm_medium=email)How Eduardo Bouças built [SpeedTracker](https://speedtracker.org/), an open-source service that runs on top of WebPageTest to build up and visualize web page performance metrics over time. CSS Tricks
Jobs [](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)
- [Senior Web Developer (Minnesota, USA)](http://plaud.it/2dzy3Qh?utm_source=frontendfocus&utm_medium=email)We're seeking a dev who loves creating polished web experiences. The right candidate needs the skills to create smooth animations, and an ability to make artistic decisions, turning static designs into interactive interfaces. Plaudit
- [Find Your Perfect Fit - Try Hired](http://hired.com/?utm_source=newsletters&utm_medium=petercooperpress&utm_campaign=q4-16-frontendfocus)Finding the right role can be daunting, but not on Hired. Get empowered to find the right role with multiple job offers and free personalized support. Hired
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
[Introducing Chrome Canary for Android](https://blog.chromium.org/2016/10/canary-channel-for-chrome-on-android.html?utm_source=frontendfocus&utm_medium=email) news
Google
[Chrome Dev Summit 2016](https://developer.chrome.com/devsummit?utm_source=frontendfocus&utm_medium=email) news
Chrome Dev Summit 2016 will take place at the SFJAZZ Center in San Francisco, CA on November 10-11. Join Chrome VP Darin Fisher for two full days of announcements and talks from the Chrome team. Register now with code `FRONTENDFOCUS`
Google Inc.Sponsor
[How To Build Honest UIs And Help Users Make Better Decisions](https://www.smashingmagazine.com/2016/10/how-to-build-honest-uis-and-help-users-make-better-decisions/?ref=webdesignernews.com) tutorial
Smashing Magazine
[How to Read Web Specs Part I – Or: WebVR, How Do You Work?](https://surma.link/things/reading-specs/?utm_source=frontendfocus&utm_medium=email) tutorial
A look at the WebVR API spec in its current form, and how to navigate and “parse” it for yourself.
Surma
[A Pure CSS Content Filter](http://csswizardry.com/2016/10/pure-css-content-filter/?utm_source=frontendfocus&utm_medium=email) tutorial
Harry Roberts
[Change The Styles on Autocompleted Fields in WebKit Browsers](https://css-tricks.com/snippets/css/change-autocomplete-styles-webkit-browsers/?utm_source=frontendfocus&utm_medium=email) tutorial
Use the `-webkit-autofill` pseudo-selector to target those fields and style them.
Geoff Graham
[Introduction to SVG Animation](https://www.oreilly.com/learning/introduction-to-svg-animation?utm_source=frontendfocus&utm_medium=email) tutorial
Why animating SVG is different from animating in CSS, and some hiccups you might experience.
Sarah Drasner
[Magic Randomisation in CSS with nth-child and Cicada Principle](http://www.lottejackson.com/learning/nth-child-cicada-principle?utm_source=frontendfocus&utm_medium=email) tutorial
Charlotte Jackson
[How Different Types of HTML Form Fields Handle Invalid Values](https://www.raymondcamden.com/2016/10/04/til-form-fields-and-invalid-values?utm_source=frontendfocus&utm_medium=email) tutorial
Raymond Camden
[SVG and Media Queries](https://jakearchibald.com/2016/svg-media-queries/?utm_source=frontendfocus&utm_medium=email) tutorial
_One of the great things about SVG is you can use media queries to add responsiveness to images_
Jake Archibald
[Understanding the SVG viewBox](https://thenewcode.com/1151/Understanding-the-SVG-viewBox?utm_source=frontendfocus&utm_medium=email) tutorial
Dudley Storey
[How to Make HTML Disappear Completely](https://medium.freecodecamp.com/how-to-disappear-completely-2f23ddb14835?utm_source=frontendfocus&utm_medium=email) tutorial
How to make HTML elements invisible by hiding them, making them transparent, or moving them off screen.
Quincy Larson
[Autodeploying Angular Applications to AWS OpsWorks](http://corgibytes.com/blog/2016/10/11/autodeploy-angular-apps-to-opsworks/?utm_source=frontendfocus&utm_medium=email) tutorial
Amazon OpsWorks is an excellent, low-cost option for Platform-as-a-Service hosting. Follow these step-by-step instructions.
CorgibytesSponsor
[The CSS 'quotes' Property](https://www.sitepoint.com/atoz-css-screencast-quotes/?utm_source=frontendfocus&utm_medium=email) video
Not often seen or used, but useful nonetheless.
Guy Routledge
[Laying Out The Future with Grid and Flexbox](https://www.youtube.com/watch?v=ibeF6rbzD70) video
_25 minutes._
Rachel Andrew
[Dos and Don'ts on Designing for Accessibility](https://accessibility.blog.gov.uk/2016/09/02/dos-and-donts-on-designing-for-accessibility/?utm_source=frontendfocus&utm_medium=email) opinion
A handy set of posters you could print out for your office.
Karwai Pun
[Current State of HTML5 Game Development in 2016](http://js-kongress.de/current-state-html5-game-development-2016/?utm_source=frontendfocus&utm_medium=email) opinion
Andrzej Mazur
[8 Simple Rules for a Robust, Scalable CSS Architecture](https://github.com/jareware/css-architecture?utm_source=frontendfocus&utm_medium=email) opinion
Jarno Rantanen
[14 SVG Charting Libraries](http://mediatemple.net/blog/tips/svg-charting-libraries/?utm_source=frontendfocus&utm_medium=email) tools
Chris Coyier
[Swip: A Library to Create Multi Device Experiments](https://github.com/paulsonnentag/swip?utm_source=frontendfocus&utm_medium=email) tools
Expand canvases or active Web page space across multiple device screens placed next to each other.
Paul Sonnentag
[Pure CSS Minesweeper in Fewer than 400 Lines of Sass](http://codepen.io/bali_balo/pen/BLJONk?utm_source=frontendfocus&utm_medium=email) demo
Bali Balo
[Meshi the CSS Dog: A Cute CSS Only Animation on Codepen](http://codepen.io/davidkpiano/pen/kkpGWj?utm_source=frontendfocus&utm_medium=email) demo
David Khourshid
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/262)
Cooper Press Ltd. Office 30, Lincoln Way, Louth, LN11 0LS, UK