OpenDyslexic web site feature?

[Chris Dean]

This topic was imported from the Typophile platform

I was just visiting the OpenDyslexic website and I noticed when I hovered my cursor over the page, a light grey semi-transparent horizontal bar appeared. A feature I have not seen before.

I’m fairly confidant it’s there to assist users with reading differences. Akin to how you used to use a ruler to help you read when you were learning.

It’s still novel to me, but I think I like it. Then again, my vision isn’t that good, and I like big, easy to read type.

Does anyone:
a) know how this feature technically implemented? (css, html 5, Flash &c)
b) have any thoughts or feelings about it?

[Frode Bo Helland]

Probably a div tag that is locked to the cursor position with Javascript. OMG that typeface is ugly!

[Chris Dean]

Sorry, not on the design of the typeface, but on the grey bar feature of the web site. The typeface itself has already been discussed at great length:

https://typography.guru/forums/topic/93691-forwarding
https://typography.guru/forums/topic/106986-forwarding

What are your thoughts on the grey bar?

[Nick Shinn]

Wouldn’t a white bar would have been better, on the principle that contrast improves letter shape recognitition?

[abbiegonzalez]

I posted the source code for it here: http://antijingoist.github.com/web-accessibility/

@Nick: for many people, lower contrast is needed. A higher contrast causes a sort of glare/blindness when trying to read.

[Chris Dean]

“For many people, lower contrast is needed.

Do you have sources to peer reviewed studies which support this, or is this anecdotal and from your own experience (which I am confidant is far more significant than my own). I have yet* to come across anything published.

Diemand-Yauman, C., Oppenheimer, D. M. & Vaughan, E. B. (2010). Fortune favours the bold (and the italicized): Effects of disfluency on educational outcomes. Cognition, 118(1), 111–115.

But this sample population for Diemand-Yauman et al. (1020) were not readers with learning differences. Experiment 2 did have 222 subjects (Ss) however, so it’s possible there were a few Ss in there who did have learning differences but fell within their inclusion criteria of academic performance, or did not report any learning differences.

I look forward to your response!

* Please excuse my crap seizure-medicated memory. I may have in fact read something and don’t recall.
http://readthetype.com/literature/

[Chris Dean]

And it’s now been 24h and I like the “grey bar feature” even more. But I am uncertain as to why it highlights the paragraphs with a grey box as well.

@abbiegonzalez: Is this also done to support your lower contrast theory?

[abbiegonzalez]

I followed the British dyslexia associations recommendations:
http://www.bdadyslexia.org.uk/about-dyslexia/further-information/dyslexi...

Lower contrast also helps people with scoptic sensitivity syndrome. http://en.wikipedia.org/wiki/Scotopic_sensitivity_syndrome#Scotopic_sens...

The idea was to have a happy medium, because with contrast too low, and its obviously useless for everyone, but contrast too high would be difficult to read for some.

The bar and the highlighting paragraphs are there to help keep focus on what you are reading. The highlighted paragraph is the current paragraph you are reading, and you can use the bar for the line. It's a similar concept to using an index card or bookmark for reading line by line.

http://beelinereader.com accomplishes something similar using text gradients, which I also use personally.

Obviously, there is personal experience in the mix too: I experimented quite a bit with colors and reading in college, but never mentioned anything openly about it until I realized others had similar issues and methods for dealing with them.

[Chris Dean]

Have you read any, or can you recommend any noteworthy studies with empirical data, published in peer-reviewed academic journals?

I took a quick look at The British Dyslexia Association’s dyslexia research information page and saw a pretty good list of references. Perhaps you could help us narrow it down?

[phrostbyte64]

I'm dyslexic and I can tell you that the visual distortion of the font and the extraneous sensory input from the grey bar are just about enough to drive me nuts. No thank you.

[quadibloc]

What I would prefer, instead of a moving bar of shading, would simply be to statically alter the background color for alternating lines of text.

Some computer printout paper used to do this. So I could alternate between blue printing on a yellow background (said to be "optimum" for legibility in one ancient study - but this was for highway signage, not reading) and blue printing on a light green background.

Maybe orange instead of yellow to have reduced contrast.

But apparently even JavaScript doesn't let you do that; all the results I found for alternating lines were for tables, not text in paragraphs.

[Chris Dean]

“…said to be "optimum" for legibility in one ancient study - but this was for highway signage, not reading…”

Reference?

[Frode Bo Helland]

Alternating lines: You could definitely do that with Javascript. It’s just a matter of wrapping words in span’s and checking the y position.

Chris: I don’t have any substantial to say about the grey bar, but then the guy who claims this helps is the one with the burden of proof.

[abbiegonzalez]

@Frode: I did it only using CSS: p:nth-child(even){}
Didn't think to wrap words in spans and check Y position to do alternate lines.

Grey bar: It replaces the index card I'd use to keep my place in line. I'm almost done with a .Net version I've been using at work (at least, almost done making it useable outside of my work). I don't know how I'd go about proving a line attached to a mouse is just as good as an index card attached to a book or screen, but it sure as heck helps with table & database work.

@Chris Dean: I can't narrow it down further without taking up time I don't have. You'd wait a while if you waited for me. :-/ But it's a good place to start. Also, many GUI's/OS's have offered a low contrast mode.

[Nick Shinn]

…there is personal experience in the mix too…

Dyslexic readers are a demographic category, and in that respect no different than any other slice of the pie.

Communicators today need to deal with the issues of filter bubbles and the relevance paradox, as they try to fine tune the tools they are using to understand the needs of different groups. But that kind of empirical research can only go so far towards making something that is easy to read and appealing to a particular group. Beyond that, as is always the case, the designer has to design, and you can’t do that without putting something of yourself into the work and taking your audience along for the ride.

[Chris Dean]

What do you mean by “filter bubbles” and “relevance paradox?”

[Nick Shinn]

Filter bubbles are the envelope around a person that search engines create by limiting/prioritizing results according to demographic facts about that person: If you like that then you’ll like this.

The relevance paradox is that one can’t know which of many possible factors will be relevant to an action about to be taken, and in editing out what appears to be irrelevant, one cannot avoid removing some factors that turn out to be important.

To burst the bubble and fill the gap left by the paradox, designers use personal, tacit knowledge to create something new.