Thursday, January 27, 2011

6 Surprising Bad Practices That Hurt Dyslexic Users

Web acces­si­bil­ity doesn’t only extend to colour blind users, but also dyslexic users.

Dyslexia is a perception or learn­ing dis­abil­ity that impairs a person’s flu­ency or accu­racy in reading, writing, and spelling. Web page design­ers can help dyslexic users read text more flu­ently and accu­rately by under­stand­ing and avoid­ing the bad design prac­tices that hurt dyslexic users. See­ing things from their eyes can give them a bet­ter per­spec­tive on why acces­si­ble design is so important.

When dyslexic users read text, some­times they can expe­ri­ence visual dis­tor­tion effects. These effects vary in degree from per­son to per­son, but they can make read­ing text that much harder.

Below are six bad prac­tices that are likely to cause these visual dis­tor­tion effects for dyslexic users. Although these bad prac­tices can also make read­ing dif­fi­cult for non-dyslexic users, the effect they have on dyslexic users is much worse.

River effect

Dyslexic users may some­times see the river effect in the text they’re read­ing. This is when large gaps occur within con­sec­u­tive lines of text. It can often look like a river of white­space flow­ing down the page, which can make read­ing flu­ently and accu­rately dif­fi­cult. There are a cou­ple bad prac­tices that make the river effect happen.

1. Jus­ti­fied text

When you use jus­ti­fied text, you’re not only mak­ing text dif­fi­cult to read for non-dyslexic users, but even more so for dyslexic users. Jus­ti­fied text cre­ates large uneven spaces between let­ters and words. When these spaces line up above one another, a dis­tract­ing river of white­space promi­nently appears [4]. This can cause dyslexic read­ers to lose their place repeat­edly. You can avoid cre­at­ing the river effect by using left aligned text, instead of jus­ti­fied text for your para­graphs.

2. Dou­ble spac­ing after periods

Most of us were taught to dou­ble space after peri­ods at the end of a sen­tence. This prac­tice orig­i­nates from the type­writ­ing days of the past. Because type­writ­ers used mono­spaced fonts, peo­ple thought that dou­ble spac­ing after peri­ods would make the end of sen­tences more dis­tinct. How­ever, on the web, sin­gle spac­ing after peri­ods are enough because most web­sites use pro­por­tion­ally spaced fonts. Dou­ble spac­ing after a period can cre­ate “rivers” within text that make it dif­fi­cult for users to find the end of sen­tences. On the web, sin­gle spac­ing wins.

Blur effect

Another kind of visual dis­tor­tion effect that can occur among dyslexic users is the blur effect. This is when dyslexic read­ers experience their text blur­ring or swirling or both together. This can sig­nif­i­cantly affect a dyslexic user’s read­ing abil­ity, and make read­ing very tir­ing for them. You can lessen this effect by avoid­ing a cou­ple of bad practices.

3. Pure black text on a pure white background

There’s a rea­son the text you’re read­ing now is not pure black (#000000), and the back­ground that it’s on is not pure white (#FFFFFF). It’s because many dyslexic users are sen­si­tive to the bright­ness of pure black text on a pure white back­ground due to its high con­trast. This can cause the words to swirl or blur together. To avoid this, use a slightly off-white color for your back­ground, like a light gray. You can also use a dark gray for your text instead of a pure black to cut the glare even more.

4. Long blocks of unbro­ken paragraphs

Long blocks of unbro­ken para­graphs are hard for non-dyslexic users to read, but even harder for dyslexic read­ers. It’s easy for dyslexic read­ers to lose their place with long para­graphs. That’s why it’s bet­ter to use short para­graphs that express one idea. This is because dyslexic users need more breaks between ideas than non-dyslexic users. Break­ing up your text to one idea per para­graph makes read­ing a lot eas­ier for both dyslexic and non-dyslexic users.

Washout effect

Some­times dyslexic users can expe­ri­ence the washout effect. When this hap­pens, the text looks faint and indis­tinct. This can make read­ing slower and cause dyslexic users to guess what a word is because of the dif­fi­culty see­ing it. To lessen this effect, there are two bad prac­tices you should avoid with your text.

5. Serif fonts

Serif fonts have hooks at the ends of the let­ter strokes. They may look dec­o­ra­tive, but they can cause read­ing prob­lems for dyslexic users. Ser­ifs tend to obscure the shapes of let­ters, mak­ing the let­ters run together. A sans-serif font would allow dyslexic users to see the shapes of let­ters more clearly because they don’t have hooks at the ends of the let­ter strokes. This also increases the spac­ing between let­ters, mak­ing words more dis­tin­guish­able. If you want your users to read your text eas­ily, go with a san-serif font.

6. Ital­i­cised text

Ital­ics are some­times used to high­light text. How­ever, the rea­son you shouldn’t use ital­i­cized text is because they are hard to read. The let­ters have a slightly jagged line com­pared to non-italic fonts. The let­ters also lean over slightly mak­ing it hard for dyslexic users to read words accu­rately. When the text size is small, the text is prac­ti­cally illeg­i­ble. A bet­ter way to high­light is to use bold text because the let­ters are clearer and give bet­ter contrast.

There are many dyslexic users that suf­fer from badly designed web­sites. All of these bad prac­tices are quick and easy to fix. It’s a mat­ter of knowl­edge and under­stand­ing that will get peo­ple to change. Hope­fully, this arti­cle has shed some light on how dyslexic users expe­ri­ence the web, and what design­ers can do to make their read­ing expe­ri­ence better.

[Reference Sources]

1. http://www.angelfire.com/tn3/writing/DesignUsersReadDis.pdf

2. http://clearhelper.wordpress.com/2009/12/14/web-site-design-suggestions-for-people-with-dyslexsia

3. http://www.dyslexia-parent.com/mag35.html

4. http://www.pws-ltd.com/sections/articles/2009/justified_text.html

5. http://irlen.com.sg/irlen.html

6. http://accessites.org/site/2006/11/designing-for-dyslexics-part-3-of-3

7. http://www.bdadyslexia.org.uk/about-dyslexia/further-information/eyes-and-dyslexia.html

8. http://en.wikipedia.org/wiki/Justification_(typesetting)

9. http://en.wikipedia.org/wiki/Double_spacing_at_the_end_of_sentences

10. http://en.wikipedia.org/wiki/Dyslexia]

No comments:

Post a Comment