Skip to content

Commit e78bbe2

Browse files
committed
First pass of explaienr
1 parent ee2a5e2 commit e78bbe2

File tree

6 files changed

+287
-2
lines changed

6 files changed

+287
-2
lines changed

README.md

+287-2
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,287 @@
1-
# page-collection
2-
A proposal for links that open multiple URLs
1+
# Page Collection
2+
3+
## Summary
4+
5+
This is a proposal to enable representing multiple links as a single unit, enabling users and authors to group multiple pages into a single link. An agent navigating to a page collection link will load and present all the collection’s pages in a grouping UI. We're calling such a link a "page collection".
6+
7+
Today, sharing multiple pages requires sharing a list of links. A receiving user must manually open each link in sequence. In some cases (when links are received in a native app), a user has no choice but to context switch between app and browser with each link. The user’s browser is unable to automatically organize and manage these related pages.
8+
9+
Page collections aims to allow the user agent to be more helpful in opening and presenting multiple related pages.
10+
11+
This explainer details ideas and challenges for this new form of linking. While some examples are provided, no grouping UI is suggested or mandated by this proposal; how such a link is presented is left to the discretion of the user agent.
12+
13+
## Status
14+
15+
This is a very early-stages proposal. We're looking for feedback about the ideas and feasibility. This explainer will evolve as the idea is refined. Critiques, alternate approaches and ideas are all welcome.
16+
17+
## Example Use Cases
18+
19+
* User-to-User sharing and collaboration
20+
21+
Alice and Bob are planning to take a summer trip together and are planning their vacation.
22+
23+
Alice does some research on potential accommodations and collects various options in open tabs in her browser. She requests that her browser generate a link from the multiple tabs into a single page collection link.
24+
25+
<p align="center"><img src="pc-example1.png" alt="Alice sharing a tab group"></p>
26+
27+
Alice sends the link to Bob for review via a messaging app.
28+
29+
<p align="center"><img src="pc-example2.png" alt="Alice sends a link to the collection via a messaging app"></p>
30+
31+
Bob clicks on the link which opens a tab group in his browser containing all the options Alice has presented.
32+
33+
<p align="center"><img src="pc-example3.png" alt="Bob sees the tab group opened in his browser"></p>
34+
35+
* Publishing
36+
37+
An industry newsletter collects interesting news stories (from various sites across the web) relevant to its subscribers. Each week it collects the stories into a single page collection link and adds the link to the weekly newsletter.
38+
39+
Each Monday, Pat opens the link to read the week’s news. Pat’s browser opens the collection as a carousel, allowing Pat to easily flip through the week’s news stories.
40+
41+
* Commerce
42+
43+
A small digital retailer wants to provide a comparison function on their website. Users can select multiple products and click “Compare”, which opens a collection featuring all the selected products.
44+
45+
Jen is shopping for headphones and is trying to decide between models. Jen uses the retailer’s comparison function to open a collection featuring headphones she’s interested in. Her browser allows her to put the collection in a comparison mode with side-by-side panes, allowing her to easily compare features of the various headphones.
46+
47+
* Native-to-Web
48+
49+
A native email client provides an “Open All Links'' functionality for received mail.
50+
51+
Jasmine receives a message from a colleague asking her to review several drafts. She clicks on “Open All Links” and the mail client collects all links in the message and concatenates them into a single page collection link. The client then invokes an OS API to open a URL with this link.
52+
53+
Jasmine’s default browser is opened and displays a collection featuring all of the links from the e-mail message. Jasmine reviews all the drafts before returning to her mailbox to reply to her colleague.
54+
55+
## UI Treatment
56+
57+
Opening multiple pages simultaneously requires a user’s browser to have some kind of UI to manage multiple pages.
58+
59+
Most web browsers today have a notion of tabs; some browsers have a UI for grouping multiple tabs together. An example of this is “Tab Groups”, available in Safari, and Chrome. Such browsers could open a page collection link in a tab group, or share a tab group as a page collection link. At a minimum, a browser could display a page collection as a list of clickable hyperlinks.
60+
61+
We envision browsers experimenting with new kinds of UIs in the future. For this reason, this proposal is UI agnostic. References to UI are provided for illustrative purposes but the exact mechanism of how an agent wishes to present a collection of links would be left to the agent’s discretion. This proposal focuses instead on the specifics of the linking mechanism to ensure such links would be interoperable on the web.
62+
63+
_Note: In addition, browsers could provide users with a convenient UI to create collection links; for example, by selecting multiple tabs to share. However, this doesn’t affect interoperability of these links so isn’t discussed here._
64+
65+
## Potential Implementations
66+
67+
We’re currently considering two options, with various trade-offs related to considerations in the sections that follow. These can be adopted either separately or together.
68+
69+
### HTTP Server Based
70+
71+
Browsers receiving a `text/uri-list` MIME type open it as a collection of pages in a grouped UI. To enable feature detection, conforming browsers would send the HTTP header `accept: text/uri-list` to let the server know that it’ll open a URI list in a grouped UI.
72+
73+
* _Question: can we add text/uri-list to all requests? Is that feasible performance-wise?_
74+
* _Question: can we reuse text/uri-list for this? Can we extend it to support some light options? E.g. theme-color, UI hints, etc. or would a new type be preferable?_
75+
76+
This enables authors and anyone with the ability to configure a server to share such links while providing a customized fallback for non-conforming user agents. It also relies entirely on existing web platform mechanisms.
77+
78+
<p align="center"><img src="pc-httpbased.png" alt="HTTP server response varies based on accept header. Implementing UAs receive text/uri-list response. Non-implementing receive an HTML page with a list" width="700"></p>
79+
80+
Advantages
81+
* Can feature detect at navigation time and serve a fallback
82+
* Serving `text/uri-list` to a non-conforming agent renders a plaintext representation
83+
* Uses existing web platform mechanisms
84+
85+
Disadvantages
86+
* Requires a server and technical skills to create a page collection link
87+
* Links must be stored on a server
88+
* Link rot - lifetime of the link depends on the server
89+
* Privacy - link contents are visible to the server operator
90+
* Unknown whether a link will open a collection (and can be changed over time)
91+
* Could be mitigated by requiring an attribute on a link, e.g. `<a href="..." allow="page-collection">`
92+
93+
#### Customization
94+
95+
It may be useful for link creators to customize the collection in various ways. Some examples:
96+
97+
* Provide a title for each page so the user agent can provide a human-readable list without fetching additional resources.
98+
* A “theme-color” that UI could use when presenting this collection
99+
* A "suggested-layout" that could suggest a preferred UI (e.g. "tab-group", "carousel", "side-by-side", etc.)
100+
* A “title” that applies to the entire collection
101+
* _Note: this has potential for misleading/phishing users so may not be a good idea_
102+
* A “favicon” that applies to the entire collection
103+
* _Note: this has potential for misleading/phishing users so may not be a good idea_
104+
105+
`text/uri-list` allows for comments by starting lines with a `#` character. A page collection can encode hints in comments to enable implementing UAs to customize the experience for users, e.g.
106+
107+
```
108+
<RESPONSE>
109+
content-type: text/uri-list
110+
111+
#title: Cantor's Diagonal Argument
112+
https://en.wikipedia.org/wiki/Cantor%27s_diagonal_argument
113+
#title: Cantor's First Set Theory
114+
https://en.wikipedia.org/wiki/Cantor%27s_first_set_theory_article
115+
#title: Cantor's Theorem
116+
https://en.wikipedia.org/wiki/Cantor%27s_theorem
117+
#title: Countable Set
118+
https://en.wikipedia.org/wiki/Countable_set
119+
#title: Uncountable Set
120+
https://en.wikipedia.org/wiki/Uncountable_set
121+
#page-collection-hints
122+
#{
123+
# theme-color: 'white',
124+
# title: 'Real analysis research',
125+
# favicon: 'https://en.wikipedia.org/favicon.ico'
126+
#}
127+
```
128+
129+
This mechanism could be used to extend functionality in the future.
130+
131+
#### What's being proposed?
132+
133+
This approach doesn’t require any fundamental new features in the web platform so what's the proposal?
134+
135+
Today, most user agents will simply display `text/uri-list` as a plaintext file.
136+
137+
The above section proposes:
138+
139+
* Standardizing user agents to present `text/uri-list` in a more user-friendly way, at a minimum, providing a clickable list of links to the user.
140+
* Implementing user agents send an `accept: text/uri-list` header in the request to inform the server it can present it in a user-friendly way
141+
* Standardize the comment-based micro syntax, providing hints that agents can use to improve the visual presentation of the collection.
142+
143+
144+
### URI Based
145+
146+
The server based approach is a high bar for a typical user that just wants to share a set of tabs with a friend. User agents and third-parties can provide services that enable users to create and host such links but these come with various drawbacks related to usability, privacy, and robustness.
147+
148+
A URI based approach enables anyone to encode multiple resources into a single URI. A new URI scheme tells the user agent that the URI is a collection of links:
149+
150+
```
151+
collection:https://example.com;https://acme.org;https://w3c.org{theme-color:blue}
152+
```
153+
154+
Advantages
155+
* No need to host the link
156+
* Lifetime of collection is unbounded
157+
* Clearer to users and agents that the link is a collection, not an ordinary link
158+
* Can be easily modified, copied, pasted, etc.
159+
160+
Disadvantages
161+
* Very long links
162+
* For user-to-user sharing, can’t feature detect. Failure is a broken link
163+
* Initially, linkifiers (e.g. in a chat apps) may not catch that the received collection is a link
164+
165+
The last two disadvantages would hopefully dissipate over time; if most user agents adopt the proposal, feature detection would become less of an issue and the most popular linkifiers would be updated to support the new scheme.
166+
167+
In the meantime, these drawbacks could be mitigated by the server based approach or by wrapping collection links behind a feature detection service that redirects implementing browsers to the collection and others to a fallback:
168+
169+
<p align="center"><img src="pc-scheme.png" alt="HTTP server redirects a regular https link to a collection link on conforming browsers. Otherwise the server redirects to an HTML page with a list of links" width="700"></p>
170+
171+
172+
## Considerations
173+
174+
### Interoperability
175+
176+
Users and authors should be confident that their page collection links won’t result in a broken experience for recipients using a non-implementing user agent. While we intend and hope for page collections to become a standard implemented by all user agents, there will be un-updated user agents and certainly a period where support varies. Links across the web should work for all users.
177+
178+
We’ve considered several approaches for how to mitigate this:
179+
180+
* Provide feature detection so authors wishing to serve this to their users can detect whether the user agent lacks this capability and serve a list of plain links instead.
181+
182+
* Use a `text/uri-list` or similar MIME type response to indicate a page collection. On non-implementing user agents this will fallback to displaying the response which at least provides users with a listing of links. As a stop gap, non implementing user agents could linkify a `text/uri-list` response to make it easy for users to navigate through the list.
183+
184+
* Sharing features can wrap links in a redirector service which can feature detect whether the user’s browser supports page collections natively and redirect to either a page collection link or a fallback page.
185+
186+
These approaches are explored in more detail in the Potential Impementations section above.
187+
188+
### Abuse and Security
189+
190+
We’ve considered some avenues for abuse and how they can be mitigated:
191+
192+
* Using collection links to spam a large number of popups.
193+
194+
Most browsers today include a popup blocker. Page collection links should also be blocked unless the user took an action.
195+
196+
An opened page collection should be grouped in the browser’s UI somehow so that an unwanted link doesn’t disorient or frustrate a user and the whole group can be easily closed at once.
197+
198+
* Resource usage
199+
200+
A page collection could be made to include many pages. Naively opening such a link could lead to degrading the performance of the user's device or crashing it altogether. Additionally, some browsers attempt to put origins into their own processes as a mitigation against [Spectre](https://leaky.page/)-like attacks. If an attacker can exhaust a user’s system resources they can force these defenses off.
201+
202+
To mitigate this, user agents should avoid loading pages until they’re presented (or about to be presented) to the user.
203+
204+
Some user agents already have similar “tab throttling” mechanisms for background tabs or when restoring sessions with many tabs.
205+
206+
Page collections could have a user-agent defined limit on the number of URLs in a collection; URLs beyond this limit would be truncated. A minimum could be standardized that would be guaranteed to work on all conforming agents. The agent can also provide UI to warn users about a large number of pages and ask for confirmation before opening.
207+
208+
User agents are also free to decide how many pages in a collection can be concurrently presented/loaded.
209+
210+
* Leaking data
211+
212+
Pages authored in a specific way can sometimes make themselves vulnerable to data leaks. For example, leaking scroll offsets in combination with fragment-ids or [Scroll-to-Text](https://xsleaks.dev/docs/attacks/experiments/scroll-to-text-fragment/). The single-navigation-per-click model of the web limits these leaks to a single bit. Enabling an attacker to load multiple pages simultaneously could be used to expand the scope of such attacks.
213+
214+
Similarly, there are [efforts to prevent user tracking](https://privacycg.github.io/nav-tracking-mitigations/) via URL parameters. Being able to open multiple links simultaneously could complicate those efforts (eg. by spreading user identifiers over multiple URLs/page loads).
215+
216+
* Link obfuscation
217+
218+
It’s helpful for users to see where a link will take them before clicking on it. Most user agents (when using a hover capable device, e.g. a mouse) show a link’s URL on hover.
219+
220+
A collection of links complicates this since the existing UI cannot convey to the user all the pages the link will load.
221+
222+
Today, link URLs can be obfuscated by malicious parties, for example: by changing the URL in a mousedown handler, so we don’t think page collections would make the situation materially worse.
223+
224+
However, to avoid surprising users, browsers can provide new UI to help users decide whether to open a collection. For example, by showing an interstitial popup when clicked that shows how many links are contained and a list of origins.
225+
226+
* Phishing
227+
228+
Care must be taken to prevent collections becoming a vector for phishing and related attacks. For example, disguising a malicious link within a list of trusted origins:
229+
230+
```
231+
collection:https://mybank.com/;https://mybank.evil.com/login;login.example.com
232+
```
233+
234+
User agents will load these URLs in their normal way, which includes any kind of phishing and malicious site detection services, for example, Google’s [SafeBrowsing](https://safebrowsing.google.com/) service.
235+
236+
237+
Browsers may require a per-origin permission to open page collections to mitigate these risks.
238+
239+
240+
### Privacy
241+
242+
In the case of server-based links or feature-detecting redirectors, the operators of those servers are responsible for storing the page addresses contained by the collection. Users would have to be aware that links they share using these services would be visible to the operator of the service.
243+
244+
Example: A user downloads an extension “Foobar” to generate collection links. The user selects multiple tabs and asks Foobar for a collection link to the selected tabs. Foobar uploads the URLs of the selected tabs to `https://foobar.com/upload` and provides a collection link the user can use to access it: `https://foobar.com/abcdefg`. The user shares this link with a friend; when loaded, the link opens all the same tabs in the friend’s browser. The page addresses in the collection are visible not only to the user and their friend but also to the operator of `foobar.com`.
245+
246+
Customization properties that issue requests (or simply tagged on URLs) could be used to send unintended information to a third party (e.g. a sender getting “read receipt” that their recipient has clicked on the page-collection link).
247+
248+
249+
### Accessibility
250+
251+
User agents should identify links as pointing to a collection when this is possible. This should be done in a way that’s available to accessibility tools like screen readers.
252+
253+
User agents should also take care to prevent cognitively overwhelming users when opening a large collection. For example, by limiting how many pages are displayed in the UI at once.
254+
255+
All the usual accessibility issues in UI apply; however, we believe these are all addressable given browsers’ existing multi-page tab UIs.
256+
257+
258+
## Prior Art
259+
260+
* [text/uri-list](https://www.ietf.org/rfc/rfc2483.txt) - A MIME type for sending multiple URIs. Often used as a mime type when dragging links.
261+
262+
* [text/x-moz-uri](https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API/Recommended_drag_types#:~:text=Mozilla%2Dspecific%20type-,text/x%2Dmoz%2Durl,-.%20If%20it%20appears) - Similar to above but allows providing titles for each URI
263+
264+
* [Open Multiple URLs](https://github.com/htrinter/Open-Multiple-URLs/) - Chrome and Firefox extension
265+
266+
## Alternatives Considered
267+
268+
### data:text/html URI
269+
270+
Using a `data:text/html` URI to navigate to an HTML page containing a list of the links, or feature-detect and redirect to a `collection:` link.
271+
272+
This was discarded as an option as `data:` URIs are considered non-secure, would lead to exceptionally messy URIs, and would be difficult to linkify in messaging apps.
273+
274+
### Fragment Directive
275+
276+
Use a new fragment directive to append a list of URLs as a page collection:
277+
278+
```
279+
https://firstpage.com#:~:collection=https://secondpage.com;https://thirdpage.com
280+
```
281+
282+
Fragment directives are stripped from the URL during navigation, so they won’t cause unintended interactions with script on the page.
283+
284+
This has the benefit that a user opening this link in a non-implementing user agent will load `firstpage.com`, rather than seeing an error page.
285+
286+
This option was rejected since an error page may actually be a less-confusing experience compared to receiving a single part of a collection.
287+

pc-example1.png

254 KB
Loading

pc-example2.png

31.8 KB
Loading

pc-example3.png

328 KB
Loading

pc-httpbased.png

73.3 KB
Loading

pc-scheme.png

77.3 KB
Loading

0 commit comments

Comments
 (0)