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…
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…
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…
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…
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…
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…
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…
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…
API-based solutions are becoming a critical building block of modern digital products. What are they? How can they impact your design process? Finally, how to evaluate them without bothering your software team? The growing amount of data and the need for speed in building products pushed APIs to become the lingua franca of digital teams. To design systems based on API-first systems, make sure you understand the vendors’ offerings. Today, Michał Sędzielewski brings you this hands-on testing guide which is a good starting point in doing so. It will help you explore the API capabilities even before you throw it to your teaching team, saving their energy — and yours as well.
Read more…
HTML5 introduced thirteen new types of form input, adding significantly to the number of different fields web designers and developers could add to our forms. These new types all require browsers to support them, and take-up has been slower than some of us would have liked. What is the state of those field types in 2019? Which can we use, and which should still be avoided?
Read more…