border:none 2023 – florian.photo

I love these black and white photos from the border:none event that just wrapped up in Nuremberg!

Let’s reinvent the wheel ⚒ Nerd

Vasilis gives the gist of his excellent talk at the border:none event that just wrapped up in Nuremberg. The rant at the end chimed very much with my feelings on this topic:

I showed a little interaction experiment that one of my students made, with incredible attention to detail. Absolutely brilliant in so many ways. You would expect that all design agencies would be fighting to get someone like that into their design team. But to my amazement she now works as a react native developer.

I have more of these very talented, very creative designers who know how to code, who really understand how the web works, who can actually design things for the web, with the web as a medium, who understand the invisible details, who know about the UX of HTML, who know what’s possible with modern HTML and CSS. Yet when they start working they have to choose: you either join our design team and are forced to use a tool that doesn’t get it, or you join the development team and are forced to use a ridiculous framework and make crap.

It’s 2023, here is why your web design sucks.

This resonates a lot:

At some point, we told design they couldn’t sit with us anymore, and surprise! It backfired! Now, not only has the field and profession of web design suffered, but also, we build shitty websites.

I’ve seen talented people—mostly women—pushed out of making websites because their skills—mostly CSS—weren’t valued as much being a React plumber.

It fucking sucks.

Web Components Will Outlive Your JavaScript Framework | jakelazaroff.com

Decision time:

There’s a cost to using dependencies. New versions are released, APIs change, and it takes time and effort to make sure your own code remains compatible with them. And the cost accumulates over time.

This post is about more than web components:

If we want our work to be accessible in five or ten or even 20 years, we need to use the web with no layers in between. For all its warts, the web has become the most resilient, portable, future-proof computing platform we’ve ever created — at least, if we build with that in mind.

Time team: Documenting decisions & marking milestones · Paul Robert Lloyd

Here’s the transcript of Paul’s excellent talk at this year’s UX London:

How designers can record decisions and cultivate a fun and inclusive culture within their team.

Ship Faster by Building Design Systems Slower | Big Medium

Josh mashes up design systems and pace layers, like Mark did a few years back. With this mindset, if your product interface are in sync, that’s not good—either your product is moving too slow or your design system is moving too fast.

The job of the design system team is not to innovate, but to curate. The system should provide answers only for settled solutions: the components and patterns that don’t require innovation because they’ve been solved and now standardized. Answers go into the design system when the questions are no longer interesting—proven out in product. The most exciting design systems are boring.

An Ode to Living on The Grid

A terrific interview with Deb Chachra. Her new book, How Infrastructure Works sounds excellent!

The map-reduce is not the territory

Unlike many people, I’m not particularly worried about AI replacing peoples’ jobs, although employers will certainly try and use it to reduce their headcount. I’m more worried about it transforming jobs into roles without agency or space to be human. Imagine a world where performance reviews are conducted by software; where deviance from the norm is flagged electronically, and where hiring and firing can be performed without input from a human. Imagine models that can predict when unionization is about to occur in a workplace. All of this exists today, but in relatively experimental form. Capital needs predictability and scale; for most jobs, the incentives are not in favor of human diversity and intuition.

POSSE: a better way to post on social networks - The Verge

A good overview of syndicating from your own website to social network silos:

The platform era is ending. Rather than build new Twitters and Facebooks, we can create a stuff-posting system that works better for everybody.

References and contributors include Cory Doctorow, Manton Reece, Matt Mullenweg and, of course, Tantek.

What the f••k is a Design System?

Answers on a postcard, please (and by postcard, I mean textarea).

P&B: Jim Nielsen – Manu

I enjoyed reading this interview with Jim Nielsen, much as I enjoy reading Jim’s blog. He says:

The best part of blogging is what you discover and learn experientially along the way.

That chimes with what Matthias says in the first issue of his new newsletter:

On your personal site, getting it wrong is not a bug, it’s a feature. It’s a chance to start small, take first steps, learn, edit, and improve. It’s an invaluable opportunity to evolve and to grow.

How to fix the internet | MIT Technology Review

We’re in a rare moment when a shift just may be possible; the previously intractable and permanent-­seeming systems and platforms are showing that they can be changed and moved, and something new could actually grow.

The fix for the internet isn’t to shut down Facebook or log off or go outside and touch grass. The solution to the internet is more internet: more apps, more spaces to go, more money sloshing around to fund more good things in more variety, more people engaging thoughtfully in places they like. More utility, more voices, more joy.

The Web Is For User Agency

I can get behind this:

I take it as my starting point that when we say that we want to build a better Web our guiding star is to improve user agency and that user agency is what the Web is for.

Robin dives into the philosphy and ethics of this position, but he also points to some very concrete implementations of it:

• Accessibility,
• Internationlization,
• Security, and
• Privacy

