Command and control

I’ve been banging on for a while now about how much I’d like a declarative option for the Web Share API. I was thinking that the type attribute on the button element would be a good candidate for this (there’s prior art in the way we extended the type attribute on the input element for HTML5).

I wrote about the reason for a share button type as well as creating a polyfill. I also wrote about how this idea would work for other button types: fullscreen, print, copy to clipboard, that sort of thing.

Since then, I’ve been very interested in the idea of “invokers” being pursued by the Open UI group. Rather than extending the type attribute, they’ve been looking at adding a new attribute. Initially it was called invoketarget (so something like button invoketarget="share").

Things have been rolling along and invoketarget has now become the command attribute (there’s also a new commandfor attribute that you can point to an element with an ID). Here’s a list of potential values for the command attribute on a button element.

Right now they’re focusing on providing declarative options for launching dialogs and other popovers. That’s already shipping.

The next step is to use command and commandfor for controlling audio and video, as well as some form controls. I very much approve! I love the idea of being able to build and style a fully-featured media player without any JavaScript.

I’m hoping that after that we’ll see the command attribute get expanded to cover JavaScript APIs that require a user interaction. These seem like the ideal candidates:

There’s also scope for declarative options for navigating the browser’s history stack:

  • button command="back"
  • button command="forward"
  • button command="refresh"

Whatever happens next, I’m very glad to see that so much thinking is being applied to declarative solutions for common interface patterns.

Have you published a response to this? :

Responses

Luke

@adactio glad to see you’ve had similar ideas! Copy is definitely on our radar (in fact I’ll update the explainer to point that out). Share was another one that’s been raised. Coming up with the right behaviours under various circumstances will take discussion but I like to think we can manage it. Fullscreen was another one that came up because of video controls, currently we’ve named it request-fullscreen in that explainer.

# Posted by Luke on Thursday, March 20th, 2025 at 4:27pm

Thain

@Lukew I subscribed to the implementation bug in firefox, I can’t wait to see this implemented everywhere. Thank you and @keithamus for all the work. It’s my preferred new feature since many years in the web platform :)@adactio

# Posted by Thain on Thursday, March 20th, 2025 at 5:10pm

15 Shares

# Shared by Mia (web luddite) on Thursday, March 20th, 2025 at 3:37pm

# Shared by Zach Leatherman on Thursday, March 20th, 2025 at 3:52pm

# Shared by Nilesh Prajapati on Thursday, March 20th, 2025 at 3:52pm

# Shared by Mr Peach on Thursday, March 20th, 2025 at 3:52pm

# Shared by Mia (luddite) on Thursday, March 20th, 2025 at 3:52pm

# Shared by Luke on Thursday, March 20th, 2025 at 4:40pm

# Shared by Kai on Thursday, March 20th, 2025 at 5:11pm

# Shared by Prateek Rungta on Thursday, March 20th, 2025 at 7:13pm

# Shared by Oblomov on Thursday, March 20th, 2025 at 7:44pm

# Shared by Curtis Wilcox on Thursday, March 20th, 2025 at 10:24pm

# Shared by Sebastian Gfeller on Thursday, March 20th, 2025 at 11:30pm

# Shared by Leon Miller on Friday, March 21st, 2025 at 3:01am

# Shared by Thomas Steiner :chrome: on Friday, March 21st, 2025 at 7:30am

# Shared by Léon van Kammen on Friday, March 21st, 2025 at 8:03am

# Shared by Dave 🧱 on Friday, March 21st, 2025 at 6:59pm

44 Likes

# Liked by claas on Thursday, March 20th, 2025 at 3:37pm

# Liked by Ondřej Pokorný on Thursday, March 20th, 2025 at 3:37pm

# Liked by Mia (web luddite) on Thursday, March 20th, 2025 at 3:37pm

# Liked by emerssso on Thursday, March 20th, 2025 at 3:37pm

# Liked by sh03 on Thursday, March 20th, 2025 at 3:51pm

# Liked by felix on Thursday, March 20th, 2025 at 3:51pm

# Liked by Daniel Bayley 🇺🇦 on Thursday, March 20th, 2025 at 3:51pm

# Liked by Mr Peach on Thursday, March 20th, 2025 at 3:51pm

# Liked by Nilesh Prajapati on Thursday, March 20th, 2025 at 3:51pm

# Liked by Mia (luddite) on Thursday, March 20th, 2025 at 3:52pm

# Liked by Zach Leatherman on Thursday, March 20th, 2025 at 3:52pm

# Liked by Seth Rubenstein on Thursday, March 20th, 2025 at 3:52pm

# Liked by Dion on Thursday, March 20th, 2025 at 4:06pm

# Liked by beep on Thursday, March 20th, 2025 at 4:06pm

# Liked by Brian Kardell on Thursday, March 20th, 2025 at 4:20pm

# Liked by Geri Reid on Thursday, March 20th, 2025 at 4:20pm

# Liked by Ben Callahan on Thursday, March 20th, 2025 at 4:20pm

# Liked by Luke on Thursday, March 20th, 2025 at 4:40pm

# Liked by Joyce Park on Thursday, March 20th, 2025 at 4:56pm

# Liked by Kai on Thursday, March 20th, 2025 at 5:11pm

# Liked by JoachimTillessen on Thursday, March 20th, 2025 at 5:42pm

# Liked by Stephanie Hobson on Thursday, March 20th, 2025 at 6:19pm

# Liked by Jordi Sánchez on Thursday, March 20th, 2025 at 6:50pm

# Liked by Brooke on Thursday, March 20th, 2025 at 7:13pm

# Liked by Yuval Allweil on Thursday, March 20th, 2025 at 7:23pm

# Liked by naz on Thursday, March 20th, 2025 at 7:44pm

# Liked by Oblomov on Thursday, March 20th, 2025 at 7:44pm

# Liked by Jakov Kovac on Thursday, March 20th, 2025 at 8:18pm

# Liked by Dan Connolly on Thursday, March 20th, 2025 at 9:11pm

# Thursday, March 20th, 2025 at 10:12pm

# Liked by RogerPence on Friday, March 21st, 2025 at 12:37am

# Liked by Tony Chu on Friday, March 21st, 2025 at 12:37am

# Liked by Leon Miller on Friday, March 21st, 2025 at 3:01am

# Friday, March 21st, 2025 at 7:07am

# Liked by Fatih Altinok on Friday, March 21st, 2025 at 7:07am

# Liked by Marcel Wiessler on Friday, March 21st, 2025 at 8:03am

# Liked by keithamus on Friday, March 21st, 2025 at 10:24am

# Friday, March 21st, 2025 at 1:53pm

# Liked by Ryosuke on Friday, March 21st, 2025 at 6:59pm

# Liked by Dave 🧱 on Friday, March 21st, 2025 at 6:59pm

# Liked by Daniel Yuschick on Friday, March 21st, 2025 at 7:30pm

# Liked by Vale on Saturday, March 22nd, 2025 at 12:59am

# Liked by Adrian D. Alvarez on Sunday, March 23rd, 2025 at 2:32pm

# Liked by 205TF on Saturday, March 29th, 2025 at 8:24pm

Related posts

Declarative design systems

Is your design system really a system …or is it more like a collection of components?

Declarative design

Defining the inputs instead of trying to control the outputs.

Making the website for Research By The Sea

Having fun with view transitions and scroll-driven animations.

Pickin’ dates

HTML web components for augmenting date inputs.

Schooltijd

Going back to school in Amsterdam.

Related links

Dark Ages of the Web

Notes on the old internet, its design and frontend.

Tagged with

A Tale of Two Buttons

In defence of the cascade (especially now that we’ve got CSS custom properties).

I think embracing CSS’s cascade can be a great way to encourage consistency and simplicity in UIs. Rather than every new component being a free for all, it trains both designers and developers to think in terms of aligning with and re-using what they already have.

Remember, every time you set a property in CSS you are in fact overriding something (even if it’s just the default user agent styles). In other words, CSS code is mostly expressing exceptions to a default design.

Tagged with

Designing Button States - Cloud Four

The canonical example in just about every pattern library is documenting button variations. Here, Tyler shows how even this seemingly simple pattern takes a lot of thought.

Tagged with

Links are not buttons. Neither are DIVs and SPANs by Karl Groves

Yes! THIS!

Tagged with

Retrofitting fluid typography | Clagnut by Richard Rutter

Here’s a taste of what Rich will be delivering at Patterns Day on Thursday—can’t wait!

Tagged with

Previously on this day

1 year ago I wrote Progressive disclosure defaults

If you’re going to toggle the display of content with CSS, make sure the more complex selector does the hiding, not the showing.

5 years ago I wrote Local

Think global, act local. In fact, just stay at home.

6 years ago I wrote CSS custom properties in generated content

They said it couldn’t be done.

14 years ago I wrote Reflection

A little bit of navel-gazing on this year’s geekout in Austin.

20 years ago I wrote Going up

My latest submission to the Mirror Project does quite a job at capturing the spirit of South by SouthWest.

20 years ago I wrote What's hot in Austin

Plenty of people have been writing about the contents of individual panels and presentations from South by SouthWest. I thought it might be interesting to give a broader overview and take a look at some recurring themes.

22 years ago I wrote No War On Monaghan

Let us hope that in the fog of war, no bombs intended for Iraq are used to bomb county Monaghan in Ireland.

23 years ago I wrote Pong: The Text-Based Game

There are many online emulators of classic arcade games.