A meandering and messy, but otherwise an absolutely worthwhile essay from Shubham Bose about the bloat and hostile behaviours on news sites:

I went to the New York Times to glimpse at four headlines and was greeted with 422 network requests and 49 megabytes of data. […]

Almost all modern news websites are guilty of some variation of anti-user patterns. As a reminder, the NNgroup defines interaction cost as the sum of mental and physical efforts a user must exert to reach their goal. In the physical world, hostile architecture refers to a park bench with spikes that prevent people from sleeping. In the digital world, we can call it a system carefully engineered to extract metrics at the expense of human cognitive load. Let’s also cover some popular user-hostile design choices that have gone mainstream.

Bose has a knack for naming some of these hostile patterns: The Pre-Read Ambush stands for distracting you even before you start reading, Z-Index Warfare is about multiple pop-ups competing with each other, and Viewport Suffocation is about covering so much screen with crap you can barely see the content. You can almost see those names fly by on the massive screens in the final scenes of WarGames:

By the way, I didn’t know that the ad bidding is actually happening on my computer, using my CPU, and clobbering my interface speed:

Before the user finishes reading the headline, the browser is forced to process dozens of concurrent bidding requests to exchanges like Rubicon Project […] and Amazon Ad Systems. While these requests are asynchronous over the network, their payloads are incredibly hostile to the browser’s main thread. To facilitate this, the browser must download, parse and compile megabytes of JS. As a publisher, you shouldn’t run compute cycles to calculate ad yields before rendering the actual journalism.

The essay ends on a call to action:

No individual engineer at the Times decided to make reading miserable. This architecture emerged from a thousand small incentive decisions, each locally rational yet collectively catastrophic.

They built a system that treats your attention as an extractable resource. The most radical thing you can do is refuse to be extracted. Close the tab. Use RSS. Let the bounce rate speak for itself.

Funny you should say that. There is another user-hostile pattern not mentioned in the article, as it happens on the other side; the swiping back gesture on the mobile phone is hijacked to insert a frustrating “Keep on reading” page, rather than getting you where you came from:

It’s there on many sites, from Slate to Ars Technica.

It usually shows cheap, attention-grabbing headlines (in the case of Ars Technica, the Linus Torvalds article was over a decade old!). I originally thought this was just a last-ditch attempt to keep me on the site, but when I asked on social, a reader suggested there is another reason:

It’s an SEO play. If you land on a site because of a Google search and swipe back to Google, it sends a signal to Google that it wasn’t the result you were looking for. So by forcing users to click a link on the page to read more than two paragraphs, it means the user is unable to swipe back to Google and send that negative SEO signal.

Even the bounce rate is not allowed to speak for itself.

My post about Flickr URLs gathered some interesting responses (especially on Mastodon, thank you all!), so I thought I’d do what podcasts call a “mailbag episode”!

Some people pointed out other good examples for inspiration. Chris Silverman:

The idea of URLs as user interface elements is such a good take. I’ve seen some people use URLs as design/​communications elements as well, like Jessica Hische:

• www.jessicahische.is/thinkingthoughts
• www.jessicahische.is/working
• jessicahische.is/anoversharer

I love that approach. Modern browsers and preview cards often obscure URLs, but people still see these things; printed materials, links in emails, etc.

Matt Goldman:

I really like letterboxd’s urls these days:

• all the films in my diary in 2024? letterboxd.com/robotmlg/diary/films/for/2024/
• movies I’ve tagged as seeing at Film Forum? letterboxd.com/robotmlg/tag/film-forum/films/
• five star reviews that I wrote in 2021? letterboxd.com/robotmlg/reviews/films/for/2021/rated/5/

Both Erin Sparling and Nelson Miner highlighted how much the craft of Flickr URLs related to the craft of its API:

Literally used to talk about how good this URL scheme was in class, it was so informative. The Flickr API still informs everything I do these days, URLs included.

There was some discussion about the pattern I suggested. Which one should it be?

• flickr.com/mwichary/sets/72177720330077904/alishan-forest-railway
• flickr.com/mwichary/sets/alishan-forest-railway-72177720330077904
• flickr.com/mwichary/sets/alishan-forest-railway/72177720330077904

I will admit: I don’t know. Each has pros and cons – some are better for autocomplete, others better for conveying hierarchy or surviving “removing from the end.”

This note arrived via email:

Hey, www is not redundant. In services like NextDNS it allows blocking only main site, without subdomains. So it gives more control and cost nothing :)

To which my answer is: I don’t think you’ll get to great user experience by prioritizing corner cases like this one.

Jim Nielsen shared some of his favourites, and Søren Birkemeyer suggested more evergreen reading on the subject, with more inspiration inside:

• URL design by Kyle Aster
• URLs are UI by Scott Hanselman
• Four cool URLs by Alex Pounds

The middle one caught my attention because it talks about URLs that are not just user readable, but also user guessable. I think that’s a perfect word for something I tried to capture in my post: if a user successfully guesses a URL from your scheme, then you know you have something good on your hands.

Lastly, a few people mentioned the late 1990s classic written by a relatively unknown dude going by “Tim BL,” called Cool URIs don’t change.

Historical note: At the end of the 20th century when this was written, “cool” was an epithet of approval particularly among young, indicating trendiness, quality, or appropriateness. In the rush to stake [out] DNS territory involved[, ] the choice of domain name and URI path were sometimes directed more toward apparent “coolness” than toward usefulness or longevity. This note is an attempt to redirect the energy behind the quest for coolness.

Half of my education in URLs as user interface came from Flickr in the late 2000s. Its URLs looked like this:

flickr.com/photos/mwichary/favorites
flickr.com/photos/mwichary/sets
flickr.com/photos/mwichary/sets/72177720330077904
flickr.com/photos/mwichary/54896695834
flickr.com/photos/mwichary/54896695834/in/set-72177720330077904

This was incredible and a breath of fresh air. No redundant www. in front or awkward .php at the end. No parameters with their unpleasant ?&= syntax. No % signs partying with hex codes. When you shared these URLs with others, you didn’t have to retouch or delete anything. When Chrome’s address bar started autocompleting them, you knew exactly where you were going.

This might seem silly. The user interface of URLs? Who types in or edits URLs by hand? But keyboards are still the most efficient entry device. If a place you’re going is where you’ve already been, typing a few letters might get you there much faster than waiting for pages to load, clicking, and so on. It might get you there even faster than sifting through bookmarks. Or, if where you’re going is up in hierarchy, well-designed URL will allow you to drag to select and then backspace a few things from the end.

Flickr allowed to do all that, and all without a touch of a Shift key, too.

Any URL being easily editable required for it to be easily readable, too. Flickr’s were. The link names were so simple that seeing the menu…

…told you exactly what the URLs for each item were.

In the years since, the rich text dreams didn’t materialize. We’ve continued to see and use naked URLs everywhere. And this is where we get to one other benefit of Flickr URLs: they were short. They could be placed in an email or in Markdown. Scratch that, they could be placed in a sentence. And they would never get truncated today on Slack with that frustrating middle ellipsis (which occasionally leads to someone copying the shortened and now-malformed URL and sharing it further!).

It was a beautiful and predictable scheme. Once you knew how it worked, you could guess other URLs. If I were typing an email or authoring a blog post and I happened to have a link to your photo in Flickr, I could also easily include a link to your Flickr homepage just by editing the URL, without having to jump back to the browser to verify.

Flickr is still around and most of the URLs above will work. In 2026, I can think of a few improvements. I would get rid of /photos, since Flickr is already about photos. I would also try to add a human-readable slug at the end, because…
flickr.com/mwichary/sets/72177720330077904-alishan-forest-railway
…feels easier to recall than…
flickr.com/photos/mwichary/sets/72177720330077904

(Alternatively, I would consider getting rid of numerical ids altogether and relying on name alone. Internet Archive does it at e.g. archive.org/details/leroy-lettering-sets, but that has some serious limitations that are not hard to imagine.)

But this is the benefit of hindsight and the benefit of things I learned since. And I started learning and caring right here, with Flickr, in 2007. Back then, by default, URLs would look like this:

www.flickr.com/Photos.aspx?photo_id=54896695834&user_id=mwichary&type=gallery

Flickr’s didn’t, because someone gave a damn. The fact they did was inspiring; most of the URLs in things I created since owe something to that person. (Please let me know who that was, if you know! My grapevine says it’s Cal Henderson, but I would love a confirmation.)

Many people already linked to Terry Godier’s thoughtful essay about email and RSS and the dangers of skeuomorphism by default:

Email is where the metaphor made its jump from atoms to bits. “Inbox” was borrowed legitimacy. It sounded like that wooden tray, so it inherited its psychology. But the wooden tray had a constraint: physical space. A desk could only hold so much. The digital inbox had no bottom. Still, mostly real obligations. Humans writing to you, expecting responses.

This all resonated me, although only to a point. I long stopped paying attention to those unread counters in Gmail and even though I know they exist, they feel wholly meaningless. And I personally would prefer my RSS reader to work more like email, because worrying that I cannot catch up if I wait too long and old entries get recycled is actually adding stress for me.

But I’m thankful for someone else pushing back on the barrage of red dots and fake urgency, and just thinking about it all is worthwhile. I’m very open to the idea of building something that eschews numbers to begin with, and for trying different operating models. (I deleted Threads from my phone after it was pushing me toward the algorithmic timeline filled with outrage, which was detrimental to my mental health.) I could even imagine choosing different RSS feeds to have different rules – this one “cannot miss,” the other one “casual.”

I also want to talk about the essay’s presentation.

The site makes heavy use of scroll effects. Okay, heavy subdued use, but like most of these, this is presentational rather than semantic. In this story at least, it feels a bit more thoughtful and it does feel like it enhances the experience and atmosphere, starting with the ticking number at the very top.

Yet, there are challenges. First, it does seem like there’s a lot of subtle movement going on and at some point that becomes a distraction. Also, I don’t know if it’s a bug or a particular stylistic choice, but things do not reveal themselves until they are almost off the screen. As an example, this is not a screenshot in the middle of animation – this is the page in a resting state, where the bottom is impossible to read:

This property, combined with the fact that all these are always reversible (something that even the recent Death to Scroll Fade page that ridiculed these avoided) makes the essay fiddly and harder to read than it needs to be.

To author’s credit, there is an alternative static version provided and linked to at the very top. But that version is also styled differently, and has more of a “terminal” look.

Thinking out loud and building a set of principles out of these observations, I would personally do it this way:

• a static version should be stylistically indistinguishable from the dynamic version
• ideally, there would be an easily accessible switch between motion/no-motion, similarly to how some sites allow you to switch to dark/​light theme regardless of where you are in the story
• if the user specifies “prefer reduced motion” in accessibility settings, a static version should kick in automatically
• make the text effects finish as they scroll in, continuing the momentum on their own – don’t make them stop in the middle
• unless the animation is particularly important or gimmicky (by the way: I love a good gimmick!), going back and forward again should not replay it

I have recently stumbled upon two websites that try to do something interesting and inspiring when it comes to showing scale.

John Wallace’s Tangible Media Connection’s initial appearance might not feel very well-crafted, but jump to any page (for example this one) and it’s astonishing how great the photos of the objects are.

They’re great not just on their own (it’s really hard to photograph metals and plastics!), but also consistent with each other when it comes to angle, style, and – most importantly – scale. I am not sure if I have ever seen on online museum do this before. It’s very well worth checking out.

The other example is Neal Agarwal’s recent Size of Life. The whole website is delightful, with subtle music and sound effects, great handling of keyboard navigation and swiping, and so on. And the way it resizes objects and uses transitions to always keep you oriented is something a lot of other interfaces, even for productivity apps, could learn from.

Of course, now I wonder what the first website would feel like with the user interface of the second.

Neil Panchal writing in 2020 about a cool little page called diskprices.com:

The performance of this website is stellar. It loads almost instantly. And the list (although it’s not sortable) gets the job done, it is sorted by price already which is the most important attribute.

Diskprices.com deserves the UI/UX award of the decade. We’ve lost our ability to design user interfaces laser-focused on the user. Instead, we have purple gradients, scroll jacking, responsive bullshit, emojis, animations, and many other things designers do today. The utilitarian approach of Diskprices.com is refreshing, although the contemporary designers cast it off as ‘brutalist design’, thereby marking it as a statement of fashion.

But both the creators of the page and Panchal might be getting this wrong:

Do you need a graphic designer?
No. This site is designed to maximize information density, accessibility, and performance. More whitespace, colors, and icons won’t help.

I think this is incorrect. The creator of the page is a graphic designer, that just happens to be the perfect graphic designer for the job.

I stumbled upon this small page about friction by Carl Barenbrug. I found myself vehemently disagreeing with one example listed; I don’t think Undo Send is an example of friction, as to me it actually feels like the exact opposite (“Are you sure you want to send this email?” dialog box would be friction – just like the last example Barenbrug showed).

But this paused me in my tracks:

“Intentional pagination instead of infinite scrolling is progress with awareness.”

It made me realize that the only implementation of infinite scrolling I know is basically pretending the page has already been there the whole time… if it’s done well, and if you move slow enough, and if you don’t pay attention to the scrollbar, it really feels like the page goes on and on forever.

But… it doesn’t have to be that way. You could turn off the smoke or hide some of the mirrors. You could uncouple the gesture from what follows. You could add milestones (in the traditional sense of the word) after every X results. You could make the scrollbar react differently. Instead of frictionless scroll, you could force the user to bounce off of a bottom of the page in a similar vein as pull-to-refresh forces them to bounce off of its top.

I’m curious now. Did anyone ever experiment with infinite scrolling that feels… closer to pagination?

I love how this Byte magazine archive by Hector Dearman tries to do something different. It inspired me, and reminded me of the excitement of what Internet was supposed to be. I think we all wanted the web to feel more like this – fast, with infinite information right at your fingertips, the biggest library you could imagine at the comfort of your home.

I hope seeing everything in single, searchable place offers a unique perspective.

(The details of the zoomable UI are a bit wonky in practice, but one can imagine fixing all that.)

A week ago I asked on Mastodon and Bluesky:

What are you favourite well-made apps or sites? Phones and computers alike.

Doesn’t have to be “pretty,” but well-made according to whatever definition works for you.

I specifically made it kind of vague, and these are the answers I got. I grouped them into categories and added links. I am excited to dig into these and study them, but wanted to share a raw list as well in case this inspires some of you, too.

Thank you to everyone who participated! (Numbers in circles like ② or ③ mean more than one person nominated a given site or app.)

Info sites:

• Ian’s Shoelace Site ② “A «does one thing well» site. Great breadth and depth. Information architecture designed to help you discover/​find information, not sell you something. Loads fast. Still maintained after decades.”
• SCELBI Computer Museum. “Useful, tightly curated, organized, loads fast, no BS. A basic bootstrap thing, but there’s something magical about it. Small enough to be digestible in an hour, well set up for either research or just cool vibes . Partly bc subject itself is «small» but seems not only that.”
• Hyperion Records. “All the liner notes and song texts!”
• www.gov.uk
• plaintextsports.com

Interactive explainers:

• Bartosz Ciechanowski ③
• It’s Nicky Case!
• Neal.fun
• Making Software by Dan Hollick
• Alex Harri

