Hypermedia Controls: Feral to Formal (PDF: ACM HT'24)
dl.acm.org
dl.acm.org
excited about it because i believe it is the first academic paper to focus on and provide a formal definition for hypermedia controls in particular, rather than treating them as part of a larger system
Also, where's the source repo (for the paper)?
Two things come to my mind as better exhibiting the control offered within the page:
1. Schema.org Actions/EntryPoints, which can markup the things users can do on a page with additional details & info, formalizing what buttons might offer. This is used by Gmail to let HTML emails include quick actions.
> Today, we are excited to start the next chapter of schema.org and structured data on the Web by introducing vocabulary that enables websites to describe the actions they enable and how these actions can be invoked.
http://blog.schema.org/2014/04/announcing-schemaorg-actions.... https://schema.org/Action
Unfortunately the docs only show the json-ld markup! Which is really a data island, off the hypertext! How horrible, just so trashy it's done like this! Ideally microdata (or rdfa) would be used, to enrich the page as it already is. You have to tab to it, but available on the Gmail docs: https://developers.google.com/gmail/markup/actions/declaring...
2. Invoker actions (renamed Commands) are starting to be implemented in browsers, which allows components to wire themselves to each other, without js. Buttons triggering modals, tooltips wiring to elements... This stuff has always been un-hypertext, has been developers writing their own js to wire the page up. But now the page itself can express control & wirings.
And with custom events and custom actions, it's possible to imagine a vast expansion of hypermedia control, of making visible the machinery & linkage of hypertext.
It seems to me that part of a hypermedia control includes what kinds of inputs are accepted and how they are included into a resultant request. Whether this is an HTML form with input type attributes or Swagger/OpenAPI definitions, there's a generic definition of request marshalling needed I believe.
Clicks on a page (and even the actual of typing or selecting an image) are part of the User Agent's interface: how the User Agent would interpret those hypermedia controls exposed by the Reply Reosurce into things the user can do. But the user Agent itself then needs to Marshall the result of user input into some kind of request. In HTTP this is a form and resulting POST request in urlencoded or multipart format.
A generic definition of this whole concept is needed.
H-Factors ( http://amundsen.com/hypermedia/hfactor/ ) have also been useful to me in the past for the same reasons.
I would argue that this overwhelmingly is the common case—viz:
- twitter.com
- youtube.com
- facebook.com
- reddit.com
... etc. It is only through artificially restricting your focus outside the way that the Web is used in practice—and optionally also being so blinded by one's milieu (that of professional programmers who unlike the average person might spend between, say, 25–50% of their waking hours on a typical day at least partially focused on publishing to the origin associated with whatever they're getting paid for at the moment, but nonetheless live the rest of their lives like everyone else publishing to and consuming from the major platforms)—that you can claim something like the above.
- background
- examination of existing hypermedia controls in HTML
- formalization & definition
- generalization
- application (htmx & hyperview)
The TLDR is:
> So a hypermedia control (again, from a functional standpoint) is an element found in a hypermedia document that initiates a hypermedia exchange by a hypermedia client in response to some event, thereby updating the client state in some manner (i.e. with some disposition)
In this case, the abstract says: "This functional mechanic is used to create first an informal and then formal definition of the term "hypermedia control". Using this formal definition we then derive a generalization of the concept, referring contextually to the World Wide Web." Therefore, we should expect to look in the paper for the definition.
We find the "functional definition" at Definition 4.1: "A hypermedia control is an element that responds to an event trigger by issuing a type of request to a URL and placing the response at some position within the user agents viewport." The "formal defintion" then follows immediately after, but can't be quoted here because it requires LaTeX notation and a full page of text.
As a possible non-academic summary is that a hypermedia control can be defined as:
An interactive element within a hypermedia system (like a web page) that allows users to trigger actions, typically resulting in new content being loaded or displayed. Common examples include: links (clicking loads a new page); buttons (clicking triggers an action like submitting a form); form inputs (entering data and submitting retrieves results); images with embedded links (clicking loads new content).
The key aspects of a hypermedia control are that it responds to a user action (click, submit, etc.); it causes some kind of network request (usually to fetch new content); it specifies where that new content should go (replace the whole page, update a specific area, etc.)
EDIT: It seems the authors also consider images and iframes to be controls since they also make requests and add content to the viewport.
"Examining the hypermedia control mechanic of links, forms, image tags and iframes in HTML, we see the following common functional pattern emerge: For each of these controls: (1) An event trigger (click, submit or load) (2) Causes a particular type of HTTP request issuance (3) That request is made to a resource location specified by a URL (4) The content of the HTTP response is then placed in the user agent viewport Within the context of HTML, this gives us the following functional definition of hypermedia controls as an element that incorporates this hypermedia control mechanic: Definition 4.1 (Hypermedia Control). A hypermedia control is an element that responds to an event trigger by issuing a type of request to a URL and placing the response at some position within the user agents viewport."
They mention the limitations of these existing hypermedia controls within HTML. In general, existing HTML controls don't allow the developer to choose any type of HTTP request to be sent from any type of HTML element and target any part of the page.
"in the absence of an extension mechanism hypermedia clients and servers must agree in advance on the types of hypermedia controls they will support. HTML includes a very powerful extension mechanism: JavaScript [47 ]. By taking advantage of this extension mechanism we are able to extend HTML and provide the generalized hypermedia controls outlined above to HTML authors."
"CONCLUSION In this paper we proposed an informal and then definition of the term "hypermedia control", derived from the implementations of four common such controls found in HTML: anchors, forms, im- ages and iframes. From this formal definition we then derived a generalization of the concept of hypermedia controls within the context of HTML. We then introduced htmx, a JavaScript library that implements these generalizations for HTML authors. We demonstrated two interactive patterns that can be implemented by HTML authors using generalized hypermedia controls. Finally, we introduced Hyperview, a mobile hypermedia that also implements the generalization we proposed. We demonstrated an interactive pattern achievable in Hyperview using this generalization, thus demonstrating that this generalization applies to hypermedia systems beyond HTML and the WWW."
Hypermedia is the way to organize content for consumption in non-linear way. Hypermedia systems are broader concept than client-server (single document or program can be a hypermedia system).
Formal definition can look like this: given a set of multimedia elements (text, audio, video, etc) and possible transitions between them, this set can be defined as hypermedia if there exist elements which can be reached from some entry element via multiple different transition paths.
A hypermedia system then is such system that allows users to consume hypermedia content by presenting multimedia elements and enabling users to transition between them.
Note that this definition doesn’t mention networks or protocols: collection of HTML pages, images, videos etc on local hard drive is still a hypermedia system despite that no network is involved.
Compared to a book or ordinary text document the core and the most important property of such system is that possible transitions are predetermined: designer of the system defines the possible ways to consume the content, while the book reader is free to start reading at any page. Networks, protocols, HTML, UI are less interesting implementation features at this stage. This definition opens many interesting opportunities to talk about before you go into technical details.
This is what I would expect from such paper, not school-level talks about links and buttons.
> We find the "functional definition" at Definition 4.1: "A hypermedia control is an element that responds to an event trigger by issuing a type of request to a URL and placing the response at some position within the user agents viewport."
You said:
> Note that this definition doesn’t mention networks or protocols
Neither does the given definition of hypermedia controls in the paper. So it seems that your respective definitions are perfectly compatible.