Recommended Agency

text controls: text only | A A A

Sorry, our twitter status is currently unavailable, posted 8 minutes ago

RSS feed icon What is RSS?

blog.

articles tagged with: screenreader


Displaying all 2 articles

Dyslexia friendly websites, are you thinking of the 10%?

Dyslexia friendly websites, are you thinking of the 10%?

Lately I have been thinking, if 10% (6.68 million) of the UK population are dyslexic why is making a website dyslexia friendly not as important as providing a site in different languages?

Dyslexia awareness has come a long way since I was a child, I remember being told “you’re just a bit stupid” when I struggled in school, as society’s awareness increases,  I can see that those days are far behind us. Dyslexia affects a persons ability to learn, read, and spell, but it’s not related to intelligence, and charities such as http://madebydyslexia.org/, backed by Richard Branson, have done a great job at promoting and changing public perception.

What’s the problem?
One of the most common traits of people with dyslexia is difficulty reading. Dyslexics read at an average of 50 - 150 words per a minute, the average reading speed of a non-dyslexic is 250 words per minute. There are interactive examples, such as Dan Britton’s typeface that let you experience what reading is like for someone with dyslexia. 

Whether you have an Ecommerce site or a wiki, you want everybody to find it easy to read the content you provide.

What can be done? A few simple steps:
 
Fonts
Research from Dyslexia Help has found that there are certain font types that have an impact on reading speeds for people with dyslexia. A font has been specially developed called ‘OpenDyslexic’ to give optimum reading speed. Although this is down to the preference of the user, some of the best fonts for an increase in reading speed are Helvetica, Courier, Arial, Verdana, CMU, Sans Serif, Monospaced, and Roman Font.

Colours
When it comes to colour, contrast is an important factor for a dyslexic. Generally, people with dyslexia find it difficult to read with high contrast levels and read faster when contrast levels are lower. The standard black text on a white background is not beneficial to people with dyslexia as it can appear too dazzling. Off-whites and pastel colours are generally a good alternative to white and offer a lower contrast.

Icons / Pictures
The phrase; ”a picture paints a thousand words” can most definitely be applied to a dyslexia friendly website. Pictures and icons are a dyslexic's best friend, if you can you use an icon in place of text then this can drastically reduce the time that a dyslexic user spends trying to work out what it is on the page.

Time
In school exams dyslexics are given 25% extra time. Therefore it’s good practice to apply the same rule to moving elements on your site, such as carousels, so that they have time to read and process the content.

These are just some small, simple changes - but there is far more that can be done, just check out the British Dyslexia Association for a full style guide.

Resources:
https://cdn.bdadyslexia.org.uk/documents/Advice/style-guide/Dyslexia_Style_Guide_2018-final-1.pdf?mtime=20190409173949

Dan Stephenson
Dan

Created on Thursday July 04 2019 12:05 PM


Tags: website accessibility disability content contentstrategy screenreader webdesign


Comments [0]








Screenreader Compatibility Tips

Screenreader Compatibility Tips

I watch as person after person pulls furiously on a door handle before giving it a shove, flying through the doorway much to their surprise and quickly patting down their disheveled attire.
(I'm allowed to laugh as it makes me feel better about doing it myself shortly before, only much less gracefully).
The problem here? The door handle was giving the wrong message. What looked like a handle was indeed a hinge.
My point is, the need for accessibility is everywhere and it is as important in web design as it is in architecture.

When designing for web we must consider various factors such as colour contrast and text size but many forget to consider screenreader users (Screen readers are audio interfaces that convert text into synthesised speech so that users can listen to the content). Luckily there are a few simple things that can be done in order to improve usability for screenreader users, and ultimately all web users...

Logical linearization
Unlike sighted web users who can scan a web page and pull out at random what they consider to be the important information. Screen reader users tend to listen to a page from start to finish, top to bottom, left to right. So it is best to have the important parts towards the top of the page.

Descriptive page title
The first thing a screen reader user hears is the page title. It is imperative that this gives users a clear idea of what to expect from that page. Obviously this benefits everyone as anyone can use the page title to orientate themselves and confirm they are where they want to be on the website.

Descriptive headings
One of the most important usability features for screen reader users is on-page headings. The page structure can then be more easily understood. Although text on the page may appear to be a heading for sighted users, screen readers read through the HTML code so it must be labelled as a heading within that. The screen reader will then announce it as such.

Descriptive link text
Screen reader users can call up a list of on-page links and browse a web page that way. They simply activate links of interest to them. Therefore non-descriptive link text like ‘click here’ is meaningless out of context so avoid it like the plague!

Lists
Using lists within the HTML code is super useful as screen readers announce the number of items in each list before reading them out. This way screenreader users have a better idea of what to expect when hearing a list of items, for example site navigation.
A bit like the way an answer machine tells you how many messages you have received rather than just reeling them off one after the other. You feel more prepared for what you're about to listen to. The use of lists (using the <li> tag) is a behind-the-scenes change to the code that shouldn't really affect what the website looks like.


The great thing about these screenreader friendly tips is that each and every one of them will improve overall user experience.
We as humans like to know what to expect and are comfortable with what feels familiar. It's always good to bear this in mind when designing for web and there is no reason this should jeopardise your creativity. Maybe give the web equivalent of dodgy door handles a miss though, just a thought!

Jordana Jeffrey
Jordana

Created on Wednesday August 26 2015 03:06 PM


Tags: website technology web-development accessibility communication usability screenreader


Comments [0]