Hacker News new | past | comments | ask | show | jobs | submit login
Quotebacks – Quote the Web (quotebacks.net)
247 points by tobyshorin 60 days ago | hide | past | favorite | 63 comments



There's also a nice blog post at https://tomcritchlow.com/2020/06/09/quotebacks/

(via https://news.ycombinator.com/item?id=23467586. There were a few comments there but we moved them hither.)


This sounds very similar to Xanadus concept of Transclusion, I'm kind of sad this kind of context-preserving inclusion never really made it into the modern web. But due to the nature of Xanadus fixed and versioned documents, transclusions can't be broken. :(


Metabrainz and their wiki/documentation/data sites do this. See https://musicbrainz.org/doc/WikiDocs for how they implement it.



I decided to take this out for a test drive, and see how it worked.

Verdict: it's nice! I'll be using this.

I tried it out with an HTML page here, for some JavaScript tutorials taken from medium, dev.to, and one illustration (also embedded) not using this library from Pinterest.

https://www.mediazed.com/learn-javascript.html

Disclaimer: That's my own page. Normally if I could I'd also provide a link or explanation of the content, that doesn't link to my own page. However, the content here is pointless without being embedded in a webpage. But if you just want to see what it looks like without following the link, I took a screenshot.

https://imgur.com/43AOji5

I could see this being useful for me for quotes in an article. It looks nice and does what it says on the tin. For a quote or two, I'd recommend it.


I can't tell, from the blog post or comments here, how the web component is an improvement on just using <blockquote> and <cite>. The styling does look nice, but is that the only real difference?


Nope, beats me. As far as I can tell it's just text with a hyperlink. Clicking the link doesn't even take you to the location on the page the quote is from.


I just discovered this from the same author: http://subpixel.space/entries/open-transclude/

It's a much more interesting development in the same direction! The implementation currently only seems to work when transcluding content on the same domain, rather than quoting anything from across the web. Having discovered this, I feel I have a bit more context for where the creator is coming from!


Nice. How to handle dead links? A growing problem with hyperlinking across sites in general.

An idea: when you take a quote, send the webpage through archivebox.io and pin the resulting artifacts to IPFS... or other repository the author can maintain. Key feature: the quoting author maintains the copy of the document they are quoting. The embedded "quote" fixture on the page will always point to the original URL and citation date alongside the author's "copy" of the page if it happens to die or change.


In practice: images.

It's not best-practices or accessible but works across the board, from academic PDFs to tweets. There's also more options for annotation (color highlighting, sarcastic emoji etc) in an image.


IPFS was designed to solve this problem of the impermanence of the current web.

This article kind of says it all: "The InterPlanetary File System Wants to Create a Permanent Web"—https://www.vice.com/en_us/article/78xgaq/the-interplanetary...


But in practice what that means is that if you hold a reference to some page in your article you can/should keep it alive by seeding it.


Yes!


It would be lovely if you could fork a webpage the same way you do to a git repo.


For those who likes this idea I think this a feature of one alternative browser (Maybe the Beaker browser? I could fibd this easily but there might be more: https://docs.beakerbrowser.com/beginner/hosting-hyperdrives)


For anyone curious, Beaker is a browser that can download websites over the Hypercore protocol, which is similar to Bittorrent. Bittorrent is just a way to download files, so why not HTML and images? This is cool because anyone can seed a site to keep it up forever. To fork a site, you just download it and rehost it yourself after making whatever changes you want.

Note that Hypercore is different from Bittorrent in that you can actually update your site after you originally create it, although older versions are always available.


I usually quote webpages by writing a <blockquote> with a hyperlink to the original, and avoid embedding tweets for privacy and performance reasons.

If the source supports [Webmentions][https://webmention.net/], I'll send it too.


I love the quoted UI! Can't wait for the Firefox extension, if you need help, I'm happy to pitch in!


We're working on a FF version! Turns out porting the chrome one is fairly straightforward. Watch this space!


Nice! Will definitely use once Firefox version is available.


I too can't wait for the FF version :)


Shouldn’t the demo quote link to https://sometimesright.com/2020/04/25/blogging-vs-twitter/ ? (instead of the homepage)


You're right! Just fixed it. Good catch.


This reminds me of Microformats, which is an exciting throwback to when I was just getting into web development.

http://microformats.org/wiki/what-are-microformats


This is one more example of my federated blogging idea I've been asking for here on HN. I want blogging with the independence of the original but the discoverability of a well-done aggregator (more human, substance over SEO or outrage, depth over trendiness).

Blogging could be so much improved if there were ways to discover other writers doing interesting things from one writer that you enjoy. Modes of intertextuality like this are key to building healthy, interesting communities.


Have you looked at the http://IndieWeb.org tools and Webmentions? http://micro.blog offers it all with little hassle.


Nice to see this. Was using highly at some point, before Twitter bought it [1] and shut it down.

[1] https://techcrunch.com/2019/04/17/twitter-highly/


Anybody know any good JavaScript-free alternatives to this? Or should I just stick with quoting people and linking their content the old-fashioned way?


Quotebacks falls back to a basic <blockquote> if JS is not enabled.


Ahh, cool! Thanks for the info.


Fantastic work. Are these stored in a searchable way? I couldn't tell from the page what database the quotes are stored in and whether there is an easy way to access it other than exporting to JSON.

Edit: Looking at the code it looks like they're indeed searchable with the help of fuse.js (fuzzy search library): https://github.com/Blogger-Peer-Review/quotebacks/blob/maste....


For another previous effort, @bradneuberg built some stuff around this a while back. See http://forge.blueoxen.net/purple-include/ and http://codinginparadise.org/weblog/labels/purple%20include.h....


I like the idea of quoting other sites in a standard way, and the browser extension looks great, but I really don't want to have to deal with JS just to include a quote in a post. Since it doesn't ping the author (like a Pingback) I'm not sure the presentation format has a lot of value...

Where is the JS pulling the title and image from? OpenGraph?


How can these be forged? Say a page no longer exists, it could be possible to forge a quote and play a little game of disinfo?


> How can these be forged? My body has no bones.

I'm sorry about your bones, but you can already lie and misquote on the Internet!

Although I suppose the frame around the quotes that this service provides does give the text an air of authority.


Yes, technically you can forge them just like you can launder any other block quote. We're looking for the right decentralized storage solution so we can have verified provenance though. Any ideas that are easy-ish to implement for someone who's not a pro web developer?


Maybe you can collaborate with the internet archive?


Given that we're just talking HTML, I don't see how you could meaningfully prevent bad actors, absent storing screenshots of the original text -- and even then (see any number of fake tweets that circulate). Hypothetically, instead of linking to the original source, I suppose it could link to the Wayback Machine version of the text, but I don't think that's a helpful default way to link to people's work. As a fallback when sites disappear, sure, but otherwise...


Here's one possibility. Creating a quoteback could: 1. tell archive.org to create a snapshot of the page 2. store a link both to the human-friendly version of the page and the archive snapshot 3. then the reader's browser (rather than the webpage hosting the quoteback) could verify that the quote is present either at the linked source or at the snapshot of the linked source.

In the happy path (where the quoteback is genuine) the browser could indicate to the user that the quoteback is genuine and the link would take the user to the normal website if it still has the quote, otherwise to the archive snapshot.

In the unhappy path (where the quoteback is disingenuous) the browser could notify the user that the quoteback is disingenuous.


Great path, a few hundred lines of code, less if you can use the ia python library.


There could be an extension to the model, where a quoter can provide a snippet to the author's website and request a signature (perhaps from a common path like /.well-known/quotesign.)

If the snippet does indeed come from the website in question, the website will return a signature which the quoter can embed along with the snippet on their own website.

The signature would prove that the content came from the same person who controls domain X (as attested by the CA fo your choice). The user agent can display all this information where the content is quoted.


Even the Wayback Machine will not exist and there will probably be a reincarnation of it with archived copies of Wayback URLs. This is why blockchain tech is so exciting. Very soon everything can be cryptographically proven to have existed, stopping people from rewriting history and denying things like The Holocaust etc


> Very soon everything can be cryptographically proven to have existed, stopping people from rewriting history and denying things like The Holocaust etc

Sounds nice, but my gut feeling is that you wildly underestimate how far people will go to work around anything that could change their beliefs.

This seems to hold true on all sides of the political spectrum, in art as as well as in science and the only difference is what beliefs people stick to.

As a deeply religious person this might come of as really ironic and the irony is not lost on me: quite the contrary and for that reason I've thought about it multiple times.


Rigid, ingrained beliefs can't beat a math problem


Did you hear about the man who believed he was dead? His doctor tried everything but couldn't convince him he wasn't a corpse. Finally, in exasperation, the doctor says, "Look, corpses don't bleed right?"

The man agrees, "Yeah, corpses don't bleed."

The doctor pokes him in the arm with a needle and blood wells up.

The man looks at his bleeding arm in astonishment and says, "I'll be damned! Corpses do bleed!"

(This is a true story. I think it's in "The Man Who Mistook His Wife for a Hat" IIRC.)


Today: Maybe subresource integrity? That would let you advertise the exact state of the webpage, but you'd need to save it somewhere for verification.

Alternative: Isn't there some way to save an HTTPS request in a way that others can verify that the webpage was signed with an authorized certificate?

Future: I wish authors would sign their content directly rather than depend on TLS and certificate authorities. P2P networks do this well (because they have to) but it hasn't caught on in the rest of the web.


> Isn't there some way to save an HTTPS request in a way that others can verify that the webpage was signed with an authorized certificate?

That sounds a lot like "Signed HTTP Exchanges"[0], which has some support in Chrome but doesn't automatically provide a way of checking quotes in web pages.

[0] https://wicg.github.io/webpackage/draft-yasskin-http-origin-...


There was TLS-N[0][1], which did something like this and emerged for blockchain use cases and worked with only minor tweaks for the website provider IIRC. Sadly that looks pretty much defunct now.

[0]: https://eprint.iacr.org/2017/578.pdf

[1]: https://github.com/tls-n


The first example links to an index page; it should probably link to the specific page itself.

I suggest trying out ScrollToTextFragment https://github.com/WICG/scroll-to-text-fragment if you haven't already I know it was a little controversial and it's currently Chrome-only, but it might improve the UX for some people.

Very cool, though!


Firstly - good catch. I updated the link.

Secondly - I wish I could get ScrollToTextFragment to work reliably. I've tried integrating this into Quotebacks and every time it just works so sporadically that I roll it back. Somehow Google thinks this is robust and stable enough to put into production but my experience is very hit/miss.


love it! a leap forward in usability. I'm already using some Open Transclude javascript on my own site and am looking forward to using this :)


woah you are? hell yeah which post?? Link me!!



It doesn’t look good on mobile. Just letting you know.


This is exciting! Thanks for doing this.


I love how Quotebacks can be used together with Hypothesis. I blogged about Quotebacks and its use with Hypothesis here: https://niklasblog.com/?p=24912


Really appreciate the work. I'll be circling back once the Firefox plugin is out.


Some related earlier concepts from the Web: https://en.wikipedia.org/wiki/Linkback


How does this compare in practice to things like dissenter?


Sort of reminds me of a one-sided webmention.


It is not working for me in Linux.


this is great, now we need another one for comments and another one for subscription


Ted Nelson who coined the term _hypertext_ in _1963_ claimed in Werner Herzog’s documentary “Lo and Behold” that his original idea for “copy and paste” would always link back to the original. This article below based on the Herzog interview has more context but not the exact _quote_ (context pun intended) that I remember from the documentary.

Full interview of Ted Nelson from “Lo and Behold”: https://m.youtube.com/watch?v=Bqx6li5dbEY

> Nelson, who was featured in Werner Herzog’s latest film, Lo and Behold, believes that instead of the existing formats we use online, where text often mirrors the constraints of paper, we should have a system of two-way links that would allow readers to see the context of any quotation...

> There are a few offline examples, such as the Talmud and the Rosetta Stone, where text is read side-by-side. Nelson believes this is how online documents should be constructed.

> “As far as I’m concerned, this is the way literature should develop,” he says. “I don’t consider this technology, I think it’s literature. Being able to see visible connections between pages seems to me absolutely fundamental.”

> Nelsons says this setup would be the ideal format for reading annotations, additional details, correspondence, and disagreements: “It’s essentially a different genre of writing.”

> As Nelson sees it, our current use of online documents is very limiting. He’s particularly disturbed by how we use the words cut and paste. When the Macintosh was introduced in 1984, cut came to mean “hide this piece that I’ve just marked in an invisible place,” and paste became “plug whatever’s in this invisible place to where I’m pointing.”

> “To me that was an outrage because no one has yet got a decent re-arrangement system that allows you to see the all the parts of the arrangement as you’re writing,” Nelson says. “Those words meant something entirely different until 1984.

> Balzac, the French novelist, carried a razor blade around his neck for cutting up his manuscript. Tolstoy would cut up his manuscripts and leave all the pieces around the floor. This is true cut-and-paste, where you’re re-arranging on a large scale and able to see the relationships between parts.”

> Ironically, Nelson is friends with Larry Tesler—the man responsible for our modern use of cut and paste—but still calls their mislabeling “a crime against humanity.”

https://qz.com/778747/an-early-internet-pioneer-says-the-con...

https://en.m.wikipedia.org/wiki/Ted_Nelson




Guidelines | FAQ | Support | API | Security | Lists | Bookmarklet | Legal | Apply to YC | Contact

Search: