COIL 100+20 Option: Read-Thru by Web Creator, with Highlighted Text

Ideas & Collaboration
#1

temp
temp1611×402 95.6 KB

If you’re looking for something as your “+20” for COIL’s “100+20” recommendation for monetization of web page(s), here’s an idea: a read-thru (by you, the web creator) of your page, with the text highlighted as you read. It really personalizes the page when users hear your voice reading your own words. This is what I’m using on my site, for my 400+ math lessons. The linked page (below) gives complete instructions (HTML/CSS/JavaScript), plus an example of how it works.

Complete HTML/CSS/JavaScript: Read-Thru with Text Highlighting

If you want to see it “in action” on my website, here’s a typical lesson:
Expressions versus Sentences

You’ll want to visit the lesson page both as a COILed subscriber, and not, to see the different behavior in these two situations. (Be sure to click the green audio button at the top.)

Feel free to contact me (Carol JVF Burns; email on my homepage) if you’re interested in instructions on how I implement the timed delay and drop-down info box.

1 Like
#3

That’s great @OneMathematicalCat! :slight_smile:

Reminds me of stuff that we’re working on and applying for a grant for – Hyperaudio for Conferences.

We’re currently busy creating a pilot for the Mozilla Festival and have recently created some promotional interviews for the Creative AI space. This one was made with the Hyperaudio Lite JavaScript library, but we also have a Wordpress plugin that does much the same thing – [demoed here]
(How to use the Hyperaudio Wordpress Plugin – Part 1 - YouTube) We can also automatically generate captions, so overall a big win for accessible media.

@nicol has helped test these tools as we work to improve them – making the CiviCRM conference talks more accessible – see this example here.

2 Likes