These shared foundations for Web technologies (which the W3C refers to as “horizontal review” but they have broader applicability in the Web community beyond standards) are all specific, concrete implementations of the Web’s goal of developing user agency — they are about capabilities. We don’t habitually think of them as ethical or political goals, but they are: they aren’t random things that someone did for fun — they serve a purpose. And they work because they implement ethics that get dirty with the tangible details.

Introduction to web sustainability | MDN Blog

You might think that any individual effort to reduce the web’s environmental impact is a drop in the ocean. But as tech workers, we are in a position of relative power compared to other industries. We build products that might be used by thousands, even millions of users. Any improvements we make have the potential for a vast impact when scaled up to that level.

A good overview from Michelle.

Link colors and the rule of tincture

When you think of heraldry what comes to mind is probably knights in shining armor, damsels in distress, jousting, that sort of thing. Medieval stuff. But I prefer to think of it as one of the earliest design systems.

This totally checks out.

Community Guidelines for Kottke.org

I like Jason’s guidelines—very in keeping with The Session’s house rules.

And I really like his motivation for trying out comments:

The timing feels right. Twitter has imploded and social sites/services like Threads, Bluesky, and Mastodon are jockeying to replace it (for various definitions of “replace”). People are re-thinking what they want out of social media on the internet and I believe there’s an opportunity for sites like kottke.org to provide a different and perhaps even better experience for sharing and discussing information. Shit, maybe I’m wrong but it’s definitely worth a try.

As I said in my comment:

Yes! More experiments like this please! Experiments that aren’t just “let’s clone Twitter”.

Practical Accessibility — Practical Accessibility for web designers and developers

This online course from Sara looks superb!

I know how overwhelming and even frustrating accessibility may feel at first. But I promise you, accessibility isn’t always as hard as it seems (especially if you know where and when to start!). And my goal with this course is to make it friendlier and more approachable.

Best of all, there’s $100 off if you sign up now—that’s a 25% saving.

htmx ~ Why htmx Does Not Have a Build Step

The best reason to write a library in plain JavaScript is that it lasts forever. This is arguably JavaScript’s single most underrated feature. While I’m sure there are some corner cases, JavaScript from 1999 that ran in Netscape Navigator will run unaltered, alongside modern code, in Google Chrome downloaded yesterday. That is true for very few programming environments.

And yet:

Of course, most people’s experience with JavaScript is that it ages like milk. Reopen a node repository after 3 months and you’ll find that your project is mired in a flurry of security warnings, backwards-incompatible library “upgrades,” and a frontend framework whose cultural peak was the exact moment you started the project and is now widely considered tech debt.

I Just Really Don’t Like Automated Phone Systems – cabel.com

Notice how this crappy assemblage of if/else statements repeatedly claims to be “artificial intelligence”—that term really has lost all meaning now.

Whole Earth Index

Here lies a nearly-complete archive of Whole Earth publications, a series of journals and magazines descended from the Whole Earth Catalog, published by Stewart Brand and the POINT Foundation between 1970 and 2002. They are made available here for scholarship, education, and research purposes.

P&B: Ana Rodrigues – Manu

This makes feel all warm and fuzzy:

At the time, I was disheartened by the tech industry and terrified of doing a tech post. I thought those things were for everyone else but me.

Only at the end of 2017 did something shift inside me, thanks to Jeremy Keith’s talk at the ViewSource conference. I discovered the IndieWeb community, and with that came the reassurance that my “nicheless” blog was absolutely okay.

Thanks to that feeling of acceptance, from 2018 onwards, my confidence really picked up, and I was blogging frequently, including web development things!

Using Web Components on My Icon Galleries Websites - Jim Nielsen’s Blog

Because I want my site to be progressively-enhanced (e.g. the core feature of the site — viewing icons — works without JS), I didn’t want a “shell” web component that’s merely an empty HTML tag in the initial HTML that later renders everything.

Jim seems bashful about calling what he’s built a true web component:

Maybe I shouldn’t be using the term “web component” for what I’ve done here. I’m not using shadow DOM. I’m not using the templates or slots. I’m really only using custom elements to attach functionality to a specific kind of component.

Au contraire! For me, this exemplifies the best mindset to have when wielding this technology.

CSS { In Real Life } | Greenwashing and the COP28 Website

Maybe when I wrote about performative performance? Michelle has a prime example:

The low carbon toggle does absolutely nothing.

In fact, worse than nothing. It doesn’t prevent images being downloaded. It doesn’t switch the site to dark mode, or prevent autoplaying animations (e.g. the hero carousel), or reduce resources transferred in other way. All it does is overlay an extra element with a background gradient on top of the large images on the site to give the appearance that those images being prevented from loading.

View Transitions Level 1 · Interop 2024

If you, like me, feel that view transitions—especially on multi-page apps—would be a good thing for browsers to prioritise for interoperability, give this issue a thumbs-up.

Did technology kill the craftsman? - The Progress Network

