---
title: "This Week's HTML5 and Browser Technology News (Issue 230)"
publication: "Frontend Focus"
issue: 230
published_at: "2016-03-09"
canonical_url: "https://frontendfoc.us/issues/230"
---
This Week's HTML5 and Browser Technology News (Issue 230)
[Read this e-mail on the Web](http://frontendfoc.us/issues/230)
Frontend FocusIssue 230 — March 9, 2016
This week I'm on site at O'Reilly Fluent in San Francisco, so if you're here, come say hi in the Community Lounge. I can give you some of our entirely-for-fun HTML6 (no, HTML6 isn't real) and CSS4 (ditto) stickers to future proof your laptop :-)
_- Peter Cooper, Editor_[How to Create a Text-to-Speech Chrome Extension](http://www.sitepoint.com/create-text-to-speech-chrome-extension/?utm_source=frontendfocus&utm_medium=email) A succinct look at creating a Chrome extension that uses the Web Speech API to read out content upon the user’s request. Ivan Dimov
[An Introduction to the Web Bluetooth API](https://dev.opera.com/articles/web-bluetooth-intro/?utm_source=frontendfocus&utm_medium=email) A look at the potential for communicating with Bluetooth Low Energy (BLE) devices from the Web browser. It’s a pretty elegant, promise-based API. Shwetank Dixit
[Balloon.css: CSS Tooltips for HTML Elements](http://kazzkiq.github.io/balloon.css/?utm_source=frontendfocus&utm_medium=email) Uses special `data-` attributes for its settings, but has no reliance upon JavaScript at all. The [code](https://github.com/kazzkiq/balloon.css/blob/master/balloon.css) is tidy and clever. Claudio Holanda
[](http://wijmo.com/products/wijmo-5/?utm_source=HTML%20Weekly&utm_medium=newsletter%20primary&utm_content=3.09.Wijmo5%2BAngualr_Support&utm_campaign=Wijmo%205)[New-Generation of JavaScript/HTML5 Controls Written in TypeScript](http://wijmo.com/products/wijmo-5/?utm_source=HTML%20Weekly&utm_medium=newsletter%20primary&utm_content=3.09.Wijmo5%2BAngualr_Support&utm_campaign=Wijmo%205)With touch-first design, and full AngularJS support, Wijmo's FlexGrid and chart controls focus on top performance and zero dependencies. Wijmo's flexible API provides users an easy, enjoyable way to get what they need done. Build enterprise apps with Wijmo 5. [Learn more.](http://wijmo.com/products/wijmo-5/?utm_source=HTML%20Weekly=newsletter%20primary=3.09.Wijmo5%2BAngular_Support=Wijmo%205) WijmoSponsor
[Can You Replace Your PNGs with SVGs?](http://www.sitepoint.com/can-svg-save-fat-png-32s/?utm_source=frontendfocus&utm_medium=email) A look at a tool, ZorroSVG, that can convert transparent PNG32 files into smaller SVGs (containing a JPEG and a alpha mask) that will work in modern browsers. SitePoint
[Exploring the Web Audio API with D3](http://blog.scottlogic.com/2016/01/06/audio-api-with-d3.html?utm_source=frontendfocus&utm_medium=email) An introduction to the possibilities of visualizing audio manipulated with the Web Audio API using D3, the data visualization library. William Ferguson
[A Look at New Features in Chrome 49 (video)](https://www.youtube.com/watch?v=GNP-_ncY3ZA=PLNYkxOF6rcIDfz8XEA3loxY32tYh7CI3m=1) 49 adds support for custom CSS properties. Service Workers become more powerful with the ability to reliably send data with background sync. And the ‘save-data’ client hint header lets you deliver faster pages to users who want them. YouTube
[A CSS Multi-Column Layout Tutorial for Beginners](http://www.sitepoint.com/css-multi-column-layout-tutorial-for-beginners/?utm_source=frontendfocus&utm_medium=email) I think you need to be careful where you use multi-column layouts for text, but this is an introduction to doing it in most modern browsers. SitePoint
[Is Microsoft Changing The Game for Accessible Browsers?](https://www.abilitynet.org.uk/blog/microsoft-changing-game-accessible-browsers?utm_source=frontendfocus&utm_medium=email) A raft of new internet accessibility work by Microsoft will make the web user-experience for people with disabilities far smoother and more sophisticated. AbilityNet
[Resources For More Meaningful Web Typography](https://www.smashingmagazine.com/2016/03/meaningful-web-typography/?utm_source=frontendfocus&utm_medium=email) Cosima Mielke takes a quick look at a variety of ways to improve your Web typography and improve your readers’ reading experience. Smashing Magazine
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)
- [Stop Applying to Jobs - Let Companies Apply to You](https://hired.com/?utm_source=newsletters&utm_medium=html5weekly&utm_term=cat-tech-html5&utm_content=stopapplyingtojobs&utm_campaign=q1-16&utm_location=us)On Hired, sign up in 10 minutes and get offers from top companies like Facebook, Uber, Stripe. Engineers get an average of 5 offers on the platform in 1 week. Try it today. Hired.com
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
[WebAssembly May Go Live in Browsers This Year](http://www.infoworld.com/article/3040037/javascript/webassembly-may-go-live-in-browsers-this-year.html?utm_source=frontendfocus&utm_medium=email) news
InfoWorld
[CSS Grid Layout in Blink: Current Status and Future Plans](https://groups.google.com/a/chromium.org/d/msg/blink-dev/y221wJxoh84/qU_el0JRAwAJ?utm_source=frontendfocus&utm_medium=email) news
blink-dev
[BugRex: Fix HTML, CSS and JS Bugs with Live Chat](http://www.bugrex.com/?utm_source=frontendfocus&utm_medium=email) news
Begun live as a paid idea, but is now free/volunteer.
[Last chance to join our March UI/UX courses, launching this Friday!](http://trydesignlab.com/a/web-design-course/ad49af1e/?utm_source=html5weekly&utm_medium=email&utm_campaign=march2016) rawurl course
Learn UI UX design through part-time, online courses with 1-on-1 mentorship from expert designers.
DesignlabSponsor
[10 Things to Need to Know About CSS](http://dsheiko.com/weblog/10-things-to-need-to-know-about-css?utm_source=frontendfocus&utm_medium=email) tutorial
Dmitry Sheiko
[Make Right Click on a Logo Show Logo Download Options](https://css-tricks.com/right-click-logo-show-logo-download-options/?utm_source=frontendfocus&utm_medium=email) tutorial
A clever and helpful UX trick.
Chris Coyier
[Fixing the font-weight Problem on Hover States](http://www.sitepoint.com/quick-tip-fixing-font-weight-problem-hover-states/?utm_source=frontendfocus&utm_medium=email) tutorial
Two solutions to font-weight changes causing undesirable text shifts.
George Martsoukos
[CSS-Only Responsive Tables](http://dbushell.com/2016/03/04/css-only-responsive-tables/?utm_source=frontendfocus&utm_medium=email) tutorial
David Bushell
[Building A Real-Time Retrospective Board With Video Chat](https://www.smashingmagazine.com/2016/03/building-a-real-time-retrospective-board-with-video-chat/?utm_source=frontendfocus&utm_medium=email) tutorial
Uses WebRTC, Node and a little jQuery.
Smashing Magazine
[Responsive Typographic Headlines with CSS and JS](http://www.noupe.com/development/perfectly-responsive-typographic-headlines-with-css-and-javascript-96178.html?utm_source=frontendfocus&utm_medium=email) tutorial
A brief look at a variety of techniques and libraries for creating responsive headlines on your pages.
NOUPE
[Trellisheets: How We Spin Up CSS for Trello Sites with Ease](http://tech.trello.com/trellisheets-how-we-spin-up-css-for-trello-sites-with-ease/?utm_source=frontendfocus&utm_medium=email) opinion
Trello
[Bixa Color: The First Chromatic Font for The Web](https://bixacolor.com/?utm_source=frontendfocus&utm_medium=email) tools
The OpenType standard added support for colored glyphs. Only Firefox supports it for now.
Novo Typo
[Font Famous: A Free Vector Logo Font for Showing Off Press Mentions](http://fontfamous.com/?utm_source=frontendfocus&utm_medium=email) tools
Includes logos for the New York Times, Product Hunt, CNN, and more.
Anthony David Adams
[CSS Style Guide Usage Auditing Tool](https://github.com/straker/css-style-guide-audit?utm_source=frontendfocus&utm_medium=email) tools
Audit the CSS on a page to see what elements are using styles from the style guide and which styles are overriding them
Steven Lambert
[CSS Gradient Generator Tool](http://www.css-gradient.com/?utm_source=frontendfocus&utm_medium=email) tools
Stefano Merlo
[LightSwitch: Lightweight HTML5 Single-Page Site using jQuery Templating to Switch Content](https://github.com/kateklemp/lightswitch?utm_source=frontendfocus&utm_medium=email) code
Kate Klemp
[A11y Toggle: For Building Accessible Content Toggling/Toggles](https://github.com/edenspiekermann/a11y-toggle?utm_source=frontendfocus&utm_medium=email) code
Edenspiekermann
[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-24695) 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-24695)
Red Gate SoftwareSponsor
[Exoplanets Visualization with WebGL](http://www.asterank.com/exoplanets?utm_source=frontendfocus&utm_medium=email) demo
Asterank
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/230)
Cooper Press Ltd. Office 30, Lincoln Way, Louth, LN11 0LS, UK