An Analysis of Privacy on the App Store – “The top 12 [most data-hungry] apps are all from the same company, Facebook. All of Facebook’s apps collect an ungodly amount of data, the nearest other app is LinkedIn which collects 37 fewer data types.”
Content-visibility and Accessible Semantics “if you’re using content-visibility on sections of content including headings and semantic structure, screen reader users won’t be able to benefit from that structure on load. This unfortunately degrades accessibility in favor of loading performance” by Marcy Sutton. Later update: “Update: lots of great discussion from the Chrome team, who say it shouldn’t have that effect and they’re looking into it.”
Rube Goldberg corner: Introducing Zero-Bundle-Size React Server Components – The React community is finally discovering the advantages of doing heavy lifting on the server instead of doing everything on the client.
Hotwire (“HTML Over The Wire”) is “an alternative approach to building modern web applications without using much JavaScript by sending HTML instead of JSON over the wire.”
Bonus Link o’ The Week: Web Histories – “The Web Histories project is an attempt to document the stories of those who have helped to shape the open web platform, with a focus on those people who are often underrepresented in the formal histories.” by Rachel Andrew
The F-word episode 7 – Leningrad Lothario, Russian roister-doister Vadim spared a moment from his dizzying social life to sit with me and discuss Chrome 88 and the latest web development Grand Unification Proposal (= make it all JSON)
A Comprehensive Guide to Accessible User Research – “Researchers often want to include people with access needs in their studies but don’t know where to begin. This three-part series covers the various considerations for adapting your practice to include people with disabilities.”
Under-Engineered Responsive Tables – “I am just going to show you the bare minimum you need to make a WCAG-compliant responsive HTML table” says Uncle Adrian Roselli: <div role="region" aria-labelledby="Caption01" tabindex="0"> <table>[…]</table> </div>
Welcome to Your Bland New World “The VC community is an increasingly predictable and lookalike bunch that just seems to follow each other around from one trivial idea to another”. Excellent article!
Is Stencil a Better React? by Wix Engineering (a React contributor). “the same JSX as React & some of the same concepts… Compiles to standard web components with optimal performance…Stencil was faster compared to React… also faster compared to Svelte, at least within this use case.”
2020 Affordability Report – “Over a billion people live in the 57 countries in our survey that are yet to meet the UN Broadband Commission’s ‘1 for 2’ affordability threshold. 1GB is the minimum that allows someone to use the internet effectively”
Clean Advertising – an interesting article by Jezza with a bonus useful tip about tigers which I’ll be trying tonight.
The most useful accessibility testing tools and techniques – “Here is a list of tools I regularly use to make sure everything I do is accessible for folks with different abilities, whether they are blind or holding a sandwich in their hand.”
The Mobile Economy: Sub-Saharan Africa – “The mobile phone industry accounted for 9% of sub-Saharan Africa’s collective GDP in 2019 or $155 billion in absolute terms.”
It’s been a while; since the last Reading List! Since then, Vadim Makeev and I recorded episode 6 of The F-Word, our podcast, on Mozilla layoffs, modals and focus, AVIF, AdBlock Plus lawsuit. We also chatted with co-inventor of CSS, Håkon Wium Lie, and Brian Kardell of Igalia about the health of the web ecosystem. Anyway, enough about me. Here’s what I’ve been reading about the web since the last mail.
RNIB: Challenge inaccessible websites with our new toolkit – “We want to make challenging all inaccessible websites a straightforward process so we’ve created a toolkit to support the public in using the Equality Act & the Regulations to call out websites.”
Adobe unveils ambitious multi-year vision for PDF: Introduces Liquid Mode “Liquid Mode uses AI .. to understand and identify parts of a PDF, like headings, paragraphs, images, lists, tables, and more. It also attempts to understand the hierarchy and ordering of those parts to reformat a static PDF into a more dynamic and customizable experience.”
Elements of AI – free course in Artificial Intelligence, from University of Helsinki, translated into all EU languages. “Our goal is to educate 1% of European citizens in the basics of AI”
Giving users and developers more control over focus – Chromium’s focus-visible and Quick Focus Highlight: a user preference that causes the currently focused element to display an indicator for two seconds, regardless of developer’s CSS devilry
Wikipedia Matters (PDF, 48pp) – “a randomized field experiment to
test whether additional content on Wikipedia pages about cities affects tourists’ choices of overnight visits. Our treatment of adding information to Wikipedia increases overnight stays in treated cities compared to non-treated cities”
Mozilla is hiring again after laying off 25% of their staff. It’s interesting to speculate on the new strategy; vacancies include a Strategic Finance Manager running mergers and acquisition, and a Head of Mobile who *must* be in USA, not Asia/ Africa where the action is.
Top 4 Dying Programming Languages of 2020 – “Don’t learn these 4 languages”. Eh? Learn them! You’ll be in demand when those systems need tweaking. I was offered loads of money because I know COBOL & Fortran. So the cool kids don’t talk about them, but they run Business.
we are beautiful – “Our photographer takes photos of volunteers and processes these photos to produce 3D models of their genitals and other body parts. These 3D models are freely available for viewing .. so that you may print them on your own 3D printer”
Intent to Prototype: Customizable <select> Element – “This feature introduces a customizable select HTMLElement, with the working name of <selectmenu>. The element will offer authors full control over its appearance without requiring them to rewrite the model and controller logic underpinning its function.” Exciting work from the Microsoft Edge team.
AVIF has landed – by Jank Architect – AVIF (pronounced [əˈ vif]) is a new image format that seriously outperforms JPG and PNG. Thanks to <picture>, you can use it now for performance wins.
Just how much faster is vanilla JS than frameworks? TL;DR: lots. “If you can get away with just vanilla JS, it will give you the best experience, period.If you need state-based UI, Preact is not just smaller than React, but far more performant, too.”
RFC8890: The Internet is for End Users “when there is a conflict between the interests of end users of the Internet and other parties, IETF decisions should favor end users”. The author of this RFC, Mark Nottingham, blogs about why it is necessary to state this.
Algorithmic Colonization of Africa “Not only is Western-developed AI unfit for African problems, the West’s algorithmic invasion simultaneously impoverishes development of local products while also leaving the continent dependent on Western software & infrastructure.”
Enabling Custom Control UI – Interesting doc on potential standard to allow styling any arbitrary part of a native form control, add arbitrary content into any part of a native control while retaining native accessibility & browser behaviours.
Mobile devices are too expensive for billions of people — and it’s keeping them offline – Nearly 2.5 billion people live in countries where the cost of the cheapest available smartphone is a quarter or more of the average monthly income. This is equal to the share of monthly income the average European household spends on housing and utilities. In Sierra Leone, the average person needs to save six months’ salary to buy the cheapest available smartphone. In India, home to 18% of the world, the price of the cheapest smartphone from leading operator Jio was 206% of average monthly income.
How to create accessible subtitles – use role=role="doc-subtitle", by Chris Ferdanini. (Why the “doc” prefix? I guess to stop people thinking it’s for video subtitles)
Unholy Albatross – “responsively stack all columns into rows based on container size, without an intermediary step where some of the columns becomes rows but not other” by Xiao Zhuo Jia
Using Chrome to generate more accessible PDFs – “Chrome will automatically generate a tagged PDF when you print a web page and choose the “Save as PDF” destination. Tagged PDFs are more accessible to users with disabilities”
If you don’t know the name Igalia, you’ve still certainly used their code. Igalia is “an open source consultancy specialized in the development of innovative projects and solutions”, which tells you very little, but they’ve been involved in adding many features to the open-source browsers (which is now all browsers) such as MathML and CSS Grid.
One of their new initiatives is very exciting, called Open Prioritisation (I refuse to mis-spell it with a “z”). The successful campaign to support Yoav Weiss adding the <picture> element and friends to Blink and WebKit showed that web developers would contribute towards crowdfunding new browser features, so Igalia are running an experiment to get the diverse interests and needs of the web develoment community to prioritise which new features should be added to the web platform.
They’ve identified some possible new features that are “shovel-ready”—that is, they’re fully specified and ready to be worked on, and the Powers That Be who decide what gets upstreamed and shipped are supportive of their inclusion. Igalia says,
Igalia is offering 6 possible items which we could do to improve the commons with open community support, as well as what that would cost. All you need to do is pledge to the ‘pledged collective’ stating that if we ran such a campaign you’re likely to contribute some dollars. If one of these reaches its goal in pledges, we will announce that and begin the second stage. The second stage is about actually running the funding campaign as a collective investment.
I think this is a brilliant idea and will be pledging some of my pounds (if they are worth anything after Brexit). Can I humbly suggest that you consider doing so, too? If you can’t, don’t fret (these are uncertain times) but please spread the word. Or if your employer has some sort of Corporate Social Responsibility program, perhaps you might ask them to contribute? After all, the web is a common resource and could use some nurturing by the businesses it enables.
If you’d like to know more, Uncle Brian Kardell explains in a short video. Or (shameless plug!) you can hear Brian discuss it with Vadim Makeev and me in the fifth episode of our podcast, The F-Word (transcript available, naturally). All the information on the potential features, some FAQs and no photos of Brian are to be found on Igalia’s Open Prioritization page.
The F-word Episode 5 – Wow, a sonic double whammy! Not only did Taylor Swift release Folklore, but Episode 5 of @fword_dev is just out. Vadim and I invited the George Clooney of web standards, Brian Kardell, to tell us about the Open Prioritization experiment, Igalia, MathML and the Web commons.
ARIA Grid As an Anti-Pattern – Uncle Aadrdian points out more more bad advice in the ARIA Authoring Practices note. Is there a good, trustworthy alternative to ARIA Authoring Practices guide that devs can copy/ paste from?
Web Accessibility Checklist – I updated my massive Web Accessibility checklist to include turning off smooth scroll if use prefers reduced motion and to warn against some bits of the ARIA authoring practices, and to trust Uncle Adrian instead
Ask an expert: Why is CSS . . . the way it is? – Have you ever rolled your eyes and muttered “Just what were the @csswg smoking?”. Web Methuselah Chris Lilley tells you how some of the weirdness got there.
Google: Mobile-first Indexing – “we’ve begun experiments to make our index mobile-first … our algorithms will eventually primarily use the mobile version of a site’s content to rank pages … If you have a responsive site…you shouldn’t have to change anything.”
Yesterday I asked “What’s the most up-to-date info on aria-live regions (and
Heydon replied
Should be fine, support is good for live regions. Not sure about output, though … Oh, you’re adding the p _with_ the other XHR content? That will have mixed results in my experience.
Brennan said
I’ve seen some failed announcements with live-regions on VoiceOver, especially with iframes. (Announcement of the title seems to kill any pending live content).output has surprisingly good support but (IIRC) is not live by default on at least one browser (IE, I think).
We need a universally recognised icon/image/logo for "works offline".
Like the PWA or HTML5 logo. We need to be able to signal to visitors that our URLs are always available.
To the consumer, the terms Progressive Web App or Service Worker are meaningless. So I applied my legendary branding, PR and design skills to come up with something that will really resonate with a web user: the fact that this app works online, offline – anywhere.
So the new logo is a riff on the HTML5 logo, because this is purely web technologies. It has the shield, a wifi symbol on one side and a crossed out wifi symbol on the other, and a happy smile below to show that it’s happy both on and offline. Above it is the acronym “wank” which, of course, stands for “Works anywhere—no kidding!”
Take it to use on your sites. I give the fruits of my labour and creativity free, as a gift to humanity.