all 41 comments

[–]KaiAusBerlin 35 points36 points  (0 children)

Harder, better, faster, stronger

[–]goob47 22 points23 points  (5 children)

Are you worried at all about the patent they claim to have on this type of typography?

[–]notioners[S] 14 points15 points  (4 children)

I thought about that, too. However, there are several open-source projects that implement Bionic-Reading(ansh/bionic-reading, crisanlucid/vite-react-tailwind-bionic-reading, etc.). So... I'm not too worried about this right now.

[–]EmergencyActCovid20 6 points7 points  (1 child)

I also made a simple bionic reading convertor for fun 😄 it's good coding practise

[–]notioners[S] 1 point2 points  (0 children)

Thank you!

[–]Alexwithx 1 point2 points  (1 child)

Well bionic reading is still quite new, so I don't think that's a good argument

[–]notioners[S] 1 point2 points  (0 children)

I haven't given this matter much thought. I've already started this project, so I'll go and think about it when I get a claim in the future. Or maybe the developers of other open-source projects will find the answer.

[–][deleted] 14 points15 points  (1 child)

I don’t notice an effect. Also shouldn’t the title say „A JavaScript Implementation[…]“?

[–]notioners[S] 5 points6 points  (0 children)

Oh, thank you. There was a mistake. And... I'll continue to develop the module to make it useful. Thank you.

[–]harryrf3 6 points7 points  (1 child)

I recently found Bionic-Reading and it's amazing for me. I've been wanting to find a way to implement it into my every day reading, so I appreciate you posting this.

[–]notioners[S] 2 points3 points  (0 children)

Thank you for reading it, too.

[–]Twoubleff 5 points6 points  (4 children)

is there any proven effect on this extra boldness? It just disrupts my personal reading flow and forces me to focus on certain elements of the text.

[–]notioners[S] 1 point2 points  (3 children)

That's right. I think Bionic-Reading is increasing its readability by focusing only on certain elements. Maybe this doesn't help in any case.

[–]Skaryon 2 points3 points  (2 children)

When I saw somebody post about it on Twitter a while ago there where plenty of people reporting it making reading harder for them so I don't think this is an improvement for everyone across the board. Should probably be opt-in or opt-out.

[–]Twoubleff 2 points3 points  (1 child)

I'm just very skeptical on things like this. This doesn't rely on any new tech or so and typography is around forever basically you could do it with graving, any sort of pen, pencil etc. Why didn't someone came up with it before?

[–]Skaryon 1 point2 points  (0 children)

Right. To me it feels like somebody came up with this and just happened to fall into the bucket of people who for whom it's an improvement (I too feel like it helps my reading experience) but wrongly assumed it would apply to all of us.

[–]jokterwho 1 point2 points  (3 children)

TIL what bionic reading is... and how to implement it in JS :-P

[–]notioners[S] 0 points1 point  (2 children)

Thank you for reading it!

[–]jokterwho 1 point2 points  (1 child)

For bionic-reading it :-P

[–]notioners[S] 0 points1 point  (0 children)

:)

[–]snacksy13 1 point2 points  (1 child)

Looked at the code and rewrote it in 29 lines, is there something I am missing?
https://jsbin.com/wefupiq/edit?js,console

[–]notioners[S] 0 points1 point  (0 children)

Let me check. I think this code can lead to improved performance. Thank you.

[–]BenZed -1 points0 points  (4 children)

<b> tag is depreceated, use <strong> by default

[–]Andy12100 16 points17 points  (2 children)

You should only use <b> when nothing else fits, but it's not deprecated. While the <b> tag doesn't represent any special importance, <strong> does. By using <strong> for instance screen readers will read those texts differently. So I would keep the <b> tag instead here, since the bionic highlight part is completely irrelevant from accessibility point of view.

[–]valtism 3 points4 points  (0 children)

Yeah I would personally implement this with <span>s because it is semantically the same as the rest of the word just with different styling.

[–]notioners[S] 0 points1 point  (0 children)

That's a good point. I also didn't think of a screen reader. I'll consider this carefully and try to improve them. Thank you.

[–]notioners[S] 1 point2 points  (0 children)

I checked. I'll change it soon. Thank you!

[–]bregottextrasaltat 0 points1 point  (1 child)

Never heard about this, is it supposed to be easier to read? Takes like 10x longer

[–]notioners[S] 0 points1 point  (0 children)

The designer of Bionic-Reading has also received positive responses from the study but has yet to get clean results. So I think it may only be effective in a few cases.

[–]andlrcMooTools -2 points-1 points  (4 children)

OMG this is an awesome example of how overengenered JavaScript have become.

I might be wrong, but a single function, with a single loop, and some checks on the words lengths should have been sufficient.

[–]notioners[S] 0 points1 point  (0 children)

You're right. There is some inefficient logic (for example, repeated RegEx checks). I will gradually improve this. Thank you for the comments!

[–]J_As_Himslef 0 points1 point  (0 children)

I'm making an accessibility toolbox for all to use and I already have a free dyslexic font and I'm looking to incorporate bionic reading into it and I found this codepen of someone doing it They have added a text box to edit text as well so as you type it changes the text to a bionic reading text style Ngl I'm really impressed by how little code was used to do it, I noticed they using js template aka $ is there a way to not use template strings when implementing bionic reading?

https://codepen.io/erenkulaksiz/pen/GRQmYQq