Personal sites:

• “I’m in love with Maggie Appleton’s site. The general design and the illustrations, the content (from quick notes to polished essays), the way it creates a visual and conceptual taxonomy with the #digitalgarden concept.”
• Kottke
• Robin Sloan
• Robin Rendle
• Rasmus Andersson
• Ariel Salminen

Work and tasks:

• Mimestream ③ “It basically stays out of my way? Which is about as good as it gets these days. Also, it has just enough customization options to handle my sometimes complex number of gmail accounts (personal/​work, for various clients, etc.)”
• Things ② “The fanciest, most attention-to-detail software I know of.”
• Sup “Pretty niche. I’m thinking specialist interfaces for specialists here. Tools that become an extension of their users’ bodies and disappear in te use”
• CalendarBridge “<3 <3 <3”
• MyLifeOrganized
• Voice memos (iPhone)

Art/Games:

• “rekall for a simple, occasional, cyberpunk-ish retro mood board injection.”
• Good Sudoku
• Floor796
• Threes

Creative:

• Monodraw ② “for ASCII art”
• “Zerocam is the perfect no-fuzz-just-snap camera app”
• “I like Keynote. But am not completely objective about that.”
• Vectoraster “for halftones”
• Spectrolite “for colour separations”
• Darkroom
• Rayon (desktop)
• MagicaVoxel
• Fusion 360

Podcasts:

• Pocket Casts
• “Castro is still my favourite podcasting app…
• …although visually I like Queue more”

Social:

• “Telegram is the best messaging app in terms of UI design”
• “Locket is my fav «novel UX» app and its widget is always on my home screen”
• Phanpy (the Mastodon client)
• Reeder
• BarnOwl

Commerce:

• McMaster-Carr ④ “The best online catalog.” “Impossibly fast. Still in awe after all these years.” “It supports your cognition, including with contextual material, to find the thing you are looking for (or the thing you didn’t know you were looking for until you started looking). It helps you find the right part because of what they show, the right filters, and especially the contextual information (I think about the little scale they had to explain the different hardnesses of rubber, for example).”
• Cars&Bids. “Fast, functional, and easy to use. Not stunning, just utilitarian.”
• DigiKey

Writing and note-taking:

• iA Writer ② “Simple and effective, using it I always wish to write more but I forget it again.” “Has been consistently great for years.”
• “I’ve been using Bear ② by Shinyfrog for my notes for well over a decade now. Dependable, works great, no junk ware, and a reasonable price. Pretty to boot. The fact that in the 10+ years I’ve been using it, there’s only been a single major overhaul update is a feature, not a bug to me.”
• “Notability! Haven’t found anything else that matches the flexibility for handling imported files & photographs, typed notes, hand-drawn diagrams and mark-ups completely seamlessly within a single document. Unbeatable for handling both notes in class (uni) and on site (trade).”
• “Been using OmniOutliner daily for decades. Simple, focussed and matches the way I think. Lots of ways to make lists and outlines but this one works for me.”
• WriterDuet

Music:

• “The radio station WFMU streams online, and also has a website where you can log in to chat with other listeners and interact with the playlist. The degree to which it does what you want it to do is stunning. It doesn’t get in your way or make you learn a new paradigm; it just makes it easy to do what you want to do. It’s a lesson in design for any UI/UX people.”
• Ishkur’s Guide To Electronic Music. “This website maps out all the sub-sub-sub-genres of electronic music, with descriptions and samples. I think that the fine-grained classifications are comical, but they do an excellent job of what they’re doing.”
• “Easy Metronome is a simple elegant loud phone metronome that is super easy to use even for weird time signatures.”
• “Pro Metronome is also excellent. I’ve used it for over 10 years and it stubbornly refuses to abandon its skeuomorphic leather and big clicky scroll wheel”
• “I really appreciate the Apple Music Classical app (even though it exists in this odd liminal space beside Apple Music) having spent many years frustrated about how traditional music streaming services handle classical recordings.”

