CategoryBrowsers

April 8, 2019 — We talk a lot about Flexbox and CSS Grid Layout, but these layout methods are essentially values of the CSS display property, a workhorse of a property that doesn’t get a lot of attention. Rachel Andrew takes a better look in a short series. Rachel is going to take a look at the way that the values of display are defined in the Level 3 specification. This is a change to how we defined display in earlier versions of CSS. While it may seem unusual at first, we think these changes really help to explain what is going on when we change the value of display on an element. Read more…

April 5, 2019 — WebAssembly is a new language that runs in the browser alongside JavaScript. In this article, Robert Aboukhalil explores how you can speed up web applications by replacing slow JavaScript calculations with compiled WebAssembly. This is a case study on using WebAssembly to speed up a data analysis web tool. To that end, Robert will take an existing tool written in C that performs the same computations, compile it to WebAssembly, and use it to replace slow JavaScript calculations. Read more…

March 28, 2019 — There are a few ways to align elements in CSS. In this article, Rachel Andrew explains what they are with some tips to help you remember which to use and why. She will take a look at the different alignment methods. Instead of providing a comprehensive guide to each, Rachel explain a few of the sticking points people have and point to more complete references for the properties and values. You can go a long way by understanding the fundamental things about how the methods behave, and then need a place to go look up the finer details in terms of how you achieve the precise layout that you want. Read more…

March 21, 2019 — Voice Assistants are on their way into people’s homes, wrists, and pockets. That means that some of our content will be spoken out loud with the help of digital speech synthesis. The web isn’t just passive text on a screen anymore. Web editors and UX designers have to get accustomed to making content and services that should be spoken out loud. In this tutorial, Knut Malvær will show you how to make a What You Get Is What You Hear (WYGIWYH) editor for speech synthesis using Sanity.io’s editor for Portable Text. Read more…

March 19, 2019 — IE8 was released a decade ago today. In this article, Chris Ashton tries it out against the modern web, and considers how we can build our sites to last. He will show you how to use the web under various constraints, representing a given demographic of user. We hope to raise the profile of difficulties faced by real people, which are avoidable if we design and develop in a way that is sympathetic to their needs. Read more…

March 11, 2019 — The CSS Working Group have designed an aspect ratio unit for CSS. While this isn’t in browsers yet, in this article Rachel Andrew takes a look at the process of designing a new sizing method and explains how it will work. This is a new resolution, so we have no browser implementations yet, but Rachel thought it would be worth writing up the proposal in case anyone in the wider web community could see a showstopping issue with it. It also gives something of an insight into the work of the CSSWG and how issues like this are discussed, and new features designed. Read more…

February 27, 2019 — Rachel Andrew has been digging around in the CSS Fragmentation spec, and finding browser support is somewhat fragmented. In this article, she explains what fragmentation is, why you might want to use it, and what the state of browser support is. She’ll also show you the current state of browser support and some of the things you can do to get it working as well as it can in your multicol and print projects. Read more…

February 13, 2019 — With Progressive Web Apps, you can now use the web to build full-blown apps. Thanks to an enormous amount of new specifications and features, we can do things with the web that you used to need to write native apps for. However, talking to hardware devices was still a bridge too far up till now. Today, Niels Leenheer will introduce you to WebBluetooth. Thanks to this tool, we can now build PWAs that can control your lights, drive a car or even control a drone. Read more…

February 8, 2019 — Regular expressions have been part of the JavaScript language since the third edition of the ECMAScript standard, which was introduced in 1999. ECMAScript 2018 (or ES2018 for short) is the ninth edition of the standard and further improves the text processing capability of JavaScript. If you have ever done any sort of sophisticated text processing and manipulation in JavaScript, you’ll appreciate the new features introduced in ES2018. In this article, Faraz Kelhini is going to take a good look at how the ninth edition of the standard improves the text processing capability of JavaScript. Read more…

February 4, 2019 — It can be frustrating when you want to use a feature and discover that it is not supported or behaves differently across browsers. Dealing with old browsers — or browsers which do not support something that we want to use — is part of the job of a web developer. That said, things are far better now than in the past. In this article, Rachel Andrew details the different types of browser support issues, and shows how CSS is evolving to make it easier to deal with them. Read more…