25. CHLOE TOPPS
Chloe is 10 years old and currently at
primary school. Likes to play Minecraft and
other online games on her laptop. She has
learning difficulties which can affect her at
school and when using a website.
Problem-solving: Frustration when
problems occur on a website and she
doesn’t know how to resolve them. For
example, form errors which don’t
clearly show where the error is and
how to deal with it.
Reading and understanding:
Struggles to understand some
sarcasm, metaphors and slang
Has a problem completing some
captcha forms
26. LEONARDO MANUEL MADEIRA
PEREIRA
Language - speaks Portuguese, little French,
German, Spanish and English
Address - postcode doesn’t have letters
Name - has two surnames, they are not double-
barreled
36. GET YOUR CLIENTS ON BOARD
13% of the population are immigrants
Only 13% of Europe speaks English as a
first language
18% of Europe speak German natively
Only 8% of Europe speak Spanish as their
first language, and only 7% choose it as a
second language
Over 11 million people with a disability
living in the UK which is around 20% of
people of a working age
Their spending power is in excess of
£100bn
About two million people are dyslexic
83% of disabled people will not return to a
business that does not meet their access
needs
2.2 million people have difficulty with
memory, concentration or learning, of
which about 1 million have a learning
difficulty
38. THANKS FOR LISTENING!
Rebecca Topps
Twitter: @beckytopps
Email: rebecca@toppsusability.co.uk
Elizabeth Chesters
Twitter: @EChesters
Email: elizabeth.chesters@gmail.com
¡Gracias!
Dakujem!
Obrigada! Duo Xie!
Mulțumesc! Shukria!
Dankeschoen!
Dank u!
39. RESOURCES
Car Wash who hires people with autism:
https://www.youtube.com/watch?v=VULKzVZCso0&feature=youtu.be
For a checklist to use when conducting user testing:
http://www.uiaccess.com/accessucd/ut_checklist.html
Colour Contrast Tool:
http://www.paciellogroup.com/resources/contrastanalyser/
Editor's Notes
We should introduce the talk in a different language and then show an example of how we’re excluding people.
I can teach you Spanish and I was thinking of doing sign language.
What do you think?
Pictures of us
What we do
Why we’re here and why we do accessibility
Explain picture
Web accessibility is about making something that can be used by as many people as possible:
Different environments
Different devices
Elderly
Different cultural backgrounds
Non-english speakers
Impaired abilities
Image source: http://webaccessibilitysolutions.com/news
Elizabeth
Impairments - regardless of someone’s personal circumstance and issues. We all have our issues!
Culture - Consistency with what we expect and what those elsewhere expect
Environment - No matter where we are, abroad, in the mountains, on the beach in the sun
Rebecca
I volunteer at a community centre where people with cognitive disabilities can go to (drop in centre). They held an event where the people who go to the centre wrote about how their disabilities makes them feel and how people act towards them.
As you can see they said things such as…
This brings accessibility back to the users, how they feel and their key goals/needs
ThoughtWorks has also done work with TechVision, a school for the blind in Pune
They tested our pages and showed us just how bad they were
I was invited to their school to see their collection of braille books that they had translated
I was shown how they use screen-readers and was introduced to…>>>
to Shivaji Londhe
who was blind and had taught himself German to communicate with even more people online
since online you can’t see who you’re talking to anyway
Rebecca
- How it can affect the people who will be using your website or software
Rebecca
In regards to cognitive impairments there are functional definitions, which everyone can often relate to.
How it affects the person using a website:
Memory: It can be difficult for people to remember what they have already entered in long forms or previously read in articles split into multiple pages.
Understanding: Users may struggle with understanding complicated and misspelt words; sarcasm and metaphors. (Dyslexia, Autism and learning disabilities)
Reading: Some individuals have difficulties understanding text. These difficulties may be mild or severe, ranging from minor challenges to not being able to read any text on screen. It is estimated that 15-20% of the population has some sort of language or text difficulty.
Problem-solving: When it comes to a website, struggles with unfamiliar circumstances, such as links to new places in a website or unclear form input error messages (this could be as a result of intellect, emotional or executive function impairments). – Learning disabilities / Autism
Attention: difficult to focus on tasks, particularly when a web page has moving adverts or multiple pop-up windows. (ADHD, ADD, Aspergers)
Numbers / Math comprehension: it can be difficult for people to estimate the total cost of items when buying online or to solve simple maths-based questions asked on some comment forms (to prove they are not a spambot) ( - this is most likely dyspraxia).
Visuals/ visual comprehension: By visuals this can mean graphics and photographs. Individuals with visual difficulties may not recognize objects for what they are. They may recognize the fact that there are objects on a Web page, but may not be able to identify the objects. For example, they may not realize that a photograph of a person is a representation of a person, though they can plainly see the photograph itself (as an object) on the web page.
Elizabeth
TRADITIONS - how people are accustomed to things and what they expect in things
NAMES -
Indian: long names, South not required to have a surname
China: family names are first, then given names - different order
LANGUAGE - Everyone has this expectation in one language or more.
LOCATION - bandwidth and resources are not the same in every country
Weather: Take a low contrast design out into the sunshine - see how far you get
MEASUREMENTS - NASA’s Mars Climate Mars Orbiter descended further than its original course because two teams were using different measurements. $125 million loss!
DATES - Saudi Arabia officially run by a lunar calendar and their weekends are on our Friday and Saturday because their prayer day is Friday like our Sunday. Changed as business grew between M.East and the West.
ELIZABETH
Speaking to anyone about a bad experience and you’ll notice the emotions attached to those experiences and websites
Amplify that because of something you can’t control like your nationality or impairment and it’s much worse
Rebecca:
There is a certain amount of overlap between web accessibility and web usability
Improving your accessibility will overlap with usability and result in a website which is easier for people to use
This is because guidelines such as BS8878 show how organisations should integrate accessibility with their UX and design
Accessibility requirements such as high colour contrast and semantic structure all help to build a strong website foundation which is easy to use and understand
Stress that we are designing for people and that improving usability usually includes everyone you’re targeting not just the niche that is thought of
Elizabeth
Pause for effect
When you provide the resources or the opportunities - people will take them
Rebecca: Email chris about photo
Empowerment. Enabling people to participate in society through the Web. There are so many people for whom interacting in the physical world is really tough, yet interacting with an accessible Web is easy.
As I said in Just Ask: With accessible websites, people with disabilities can do ordinary things: children can learn, teenagers can flirt, adults can make a living, seniors can manage their stock portfolios, and so on. With the Web, people with disabilities can do more things themselves, without having to rely on others. People who are blind can read the newspaper (through screen readers that read aloud text from the computer), and so can people with cognitive disabilities who have trouble processing written information. People who are deaf can get up-to-the-minute news that was previously available only to those who could hear radio or TV, and so can people who are blind and deaf (through dynamic Braille displays). People with quadriplegia who cannot move their arms or legs can shop online to get groceries, gadgets, and gifts delivered. People who cannot speak can participate in online discussions, such as through blog comments.
Rebecca
- Examples of how inaccessible websites or design/content can potentially prevent people from achieving their goals
Rebecca
Distracting adverts can have a negative effect for people with ADHD or Autism or in this case anyone who wants to procrastinate from looking a for job. The adverts are prominent and stand out from the rest of the website and they are also animated.
Clutter - audio and visual
Moving banners/adverts
Automatic audio
Pop-ups
Elizabeth
Research target audience
Here we think it’s cluttered because their characters don’t have letter spacing, or capital letters or punctuation
This works for some cultures.
Rebecca
Example of Low colour contrast and small text from a footer website [much smaller on the website]
Grey on dark grey is difficult to read
Affects those with colour blindness or low vision and dyslexia
Elizabeth
Flat UI - popular design choices are even inaccessible with a lot of websites not work with colour contrast
Certain colours don’t work and even more components disappear when grayscale is turned on
Rebecca
Long pages of text is a lot for the user to process quickly
An article about blindness which is just loads and loads of [small] text with 2 headings…
Struggle to find the information they need
A better way is to include headings, images and bullet points to break up the content
Elizabeth
Wikipedia is a good example of what to do, but to encourage headings and skip links.
Also a bad example for translation…… >>>
http://uxpajournal.org/text-advertising-blindness-the-new-banner-blindness/
Elizabeth
Translating via a browser - is not all that convenient. Images have been used with text which can’t translate.
Loss of context - No idea why pumps or “your name seal” are search suggestions
Wikipedia has a lot of content and a lot of jargon on pages because of the terminology that’s unavoidable
So it offers multiple languages!
Elizabeth
Focus in:
User Research
Personas
Rebecca
Designs
Media
Development
Rebecca:
Ensure you recruit a diversity of people for your research - including variety of cultures and abilities
Contact local organisations; housing trust; council; universities; schools; community centres; people you know
At Sigma we have a good relationship with Peaks and Plains and they help us to find elderly people and people of a range of abilities to be involved in our user research.
In this photo we had just helped people to ‘get online’ and learn basic computer skills.
Elizabeth:
At TW we’re in over 13 countries, allowing us to have diverse teams.
Diverse teams = diverse conversations which translates through our software
In my team during training we had about 7 nationalities in a team of 6
Rebecca
Recruit Participants
Choose an accessible location & provide an option to travel to their location
Assistive technology
Schedule the right amount of time
Consent forms
Allow the participants to become familiar with the set up
Also check out: Rocket surgery made easy by Steve Krug
Me and Elizabeth have both created very short examples of personas to show how you can include culture and cognitive impairments into your personas and user research.
Example (short, low fidelity) persona for a childrens website - the children bit might be really good since there’s another talk about children UX
Persona - Portuguese
Doesn’t have Western customs
Names don’t work in the same way of “Joe Bloggs”
Doesn’t speak English that well
Most people expect long names from certain cultures - latin backgrounds
“Special” colleague whose full name is: Adam Joshua Charles Newell Fahie
Rebecca:
2.7 million people in the UK are colour blind
People who use the accessibility forum ‘Accessify’ have mentioned that John Lewis is easy to use - example of high colour contrast
Pac-ell-o group ;)
Colour contrast analyser can be downloaded to your Mac or Windows computer. It allows designers to quickly use the colour drop to test the accessibility of their colours on their designs.
Elizabeth:
Development
Code maintainability
Can override CSS and it’s flexible to change design
Culture
Less overwhelming for someone who doesn’t speak language natively
Better structure to work with for browsers to translate
Blind
Screen-readers can understand hierarchy
Skip links
Cognitive issue
Shows breakdown hierarchy and process
Understand key content
Rebecca
Immediate error [and positive] feedback whilst the user is completing the form instead of at the end
Descriptive and information error messages - help users to successfully complete the form
When the user does click on ‘submit’ for the form and there is still errors - link to errors at the top of the form, also benefits screen readers
Elizabeth
Captions are known for helping those with audio impairments but they offer so much more.
Translations are a cheap way to use the same video and still get your point across - although please test automatic captions if that’s what you’re using
For those with cognitive impairments who can get overwhelmed by noise they can turn off the audio and read your content instead
As a consultant I travel and I might not always have headphones. I might need to do quick client research from our videos and need captions
Rebecca
People with learning difficulties may have difficulty understanding text which is written with a high grade level and websites that use jargon or sarcasm.
This can differ depending on your key target audience
You can use tools such as Read-able and Hemingway to test your web page content and look at the grade level using read-able. Hemingway gives you ways in which you can improve your writing to make it easier to understand.
Culture - Jargon gets lost in translation
Elizabeth - Accessible Rich Internet Applications
We can use things like ARIA roles and labels for to describe what components do on a page
Added structure adds sensical value
ARIA != magical accessible fairy dust
Rebecca?
Looking at how we will be driving accessibility forward and how your business can drive accessibility moving forward
Rebecca - Meetups and book
Elizabeth - Book, blog and HCI masters
cards - http://www.digitalpulse.pwc.com.au/wp-content/uploads/2014/08/Attitude-Adjusters.compressed.pdf
Rebecca
These are cards which have been created by ‘digital pulse’ and they can be printed off and used as ideas for how to become ‘champions’ of accessibility in an organisation (just something fun) - happy to move these to a different slide and list how to get teams on board here
Bribes - good HTML = higher SEO rankings and better web crawlability
Elizabeth
These are huge portions of their clientele that you are cutting out or disregarding.
This is money that they’re losing.
German is highest natively spoken language
Source: http://www.lukehay.co.uk/2014/12/accessible-personas/ (he works with Ability Net)
Elizabeth
Accessibility along with security would not and should not be dumped in at the beginning and forgotten about or stuck on at the end
Pa11y is a free open source tool which can be left to monitor the pages you want to focus on.
It doesn’t spider through all of your pages from one URL
Graphs to show progress and provides a starting point of colour contrast and alt tags
Elizabeth: END WITH THANK YOU IN SIGN LANGUAGE - I will forget