Jeremy Keith's Blog, page 10

That was UX London 2024

UX London 2024 is done ���and it was magnificent!

It���s always weird when an event like this moves from being something in the future to something in the past. I���ve spent the year so far fixated on getting the right line-up, getting the word out, and nervously watching the ticket sales (for some reason a lot of people left it to pretty late in the day to secure their spots���not good for my heart!). For months, then weeks, then days, this thing was coming towards me. Then it was done. Now it���s behind me. It feels strange.

I���ve spent the past few days decompressing and thinking back on the event. My initial impression of it has solidified with the addition of some rumination���it was really, really good! The best yet.

I wish I could take the credit for that, but it was all down to the fantastic speakers and my wonderful colleagues who kept things moving flawlessly. All I had to do was get up and stage and introduce the speakers. Easy peasy.

I will say that I am very proud of the line-up I put together. I had a nice mix of well-known voices alongside newcomers.

With some of the speakers, I knew that they���d deliver the goods. I didn���t spend any time fretting over whether people like Emma Boulton, Tom Kerwin or Ben Sauer would be great. I never asked myself whether Brad Frost would have valuable insights into design systems. I mean, does the pope shit in the woods?

But what really blew me away were the people I didn���t know. I hadn���t even met Clarissa Gardner or Benaz Irani before UX London. They���re not exactly fixtures on the conference circuit ���yet. They should be. Seriously, I go to a lot of events, and I see a lot of talks, so I don���t offer my praise lightly. Their talks were great!

There were numerous times during UX London 2024 when I thought ���More people need to see this!��� More people need to see Benaz���s superb talk on the designer alter-ego. More people need to see John���s superb presentation���he put a ton of work into it and it really paid off.

And everyone needs to hear Harry���s blistering call-to-arms. His presentation was brilliant and much-needed. Oh, captain, my captain!

Oh, and needless to say, the closing keynotes on each day were just perfect. Rama, Matt, and Maggie bestowed so much great brain food, it was almost like a mini dConstruct.

I���m so grateful to all the speakers for really bringing their A game. I���m grateful to all my colleagues, especially Louise, who did all the hard work behind the scenes. And I���m really grateful to everyone who came and enjoyed UX London 2024.

Thank you.

The machine stops

Large language models have reaped our words and plundered our books. Bryan Vandyke:

Turns out, everything on the internet���every blessed word, no matter how dumb or benighted���has utility as a learning model. Words are the food that large language algorithms feed upon, the scraps they rely on to grow, to learn, to approximate life. The LLNs that came online in recent years were all trained by reading the internet.

We can shut the barn door���now that the horse has pillaged���by updating our robots.txt files or editing .htaccess. That might protect us from the next wave, ���though it can���t undo what���s already been taken without permission. And that���s assuming that these organisations���who have demonstrated a contempt for ethical thinking���will even respect robots.txt requests.

I want to do more. I don���t just want to prevent my words being sucked up. I want to throw a spanner in the works. If my words are going to be snatched away, I want them to be poison pills.

The weakness of large language models is that their data and their logic come from the same source. That���s what makes prompt injection such a thorny problem (and a well-named neologism���the comparison to SQL injection is spot-on).

Smarter people than me are coming up with ways to protect content through sabotage: hidden pixels in images; hidden words on web pages. I���d like to implement this on my own website. If anyone has some suggestions for ways to do this, I���m all ears.

If enough people do this we���ll probably end up in an arms race with the bots. It���ll be like reverse SEO. Instead of trying to trick crawlers into liking us, let���s collectively kill ���em.

Who���s with me?

Web App install API

My bug report on Apple���s websites-in-the-dock feature on desktop has me thinking about how starkly different it is on mobile.

On iOS if you want to add a website to your home screen, good luck. The option is buried within the ���share��� menu.

First off, it makes no sense that adding something to your homescreen counts as sharing. Secondly, how is anybody supposed to know that unless they���re explicitly told.

It���s a similar situation on Android. In theory you can prompt the user to install a progressive web app using the botched BeforeInstallPromptEvent. In practice it���s a mess. What it actually does is defer the installation prompt so you can offer it a more suitable time. But it only works if the browser was going to offer an installation prompt anyway.

When does Chrome on Android decide to offer the installation prompt? It���s a mix of required criteria���a web app manifest, some icons���and an algorithmic spell determined by the user���s engagement.

Other browser makers don���t agree with this arbitrary set of criteria. They quite rightly say that a user should be able to add any website to their home screen if they want to.

What we really need is an installation API: a way to programmatically invoke the add-to-homescreen flow.

Now, I know what you���re going to say. The security and UX implications would be dire. But this should obviously be like geolocation or notifications, only available in secure contexts and gated by user interaction.

