Friday, 20 September, 2019 UTC
Summary
In this week's roundup, the string length of two emojis is not always equal, something to consider before making that rounded button, and we may have a new way to share web apps between devices, even when they are offline.
The JavaScript string length of emoji characters
A single rendered emoji can have a JavaScript string length of up to
7 if it contains additional Unicode scalar values that represent a skin tone modifier, gender specification, and multicolor rendering.(via Henri Sivonen)
An accessibility issue with rounded buttons
Be aware that applying CSS
border-radius to a <button> element reduces the button’s interactive area (“those lost corner pixels are no longer clickable”).You can avoid this accessibility issue in CSS, e.g., by emulating rounded corners via
border-image instead, or by overlaying the button with an absolutely positioned, transparent ::before pseudo-element.(via Tyler Sticka)
Sharing web pages while offline with Bundled Exchanges
Chrome plans to add support for navigation to Bundled Exchanges (part of Web Packaging). A bundled exchangeis a collection of HTTP request/response pairs, and it can be used to bundle a web page and all of its resources.
The browser should be able to parse and verify the bundle’s signature and then navigate to the website represented by the bundle without actually connecting to the site as all the necessary subresources could be served by the bundle.
Kinuko Yasuda from Google has posted a video that demonstrates how Bundled Exchanges enable sharing web pages (e.g., a web game) with other devices while offline.
(via Kinuko Yasuda)
Read even more news in my weekly Sunday issue, which can be delivered to you via email every Monday morning. Visit webplatform.news for more information.
The post Weekly Platform News: Emoji String Length, Issues with Rounded Buttons, Bundled Exchanges appeared first on CSS-Tricks.