Travel:

• Flighty ②
• “I‘m travelling with Deutsche Bahn quite frequently, and while their own App (DB-Navigator) is quite good compared internationally, I prefer to track trains on Bahn Experte for its bare, technical and valid information and performance.”
• “The Man in Seat 61 is a goldmine for train travellers. At least in Europe, the information is really up to date and if you want to find pictures of the sleeper cars of the Romanian railway or the seat map of Prague - Berlin trains, it’s all there.”
• Transit
• Waymo’s app

Food and health:

• “The kiosks in Costco’s food court aren’t the prettiest to look at but they are S tier for responsiveness. You literally just press a button and immediately the item is added to your cart. You can order a hot dog and soda in under 5 seconds.”
• Paprika. “Love my recipe management.”
• Fitness Stats. “Simple, effective, and good looking.”
• Mela
• MacroFactor
• HealthFit
• The Way

Text editors:

• “I use Panic’s Nova an awful lot and it just has a really nice feel so I keep paying for it.”
• Sublime Text
• vim

Data transfer:

• “WebWormhole for functionality, encrypted data transfer between your devices or to your friends without installing anything. (There’s also a similar magic wormhole CLI tool.)”
• PairDrop. “Drop-dead easy file sharing on the local network.”
• “LocalSend is well made, because until sofar it aleay works, even when AirDrop doesn’t. And it also works on non-Apple environments.”

Other nerdy tools:

• RegExr. “A web-based tool to create or explain regular expressions.”
• “The Sway compositor. A keyboard-driven tiling window manager with dynamic tiling layout. I can’t even imagine trying to use a computer with floating, overlapping windows anymore; everything lines up perfectly and adjusting layout is a matter of a few extremely quick keyboard shortcuts. They take a concept—laying out multiple windows on a display without gaps or overlaps—and build a fast, coherent interface around that concept, and it works fantastically.”
• “The original HP 42S calculator packed a lot of power into a convenient and ergonomic enclosure, and Free42 is a very tasteful recreation and expansion of that device for modern platforms.”
• Beyond Compare (Linux version)
• Alfred
• Genius Scan

I didn’t know where to put these:

• “The Kanji Study dictionary on Android has a wild amount of polish, I’m consistently impressed by how much effort has been put into it, especially because it’s sold for a (admittedly high) one-time fee.”
• Sim Daltonism
• Homey

Meta:

• “I happen to maintain a list of my favourite apps. (And being well-made is sort of a pre-req.)”
• Web app directory and Mac app directory

I added a table of contents UI to the most elaborate essays on my site, and then wrote about some of the design details and choices I made there. Let me know if this is an interesting case study! I tried to do something new here with tons of mini videos.

At the bottom, I will also be collecting other implementations I see that are interesting alternatives to my approach.

This 13-minute video from Wes Bos analyzes this today-almost-mythical McMaster-Carr website and figures out why it’s so fast.

It’s perhaps more technical than what I usually link to, but shows what can happen if someone really cares about performance. What’s interesting to me is that the author posits that it’s actually not an old website that is fast because it’s old… it’s actually kind of a melange of various techniques throughout the decades, from vintage solutions like spriting images, to more modern like JavaScript’s page history API, or pre-caching DNS.

Just visiting the website and clicking around can be inspiring because it reminds one that we gained a lot of computing power and network speed over the last decades, but most websites squander it. Not this one.

And it’s sad this kind of approach of a website appearing and not changing (no reflow, no pop-ups, no endless spinners, no infinite scrolls) feels so rare.

However, two caveats:

At around 7:35, Wes says “nothing else moves”… Oh yeah, it does. It’s perhaps my curse that I notice these things.

Also, the homepage now has an animated, delayed green banner you can see at the photo above. I hope they’re not losing their way.