Think of it like adding something to the clipboard: it���s something the user can do manually, but the API offers a way to do it programmatically without opening it up to abuse.

(I���d really love it if this API also had a declarative equivalent, much like I want button type="share" for the Web Share API. How about button type="install"?)

People expect this to already exist.

The beforeinstallprompt flow is an absolute mess. Users deserve better.

Space dock

Apple announced some stuff about artificial insemination at their WorldWide Developer Conference, none of which interests me one whit. But we did get a twitch of the webkit curtains to let us know what���s coming in Safari. That does interest me.

I���m really pleased to see that on desktop, websites that have been added to the dock will be able to intercept links for that domain:

Now, when a user clicks a link, if it matches the scope of a web app that the user has added to their Dock, that link will open in the web app instead of their default web browser.

Excellent! This means that if I click on a link to thesession.org from, say, my Mastodon site-in-the-dock, it will open in The Session site-in-the-dock. Make sure you���ve got the scope property set in your web app manifest.

I have a few different sites added to my dock: The Session, Mastodon, Google Calendar. Sure beats the bloat of Electron apps.

I have encountered a small bug. I���ll describe it here because I have no idea where to file it.

It���s to do with Spaces, Apple���s desktop management thingy. Maybe they don���t call it Spaces anymore. Maybe it���s called Mission Control now. Or Stage Manager. I can���t keep track.

Anyway, here are the steps to reproduce:

In Safari on Mac, go to a website like adactio.comFrom either the File menu or the share icon, select Add to dock.Click on the website���s icon in the dock to open it.Using Apple���s desktop management (Spaces?) available through the F3 key, drag that window to a desktop other than desktop 1.Right click on the site���s icon in the dock and select Options, then Assign To, then This Desktop.Quit the app/website.Return to desktop 1.

Expected behaviour: when I click on the icon in the dock to open the site, it will open in the desktop that it has been assigned to.

Observed behaviour: focus moves to the desktop that the site has been assigned to, but it actually opens in desktop 1.

If someone from Apple is reading, I hope that���s useful.

On the one hand, I hope this isn���t one of those bugs that only I���m experiencing because then I���ll feel foolish. On the other hand, I hope this is one of those bugs that only I���m experiencing because then others don���t have to put up with the buggy behaviour.

CSS Day 2024

My stint as one of the hosts of CSS Day went very well indeed. I enjoyed myself and people seemed to like the cut of my jib.

During the event there was a real buzz on Mastodon, which was heartening to see. I was beginning to worry that hashtagging events was going to be collatoral damage from Elongate, but there was plenty of conference-induced FOMO to be experienced on the fediverse.

The event itself was, as always, excellent. Both in terms of content and organisation.

Some themes emerged during CSS Day, which I always love to see. These emergent properties are partly down to curation and partly down to serendipity.

The last few years of CSS Day have felt like getting a firehose of astonishing new features being added to the language. There was still plenty of cutting-edge stuff this year���masonry! anchor positioning!���but there was also a feeling of consolidation, asking how to get all this amazing new stuff into our workflows.

Matthias���s opening talk on day one and Stephen���s closing talk on the same day complemented one another perfectly. Both managed to inspire while looking into the nitty-gritty practicalities of the web design process.

It was, astoundingly, Matthias���s first ever conference talk. I have no doubt it won���t be the last���it was great!

I gave Stephen a good-natured roast in my introduction, partly because it was his birthday, partly because we���re old friends, but mostly because it was enjoyable for me to watch him squirm. Of course his talk was, as always, superb. Don���t tell him, but he might be one of my favourite speakers.

The topic of graphic design tools came up more than once. It���s interesting to see how the issues with them have changed. It used to be that design tools���Photoshop, Sketch, Figma���were frustrating because they were writing cheques that CSS couldn���t catch. Now the frustration is the exact opposite. Our graphic design tools aren���t capable of the kind of fluid declarative design we can now accomplish in web browsers.

But the biggest rift remains not with tools or technologies, but with people and mindsets. Our tools can reinforce mindsets but the real divide happens in how different people approach CSS.

Both Josh and Kevin get to the heart of this in their tremendous tutorials, and that was reflected in their talks. They showed the difference between having the bare minimum understanding of CSS in order to get something done as quickly as possible, and truly understanding how CSS works in order to open up a world of possibilities.

For people in the first category, Sarah Dayan was there to sing the praises of utility-first CSS AKA atomic CSS. I commend her bravery!

During the Q&A, I restrained myself from being too Paxmanish. But I did have l���esprit d���escalier afterwards when I realised that the entire talk���and all the answers afterwards���depended on two mutually-incompatiable claims:

The great thing about atomic CSS is that it���s a constrained vocabulary so your team has to conform, andThe other great thing about it is that it���s utility-first, not utility-only so you can break out of it and use regular CSS if you want.

Insert .gif of character from The Office looking to camera.

Most of the questions coming in during the Q&A reflected my own take: how about we use utility classes for some things, but not all things. Seems sensible.

Anyway, regardless of what I or anyone else thinks about the substance of what Sarah was saying, there was no denying that it was a great presentation. They were all great presentations. That���s unusual, and I say that as a conference organiser as well as an attendee. Everyone brings their A-game to CSS Day.

Mind you, it is exhausting. I say it every year, but it always feels like one talk too many. Not that any individual talk wasn���t good, but the sheer onslaught of deep dives into the innards of CSS has my brain exploding before the day is done.

A highlight for me was getting to introduce Fantasai���s talk on the design principles of CSS, which was right up my alley. I don���t think most people realise just how much we owe her for her years of work on standards. The web would be in a worse place without the Herculean work she���s done behind the scenes.

Another highlight was getting to see some of the students I met back in March. They were showing some of their excellent work during the breaks. I find what they���re doing just as inspiring as the speakers on stage.

In fact, when I was filling in the post-conference feedback form, there was a question: ���Who would you like to see speak at CSS Day next year?��� I was racking my brains because everyone I could immediately think of has already spoken at some point. So I wrote, ���It would be great to see some of those students speaking about their work.���

I think it would be genuinely fascinating to get their perspective on what we consider modern CSS, which to them is just CSS.

Either way I���ll back next year for sure.

It���s funny, but usually when a conference is described as ���inspiring��� it���s because it���s tackling big galaxy-brain questions. But CSS Day is as nitty-gritty as it gets and I found it truly inspiring. Like, I couldn���t wait to open up my laptop and start writing some CSS. That kind of inspiring.

Hosting

I haven���t spoken at any conferences so far this year, and I don���t have any upcoming talks. That feels weird. I���m getting kind of antsy to give a talk.

I suspect my next talk will have something to do with HTML web components. If you’re organising an event and that sounds interesting to you, give me a shout.

But even though I���m not giving a conference talk this year, I���m doing a fair bit of hosting. There was the lovely Patterns Day back in March. And this week I���m off to Amsterdam to be one of the hosts of CSS Day. As always, I���m very much looking forward to that event.

Once that���s done, it���ll be time for the biggie. UX London is just two weeks away���squee!

There are still tickets available. If you haven���t got yours yet, I highly recommend getting it before midnight on Friday���that���s when the regular pricing ends. After that, it���ll be last-chance passes only.

Browser support

There was a discussion at Clearleft recently about browser support. Rich has more details but the gist of it is that, even though we were confident that we had a good approach to browser support, we hadn���t written it down anywhere. Time to fix that.

This is something I had been thinking about recently anyway���see my post about Baseline and progressive enhancement���so it didn���t take too long to put together a document explaining our approach.

You can find it at browsersupport.clearleft.com

We���re not just making it public. We���re releasing it under a Creative Commons attribution license. You can copy this browser-support policy verbatim, you can tweak it, you can change it, you can do what you like. As long you include a credit to Clearleft, you���re all set.

I think this browser-support policy makes a lot of sense. It certainly beats trying to browser support to specific browsers or version numbers:

We don���t base our browser support on specific browser names and numbers. Instead, our support policy is based on the capabilities of those browsers.

The more organisations adopt this approach, the better it is for everyone. Hence the liberal licensing.

So next time your boss or your client is asking what your official browser-support policy is, feel free to use browsersupport.clearleft.com

Reading patterns

I can���t resist bookshelves.

If I���m shown into someone���s home and left alone while the host goes and does something, you can bet I���m going to peruse their bookshelves.

I don���t know why. Maybe I���m looking for points of commonality. ���Oh, you read this book too?��� Or maybe it���s the opposite, and I���m looking for something new and���pardon the pun���novel. ���Oh, that book sounds interesting!���

I like it when people have a kind of bookshelf on their website.

Mandy���s reading list is always worth browsing.Remy has a comprehensive record of his reading history.Maggie has her library and her anti-library.Molly White has one shelf for fiction and another shelf for non-fiction.

Here���s my ad-hoc bookshelf, which is manually mirrored on Bookshop.org.

I like having an overview of what I���ve been reading. One of the reasons I started keeping track was so that I could try to have a nice balance of fiction and non-fiction.

I always get a little sad when I see someone���s online reading list and it only consists of non-fiction books that are deemed somehow useful, rather than simply pleasurable. Cameron wrote about when he used to do this:

I felt like reading needed to have some clear purpose. The topic of any book I read needed to directly contribute to being an ���adult���. So I started to read non-fiction ��� stuff that reflected what was happening in my career. Books on management, books on finance, books on economics, books on the creative process. And for many years this diet of dry, literary roughage felt wholesome ��� but joyless. Each passage I highlited in yellow marker was a point for the scoreboard, not a memory to be treasured.

Now he���s redressing the imbalance and rediscovering the unique joy of entering other worlds by reading fiction.

For a while, I forced myself to have perfect balance. I didn���t allow myself to read two non-fiction books in a row or two fiction books in a row. I made myself alternate between the two.

I���ve let that lapse now. I���m reading more fiction than non-fiction, and I���m okay with that.

But I still like looking back on what I���ve been reading and seeing patterns emerge. Like there���s a clear boom in the last year of reading retellings of the Homeric epics (all kicked off by reading the brilliant Circe by Madeline Miller).

I also keep an eye out for a different kind of imbalance. I want to make sure that I���m not just reading books by people like me���middle-aged heterosexual white dudes.

You may think that a balanced reading diet would emerge naturally, but I���m not so sure. Here���s an online bookshelf. Here���s another online bookshelf. Plenty of good stuff in both. But do either of those men realise that they���ve gone more than a year without reading a book written by a woman?

It���s almost certainly not a conscious decision. It���s just that in the society we live in, the default mode tends towards what���s been historically privileged (see also films, music, and painting).

It���s like driving in a car that subtly pulls to one side. Unless you compensate for it, you���ll end up in the ditch without even realising.

I feel bad for calling attention to those two reading lists. It feels very judgy of me. And reading is something that doesn���t deserve judgement. Any reading is good reading.

Mind you, maybe being judgemental is exactly why I���m drawn to people���s bookshelves in the first place. It might be that I���m subsconsciously looking for compatibility signals. If I see a bookshelf filled with books I like, I���m bound to feel predisposed to like that person. And if I see a bookshelf dominated by Jordan Peterson and Ayn Rand, I���m probably going to pass judgement on the reader, even if I know I shouldn���t.

Applying the four principles of accessibility

Web Content Accessibility Guidelines���or WCAG���looks very daunting. It���s a lot to take in. It���s kind of overwhelming. It���s hard to know where to start.

I recommend taking a deep breath and focusing on the four principles of accessibility. Together they spell out the cutesy acronym POUR:

PerceivableOperableUnderstandableRobust

A lot of work has gone into distilling WCAG down to these four guidelines. Here���s how I apply them in my work���

Perceivable

I interpret this as:

Content will be legible, regardless of how it is accessed.

For example:

The contrast between background and foreground colours will meet the ratios defined in WCAG 2.Content will be grouped into semantically-sensible HTML regions such as navigation, main, footer, etc.Operable

I interpret this as:

Core functionality will be available, regardless of how it is accessed.

For example:

I will ensure that interactive controls such as links and form inputs will be navigable with a keyboard.Every form control will be labelled, ideally with a visible label.Understandable

I interpret this as:

Content will make sense, regardless of how it is accessed.

For example:

Images will have meaningful alternative text.I will make sensible use of heading levels.

This is where it starts to get quite collaboritive. Working at an agency, there will some parts of website creation and maintenance that will require ongoing accessibility knowledge even when our work is finished.

For example:

Images uploaded through a content management system will need sensible alternative text.Articles uploaded through a content management system will need sensible heading levels.Robust

I interpret this as:

Content and core functionality will still work, regardless of how it is accessed.

For example:

Drop-down controls will use the HTML select element rather than a more fragile imitation.I will only use JavaScript to provide functionality that isn���t possible with HTML and CSS alone.

If you���re applying a mindset of progressive enhancement, this part comes for you. If you take a different approach, you���re going to have a bad time.

Taken together, these four guidelines will get you very far without having to dive too deeply into the rest of WCAG.

Another speaker for UX London

UX London is just three weeks away! If you haven���t got your ticket yet, dally not.

There���s a last-minute addition to the line-up: Peter Boersma.

Peter is kindly stepping into the slot that Kara Kane was going to be occupying. Alas, since a snap general election was recently announced, Kara isn���t able to give her talk. There���s an abundance of caution in the comms from gov.uk in this pre-election period.

It���s a shame that Kara won���t be able to speak this time around, but it���s great that we���ve got Peter!

Peter���s talk is perfect for day three. Remember, that���s the day focused on design ops and design systems. Well, Peter lives and breathes design ops. He���ll show you why you should maintain a roadmap for design ops, and work with others to get the initiatives on it done.

You can get a ticket for an individual day of talks and workshops, or go for the best-value option and come for all three days. See you there!