There is something divine about creating. From building software to writing a book to completing a self-portrait, every act of creation is a miniature Genesis.

Speaking of doing things the long hard stupid way:

If you want to leave a fingerprint of talent on the world that lasts, get your hands dirty and practice your skill, because work that is beautiful and timeless demands dedication.

Against Scale

Claire L. Evans has written a beautiful piece on the difference between growth and scalability:

Life is nonhierarchical, and it shirks top-down control. But scalability relies on hierarchy, on the isolation of elements stripped of history and context. It is predicated on the assumption that nature is little more than a raw material to be processed and commodified until it is spent. This is, of course, unsustainable — at any scale.

Kinopio’s Design Principles

Pirijan talks us through the design principles underpinning Kinopio, a tool I like very much:

1. Embrace Smallness by Embracing Code as a Living Design System
2. Building for Fidget-Ability, hmmm
3. Embrace Plain Text
4. A Single Interface for Mobile and Desktop
5. Refine by Pruning

Apocalypse-Proof

Back in 2017 when I was in New York, I went on a self-guided infrastructure tour: 32 Avenue of the Americas, 60 Hudson Street, and the subject of this article, 33 Thomas Street. One of my pictures is used to illustrate its creepiness, both in real life and as an evil lair in fiction:

A windowless telecommunications hub, 33 Thomas Street in New York City embodies an architecture of surveillance and paranoia. That has made it an ideal set for conspiracy thrillers.

Erik Wernquist - Short Film: “One Revolution Per Minute”

Suppose you had a luxury spacecraft spinning at 1RPM to create 0.5g using centripetal force, as is often depicted in science fiction:

I believe that the perpetually spinning views would be extremely nauseating for most humans, even for short visits. Even worse, I suspect - when it comes to the comfort of the experience - would be the constantly moving light and shadows from the sun.

More Thoughtful Reading & Writing on the Web - Tantek

The combination of taking more time (as longer form writing encourages) and publishing on a domain associated with your name, your identity, enables & incentivizes more thoughtful writing. More thoughtful writing elevates the reader to a more thoughtful state of mind.

Fair Warning — Real Life

Abeba Birhane has written an excellent historical overview of the original Artificial Intelligence movement, including Weizenbaum’s aboutface, and the current continuation of technological determinism.

DEF CON 31 - An Audacious Plan to Halt the Internet’s Ensh*ttification - Cory Doctorow - YouTube

A great rousing—practical—speech from Cory.

ARIA, the good parts

The slides from Hidde’s presentation at Paris Web—a great overview of using and misusing ARIA.

Clamp calculator | Utopia

Oh, this is a nice addition to the Utopia set of tools: when you don’t need a full-on type scale but you still want to figure out fluid clamp() values, the clamp calculator has you covered.

It’s got permalinks too!

BarCamp London XII

BarCamp London is back this year, the day after ffconf.

Simplify sharing with built-in APIs and progressive enhancement - Set Studio

Andy walks us through using the Web Share API as a progressive enhancement …but wouldn’t it be nice if we could just write button type="share"?

Making or using generative ‘AI’ is, all else being equal, a dick move – Baldur Bjarnason

Because you’re allowed to do something doesn’t mean you can do it without repercussions. In this case, the consequences are very much on the mild side: if you use LLMs or diffusion models, a relatively small group of mostly mid- to low-income people who are largely underdogs in their respective fields will think you’re a dick.

Making a Website is for Everyone - Jim Nielsen’s Blog

I absolutely love the idea of actively preserving a low barrier to entry for future generations of people.

💯

Over time, the direction of web technology always trends towards complexity. Simplicity is achieved as a concerted, mindful fight against this.

Burn baby burnout by Amy Hupe, content designer.

Here’s the transcript of a great talk by Amy on the realities of working on design systems.

Naming things needn’t be hard - Classnames

A handy resource from Paul:

Find inspiration for naming things – be that HTML classes, CSS properties or JavaScript functions – using these lists of useful words.

zachleat/table-saw: A small web component for responsive `table` elements.

Now, this is how you design a web component. It’s a progressive enhancement.

Wrap your existing table element inside table-saw and it will behave responsively. If anything goes wrong with the JavaScript, the fallback is the regular table that’s already in your markup.

I just wish the installation didn’t assume that you’re using npm …it’s not really “zero dependency” if it depends on that.

Why We’ll Never Live in Space - Scientific American

In space travel, “Why?” is perhaps the most important ethical question. “What’s the purpose here? What are we accomplishing?” Green asks. His own answer goes something like this: “It serves the value of knowing that we can do things—if we try really hard, we can actually accomplish our goals. It brings people together.” But those somewhat philosophical benefits must be weighed against much more concrete costs, such as which other projects—Earth science research, robotic missions to other planets or, you know, outfitting this planet with affordable housing—aren’t happening because money is going to the moon or Mars or Alpha Centauri.