Zola ʕ•ᴥ•ʔ Bear Blog

Quotebacks: a new way to quote online

I love trying new tech. The above is the reason for what this post is about: Quotebacks, a new tool that allows you to generate quotations from the web. Here's an example:

Networked writing (aka blogging) has become increasingly important as a part of my identity. It’s the framework for creating lifelong friendships, finding rewarding client work and experimenting with ideas as a personal creative outlet.

So, Toby Shorin and I have created a small tool called Quotebacks. The ultimate goal is to encourage and activate a deeper cross-blogger discusson space. To promote diverse voices and encourage networked writing to flourish.

@tomcritchlow https://tomcritchlow.com/2020/06/09/quotebacks/

This video shows how it works where I create a quote and embed it in this WordPress post:

https://youtu.be/H0CzmJjOJZM

(Yes, it is that simple.)

The video shows myself quoting one of the Quotebacks creators. This is how you can do this:

  1. Install the Quotebacks Chrome extension.
  2. Go to any web page.
  3. Select text that you want to quote, hit ?+shift+s on Mac or ctrl+shift+s on Windows to save a quote on any site.
  4. Choose to copy the HTML embed code, copy the Markdown code, see all of your quotes, or close the window.

That's it. Done.

Quotebacks is three things:

  1. A web-native citation standard and quoting UX pattern
  2. A browser extension to create quoteback components and store any quotes you save to publish later.

@tomcritchlow https://tomcritchlow.com/2020/06/09/quotebacks/

Your quotes are stored in Chrome, which means they're on your computer. You can both export and import quotes from and to your computer.

Quotebacks even renders elements like lists in a pretty way; just see the quote above! I'm quite amazed that I don't have to change anything by hand: it's just...nicely presented!

One thing that I truly love about annotating the web is Hypothesis. It's a brilliant, open, highly usable, and wondrous tool, and more people are using it by the day. It's a different being than Quotebacks, but I'll explain why I am very eager to try both of these tools together.

The usual courtesy of quotation in blogs is adding a link to the source. When a reader clicks on that, they're taken right to the beginning. Any context from your post is erased. What if the link could retain some context from your thoughts around the quotation as they relate to your post? This is where the quotation linking to a Hypothesis annotation could prove useful.

CJ Eller https://blog.cjeller.site/contextual-quotes-with-annotation

Hypothesis can be used to comment on or highlight any text on the net. Every single annotation generates an URL; when somebody accesses that URL, they're not only taken to the page where your annotation exists, but to the exact point where your annotation is made.

Hence, what CJ Eller is referring to above, is to work as follows:

  1. Create an annotation in Hypothesis.
  2. Copy the URL for your annotation.
  3. Use the URL in a web browser that has Quotebacks installed.
  4. Select the text you want to quote and use it in Quotebacks.

When somebody selects 'Go to text' in your Quotebacks quote, they'll see the exact spot where you created your Hypothesis annotation.

I dig how copied Markdown code looks:

> Senast jag hörde ett aktstycke av det här slaget var när jag satt och lyssnade på Thomas Quick-utredarna, det är målfoto mellan dem när det kommer till det sakliga innehållet och sättet att förhålla sig till fakta.

Source: [Leif GW Persson: Bättre mylla än så här finns inte för konspirationsteoretiker - DN.SE](https://www.dn.se/nyheter/sverige/leif-gw-persson-battre-mylla-an-sa-har-finns-inte-for-konspirationsteoretiker/) by @dagensnyheter

Here's what that code looks like in my WordPress blog:

Senast jag hörde ett aktstycke av det här slaget var när jag satt och lyssnade på Thomas Quick-utredarna, det är målfoto mellan dem när det kommer till det sakliga innehållet och sättet att förhålla sig till fakta.

Source: Leif GW Persson: Bättre mylla än så här finns inte för konspirationsteoretiker - DN.SE by @dagensnyheter

By selecting 'Copy image', a PNG version of a quote downloads; an example:

I can't wait to see what else the creators come up with. I've a bunch of thoughts about the tool: