Hacker News Reader

Comment by stavros | Hacker News Reader

Have you considered using something like Expounder (https://skorokithakis.github.io/expounder/) in your posts? (Disclosure, I made it but it's a small open source lib).

I don't see why we can have full-blown web apps but our text needs to be very specifically just text these days.

View on HN

This is super cool!

I've only recently discovered that Markdown has footnotes, and I've gone to down adding footnotes everywhere.

I use Jekyll + markdown on my website, and I now have lots of fun adding footnotes to my writing.

I added a "footnote tutorial" for readers on https://josh.works/turing-backend-prep-01-intro#why-this-rub..., to help them learn how to navigate the footnotes.

I _love_ your library, and I love the problem that you're solving with it.

Along the way, I've looked at Gwern's sidenotes[0] and Nate Berkapec's "footnotes"/sidenotes [1].

I eventually want to do something more "in-line", like what you've down with Expounder, but I've been satiated with markdown footnotes for now.

[0]: https://www.gwern.net/Sidenotes# [1]: https://www.nateberkopec.com/blog/2017/03/10/how-i-made-self...

Thank you! I used to use footnotes too, but I didn't like how they took you out of the flow of the text. Expounder aims to specifically let users stay in the flow of reading, which is why one of the core instructions is that the text should work in context, as if it were never hidden.

It's good to see experiments along these lines. I really like Wikipedia's recent-ish rich tooltips on link mouseover, and the HTML <summary>/<details> elements deserve to be more widely known.

From the demo it look as if Expounder is one-way - once you've expanded something, you can't collapse it again. Is that correct?

Yes and no, see this comment:

https://news.ycombinator.com/item?id=26238717

I miss footnotes on the printed page because, in addition to references (where they're probably better as endnotes to be honest) I find they're great to use for parentheticals that bulletproof a point, add some background that's not essential to a point being made, etc. But these latter uses work significantly less well in a blog post or ebook.

Oh, wow. The Sidenotes discussion from Gwern that you linked is _phenomenal_. Thank you for sharing these.

What I dislike about footnotes like that is that they pollute the browser history. If you want to leave the page but clicked on a few footnotes and their backlinks, you have to go “back” through all of them.

Thank you so much for posting gwern’s sidenote article! I want to use sidenotes on my site and this was a very valuable resource!

Back button usually come with an unfoldable list of jump points.

I am more ennoyed by how the jump points are turned into a useless feature by so many javascript out there which load new content without impacting the browsing history.

I love this, but I'm a bit surprised that you do not include the ability to "unexpound" an "expounded" term. Is that intentional?

If I were reading a technical text, I would definitely end up reading most paragraphs at least twice. It would make no sense to keep the expounded terms in the second time; I'd be tempted to hide them back as soon as I was finished with them the first time.

Yes, it is intentional. The functionality actually exists, it's just not mentioned:

https://github.com/skorokithakis/expounder/blob/master/examp...

It's because, once clicked, the new text should become part of the old, and that's it. Presumably you've already read it, and I don't want to make the viewer have to re-collapse the links every time.

Your use case makes sense, though, which is why the feature was included. Maybe I should mention it in the README.

I think collapsing would also be useful when all you need is a quick reminder, not a full explanation. Like "What's that again? [click to expand] Oh that's right [click to collapse]". That's easier than finding the place to skip to.

Hmm, true, I've added it to the README!

Hi, can you consider adding some accessibility to the library? Currently, I don't have a way to know that a term could be expanded, because the signal seems to be visual only and not detectable via a screen reader. Adding aria-pressed might be the solution, but I'm not an expert, just an user.

Oh, that's a good point! I didn't realize it wouldn't be discoverable, you're right.

Thanks!

I feel like the inserted text should be highlighted with a light yellow background or some indicator. Just appearing like that inline seems a bit funky or unexpected.

But I see there is a css class which is nice.

Just a simple rgba(x,x,x,0.5) where the x’s are the usual yellow height.

I prefer to leave the styling to the user, the library is intentionally minimally invasive there...

I agree with this. It would be helpful.

I wonder what this does to SEO, does the hidden text get indexed, and is it not picked up as a dark pattern by crawlers?

Why use this instead of footnotes? For example in these Feynman lectures below the footnotes and references to formulas and images activate then you hover over it. These footnote can even include graphics and formulas.

https://www.feynmanlectures.caltech.edu/III_21.html

To me, footnotes serve a different purpose, e.g. linking to papers, like the Feynman lectures site does. Expounder is more about indicating that you don't know something, so the text itself can change to accommodate you.

I like how it unfold the text, but it doesn't give visual hint on what was unfolded, and doesn't provide a way to fold it again, it seems.

Be it topographic emphasize or coloring, there should be an hint. And clicking the text thus emphasized should collapse it.

That's my opinion, otherwise, nice done.

It should animate the text while unfolding, but, other than that, there's no need to know what was unfolded. You just click what you don't know and eventually read the relevant info!

Hasn't HTML the summary and details elements for this specifically, or am I overlooking something?

<abbr>/<defn> are also quite relevant, and would fit a number of the example uses better (like the definition of 'atoms').

Not the author, but presumably you're overlooking the fact that the expounded term doesn't necessarily have to be "inside" or even "neighbouring" to the details element.

The author's intent here is to have terms explained in the text explicitly in such a way that it would 'augment' the text with an explanation somewhere further down the line, but not necessarily "in-place".

It is also intended for text specifically, rather than replacing one element with another.

I agree that display/summary are similar in spirit though, I had not come across those before.

As far as I know, those work quite differently.

Yes, this! Your lib looks awesome. Thanks for publishing it and sharing here!

Thank you!

This looks amazing. Would you mind if I packaged this in a WordPress plugin?

Not at all, go for it!

Awesome. Just a heads up, I've already finished it and just submitted it. HOWEVER, the plugin has to be licensed as GPLv2, but it shouldn't affect your license (since it's just using your code as a library). I'd feel better about it (and it will probably be smoother sailing during the review process) if I could submit your names as authors on the plugin.

If you want to be listed as an author, just drop over to https://github.com/withinboredom/expounder-wordpress/tree/ma... and let me know your wordpress.org user names in an issue.

Thanks! I don't think either of us have a Wordpress username, but it'd be great if you could include a link to the repo in the description.

Thanks again for your help!

Will do!

I would like this as well, please share once you do.

I've submitted it to the WordPress.org plugins directory, but you can download it right now from the repo in the sibling comment.

Is there support for an expound-all button on a page? I definitely have days where I just want to also read the details and don’t want to click a dozen times while I’m reading.

Not currently, but it shouldn't be hard to add a button with one line of JS to add the required CSS class to all the elements. This might defeat the purpose, though, as it's kind of intended to save you from reading things you already know.

Cool! I've been thinking of a similar solution to add to my (planned ;) ) longer blog posts. I'm guilty of going into the details too much sometimes.

Same here, and I didn't like the tradeoff, so I figured I'd solve it with the power of T E C H N O L O G Y.

That is FN DOPE. Wikipedia should adopt it in full.

I know that you didn’t mean to completely throw the conversation from Firefox to Expounder, but you succeeded.

Mozilla who? That’s where we are now.

Reply on news.ycombinator.com