Readability Guidelines

Imagine a collaboratively developed, universal content style guide, based on usability evidence.

The search element | scottohara.me

I’ve already add the search element to thesession.org, but while browser support is still rolling out, I’m being extra verbose:

<search role="search">
 ...
</search>

Brought to you by the department of redunancy department.

I’ll remove the ARIA role once browsers are all on board. As Scott says:

Please be aware that this element landing in the HTML spec today does not mean it is available in browsers today. Issues have been filed to implement the search element in the major browsers, including the necessary accessibility mappings. Keep this in mind before you get all super excited and willy nilly add this new element to your pages.

Podcast Standards Project | Advocating for open podcasting

A new organisation with the stated goal of keeping podcasting open.

Their first specification is a consolidation of what already exists. That’s good. We don’t want a 927 situation.

My only worry is that many of the companies behind this initiative are focused on metrics and monetization—I hope they don’t attempt to standardise tracking and surveillance in podcasts.

The Podcast Standards Project, a grassroots coalition working to establish modern, open standards, to enable innovation in the podcast industry.

Define “innovation”.

GB Renewables Map

A lovely bit of real-time data visualisation from Robin:

It’s a personal project created at home in Wales with an aim to explore and visualise renewable energy systems. Specifically, it aims to visualise live generation from renewable energy systems around Great Britain and to show where that generation is physically coming from.

Defaulting on Single Page Applications (SPA)—zachleat.com

This isn’t an opinion piece. This is documentation.

You can’t JavaScript your way out of an excess-JavaScript problem.

The machines won’t save your design system — Hey Jovo Design

Every day, a new marketing email, Medium post, or VC who will leave Twitter when they’re cold in a body bag tells us that machine learning (ML, which they call AI because it sounds more expensive) is going to change the way we work. Doesn’t really matter what your job is. ML is going to read, write, code, and paint for us.

Naturally, the excitement around ML has found its way into the design systems community. There’s an apparent natural synergy between ML and design systems. Design systems practitioners are tantalized by the promise of even greater efficiency and scale. We wish a machine would write our docs for us.

We are all, every single one of us, huge fucking nerds.

Hello, internet | Sam O’Neill

I have been reminded time and time again of the utility of writing. How it is a way to turn messy thoughts into coherent ideas, and how – as we all know – practice makes perfect. So I’m going to give it a go.

Welcome to the indie web, Sam!

Learn Privacy

Stuart has written this fantastic concise practical guide to privacy for developers and designers. A must-read!

1. Use just the data you need
2. Third parties
3. Fingerprinting
4. Encryption
5. Best practices

Why ChatGPT Won’t Replace Coders Just Yet

I’ve been using Copilot for over a year now, and this is more or less how I use it: To help me quickly blast through boilerplate code so I can more quickly get to the tricky bits.

There’s a more subtle problem with ChatGPT’s code generation, which is that it suffers from ChatGPT’s general “bullshit” problem.

Home | The Component Gallery

Here’s an aggregator of components from multiple design systems.

Smoke screen | A Working Library

The story that “artificial intelligence” tells is a smoke screen. But smoke offers only temporary cover. It fades if it isn’t replenished.

In Search of Lost Time, by Tom Vanderbilt

Temporal standards bodies.

Web fingerprinting is worse than I thought - Bitestring’s Blog

How browser fingerprinting works and what you can do about it (if you use Firefox).

When is :focus-visible visible? | bitsofcode

1. Has the user expressed a preference for always visible focus?
2. Does the focused element support keyboard input?
3. Is the user interacting with the focused element with a non-pointing device?
4. Did a script cause focus to move from a previously visibly-focused element?

The perfect link - The A11Y Collective

How do we write, design, and code a link that works for everyone on every device? Let’s dive into the world of creating the perfect link, without making a pig’s breakfast of it.

Preventing too-short final lines of blocks | Clagnut by Richard Rutter

Check out the demo that Rich has put together to go with Amelia’s proposed syntax.

Adoption. — Ethan Marcotte

Ethan highlights a classic case of the McNamara Fallacy—measuring adoption of design system components.

The AI hype bubble is the new crypto hype bubble

A handy round-up of recent wrtings on artificial insemination.

Pixel Pioneers Bristol 2023 Speaker Spotlight: Jeremy Keith

Oliver asked me some questions about my upcoming talk at Pixel Pioneers in Bristol in June. Here are my answers.

50 Years Later, We’re Still Living in the Xerox Alto’s World - IEEE Spectrum

A profile of the Xerox Alto and the people behind it.

Design notes on the 2023 Wikipedia redesign

So then the question becomes: how do you most effectively communicate designs, to facilitate the best discussions about those designs? My answer is: lots of little prototypes built with HTML, CSS, and JavaScript.

Artificial Guessing

Artificial Intelligence sounds much more impressive than Artificial Guessing in a slide deck.

Robin picks up on my framing.

Instead of brainstorming, discussing, iterating, closely inspecting a product to understand it and figure out what to show on a page, well, we can just let the machines figure it out for us! This big guessing machine can do our homework and we can all pack up and go to the beach.

ongoing by Tim Bray · The LLM Problem

It doesn’t bother me much that bleeding-edge ML technology sometimes gets things wrong. It bothers me a lot when it gives no warnings, cites no sources, and provides no confidence interval.

Yes! Like I said:

Expose the wires. Show the workings-out.

Jeepers Frigging Cripes Crypto and NFTs are so stupid and dumb and bad and I can’t even. I’m out. Goodbye. Burn it down please. - Chris Coyier

Literally every experience I have in this world is gross at best and criminally evil at worst. Who it benefits that actually needs the benfefit is vanishingly few.

Here are some rhetorical questions from Chris:

How many years into this are we with no practical use cases for the world? How many resources have to be burned before this is seen?

Dumb Password Rules

A hall of shame for ludicrously convoluted password rules that actually reduce security.

Modern Font Stacks

This is handy—a collection of font stacks using system fonts. You can see which ones are currently installed on your machine too.

The most performant web font is no web font.

The stupidity of AI | The Guardian

A great piece by James, adapted from the new edition of his book New Dark Age.

The lesson of the current wave of “artificial” “intelligence”, I feel, is that intelligence is a poor thing when it is imagined by corporations. If your view of the world is one in which profit maximisation is the king of virtues, and all things shall be held to the standard of shareholder value, then of course your artistic, imaginative, aesthetic and emotional expressions will be woefully impoverished. We deserve better from the tools we use, the media we consume and the communities we live within, and we will only get what we deserve when we are capable of participating in them fully. And don’t be intimidated by them either – they’re really not that complicated. As the science-fiction legend Ursula K Le Guin wrote: “Technology is what we can learn to do.”

Stochastic Parrots Day Tickets, Fri, Mar 17, 2023 at 8:00 AM | Eventbrite

This free event is running online from 3pm to 7pm UK time this Friday. The line-up features Emily Bender, Safiya Noble, Timnit Gebru and more.

Since the publication of On the Dangers of Stochastic Parrots: Can Language Models Be Too Big?🦜 two years ago, many of the harms the paper has warned about and more, have unfortunately occurred. From exploited workers filtering hateful content, to an engineer claiming that chatbots are sentient, the harms are only accelerating.

Join the co-authors of the paper and various guests to reflect on what has happened in the last two years, what the large language model landscape currently look like, and where we are headed vs where we should be headed.

www91.pdf

This is the flyer that Tim Berners-Lee and Robert Cailliau distributed at the Hypertext 91 Conference—the one where their submission was infamously rejected.

The WWW project merges the techniques of information rerieval and hypertext to make an easy but powerful global information system.

The project is based on the philosophy that much academic information should be freely available to anyone. lt aims to allow information sharing within internationally dispersed teams, and the dissemination of information by support groups.

How slimmed-down websites can cut their carbon emissions - BBC News

Interesting to see an article on web performance on the BBC. Perhaps we should be emphasising green over speed?

Behind the scenes, animation and interaction effects were added using HTML and CSS, two fundamental web languages. That meant there was no need to download large JavaScript files often used to do this on other sites.

print-color-adjust - CSS: Cascading Style Sheets | MDN

I love print stylesheets but I was today years old when I found out that print-color-adjust exists.

Craft vs Industry: Separating Concerns by Thomas Michael Semmler: CSS Developer, Designer & Developer from Vienna, Austria

Call me Cassandra:

The way that industry incorporates design systems is basically a misappropriation, or abuse at worst. It is not just me who is seeing the problem with ongoing industrialization in design. Even Brad Frost, the inventor of atomic design, is expressing similar concerns. In the words of Jeremy Keith:

[…] Design systems take their place in a long history of dehumanising approaches to manufacturing like Taylorism. The priorities of “scientific management” are the same as those of design systems—increasing efficiency and enforcing consistency.

So no. It is not just you. We all feel it. This quote is from 2020, by the way. What was then a prediction has since become a reality.

This grim assessment is well worth a read. It rings very true.

What could have become Design Systemics, in which we applied systems theory, cybernetics, and constructivism to the process and practice of design, is now instead being reduced to component libraries. As a designer, I find this utter nonsense. Everyone who has even just witnessed a design process in action knows that the deliverable is merely a documenting artifact of the process and does not constitute it at all. But for companies, the “output” is all that matters, because it can be measured; it appeals to the industrialized process because it scales. Once a component is designed, it can be reused, configured, and composed to produce “free” iterations without having to consult a designer. The cost was reduced while the output was maximized. Goal achieved!

The climate cost of the AI revolution • Wim Vanderbauwhede

As a society we need to treat AI resources as finite and precious, to be utilised only when necessary, and as effectively as possible. We need frugal AI.

Why aren’t logical properties taking over everything? - Chris Coyier

Good question.

I think it’s mostly inertia.

There’s Nothing Unnatural About a Computer

Claire L. Evans interviews James Bridle.

Tech-last

I’ve spent a lot of time thinking, talking and writing about evaluating technology and what Robin describes here is definitely a bad “code smell” that should ring alarm bells:

What’s really concerning is when everyone is consumed with the technology-first and the problem-last.

Unless you’re working in an R’n’D lab, start with user needs.

I’m certain now that if you want to build something great you have to see through the tech. And that’s really hard to do when this cool new thing is all that anyone is talking about. But that’s why this one specific thing is the hallmark of a great organization; they aren’t distracted by short-lived trends and instead focus on the problem-first. Relentlessly, through the noise.

When JavaScript Fails

So, if progressive enhancement is no more expensive to create, future-proof, provides us with technical credit, and ensures that our users always receive the best possible experience under any conditions, why has it fallen by the wayside?

Because before, when you clicked on a link, the browser would go white for a moment.

JavaScript frameworks broke the browser to avoid that momentary loss of control. They then had to recreate everything that the browser had provided for free: routing, history, the back button, accessibility features, the ability for search engines to read the page, et cetera iterum ad infinitum.

Some simple ways to make content look good - Set Studio

This is a terrific walkthrough from Andy showing how smart fundamentals in your CSS can give you a beautiful readable document without much work.

Cole Peters — An Introduction to Constraint Based Design Systems

Design systems as codified constraints.

An end to typographic widows on the web | Clagnut by Richard Rutter

Rich explains what text-wrap:balance does …and what it doesn’t.

I doubled-down on RSS – Eric Bailey

In which Eric says:

Jeremy Keith, you magnificent son of a bitch.

I’ll take it.

Appropriately enough, I read this post in my feed reader.

The Web Needs a Native .visually-hidden

I agree with the reasoning here—a new display value would be ideal.

Light Years Ahead | The 1969 Apollo Guidance Computer - YouTube

This video was in my “Watch Later” queue for ages but I finally got ‘round to watching it this weekend. It’s ace! Great content, great narrative, great delivery—would’ve made a good dConstruct talk.

Those meddling kids! The Reverse Scooby-Doo theory of tech innovation comes with the excuses baked in | Nieman Journalism Lab

Manufactured inevitability a.k.a bullshit:

There’s a standard trope that tech evangelists deploy when they talk about the latest fad. It goes something like this:

1. Technology XYZ is arriving. It will be incredible for everyone. It is basically inevitable.
2. The only thing that can stop it is regulators and/or incumbent industries. If they are so foolish as to stand in its way, then we won’t be rewarded with the glorious future that I am promising.

We can think of this rhetorical move as a Reverse Scooby-Doo. It’s as though Silicon Valley has assumed the role of a Scooby-Doo villain — but decided in this case that he’s actually the hero. (“We would’ve gotten away with it, too, if it wasn’t for those meddling regulators!”)

The critical point is that their faith in the promise of the technology is balanced against a revulsion towards existing institutions. (The future is bright! Unless they make it dim.) If the future doesn’t turn out as predicted, those meddlers are to blame. It builds a safety valve into their model of the future, rendering all predictions unfalsifiable.

Remote Synthesis | The Price Developers Pay for Loving Their Tools Too Much

• Don’t wrap too much of your identity in a tool.
• Every tool will eventually fade.
• Flexibility is a valuable skill
• Changing tools does not mean starting over.

I agree with pretty much every word of this article.

Redefining Developer Experience — Begin Blog

Perhaps most problematic of all is the effect that contemporary developer experience has on educational programs (be they traditional classes, bootcamps, workshops, or anything in between). Such a rapidly expanding and ever changing technological ecosystem necessarily means that curricula struggle to keep up, and that the fundamentals of web development (e.g. HTML, CSS, HTTP, browser APIs…) are often glossed over in favor of getting students into the technologies more likely to land them jobs (like React and its many pals). This leads to an outpouring of early career developers who may speak confidently about things like React hooks or Redux state reducers, but who also lack any concept about the nature of HTML semantics or the most basic accessibility considerations. To be clear, I’m not throwing shade at those developers — they have been failed by an industry obsessed with the new and shiny at the expense of foundational practices and end user experiences.

And so, I ask: what exactly are we buying when we are sold ‘developer experience’ today? Who is benefiting from it? And if it is indeed something many of us aren’t too excited about (to put it kindly), how can we change it for the better?

I agree with pretty much every word of this article.

The Great Gaslighting of the JavaScript Era | The Spicy Web

We were told writing apps with an HTML-first, SSR-first, progressively enhanced mindset, using our preferred language/tech stack of choice, was outdated and bad for users.

That was a lie.

We were told writing apps completely using frontend-y JavaScript would make our lives easier.

That also was a lie.

I agree with pretty much every word of this article.

Jeremy Keith – Declarative Design – SOTR - YouTube

Here’s the video of the talk I gave at Monday’s meet-up here in Brighton—it’s a very condensed version of my longer conference talk on declarative design.

On Container Queries, Responsive Images, and JPEG-XL – Cloud Four

Container queries can’t be used in the sizes attribute for responsive images. Here, Jason breaks down why that is (spoiler: it’s the lookahead pre-parser) and segues into a truly long term solution: a “magical” image format.

If you’ve ever thought it felt weird to put media conditions inside the HTML for responsive images, this will resonate.