Profile picture
, 10 tweets, 6 min read
My Authors
Read all threads
Happy global accessibility awareness day! #GAAD

I've saved the trump card of all #accessibility testing techniques for today. Did you guess it?

Learning how to use a screen reader! 🗣-> 5 days to accessibility - d...
It's hard to learn something, without seeing someone else do it first. 👀

Marc works at a university and is a Mac user. He uses the built-in screen reader (VoiceOver) to control his computer, including browsing the web.

Watch this to see how he does it 😁youtube.com/watch?v=dEbl5j…
Screen readers are a type of "assistive technology" - products designed to help people with disabilities or the elderly achieve what is otherwise impossible.

There are many screen readers (SR) out there, @webaim does a great annual survey on SR usage 👏

webaim.org/projects/scree…
Here are 3 free screen readers that I use to test on Mac, Windows, iOS and Android.

@NVAccess's NVDA on Windows: nvaccess.org/download/

Apple's VoiceOver on Mac and iOS (comes free with the OS)

And TalkBack on Android devices:
play.google.com/store/apps/det…

Next, how to use them -> Free screen readers I use -...
Now, it's your turn!

Learn to use a screen reader on Mac or Windows, in literally less than 10 minutes with the amazing @rob_dodson 😎

NVDA on Windows:
youtube.com/watch?v=Jao3s_…

VoiceOver on Mac:
youtube.com/watch?v=5R-6Wv… A screenshot of Rob Dodson ...
When you first start using a screen reader, you're gonna feel like you're fumbling around. That's ok!

But, once you start hearing that your alt-tags and form-labels are helpful for a real person, rather than just appeasing an accessibility checking tool; that's the game-changer.
After learning how to use a screen reader, you can now test all visual, keyboard, and non-visual parts of your website or app!

How amazing is that?!

Pictured, is how I build inclusive web components. I've found much of the web only builds the "visual" bit. Let's change that! "How I design inclusiv...
Let's say we're designing a shopping cart "button".

👁 Visual users need hover, focus, and active states.
⌨️ Keyboard-only users need to be able to Tab to it, and press Enter to follow the link.
🗣 And non-visual users need to know it's a hyperlink that takes them to their cart. Designing an inclusive cart...
Hope you enjoyed today's #a11y thread about screen readers!

Please let me know how you went 🙏.

Now, all those "extra HTML tags that don't seem to do anything" will start to make a lot more sense. Especially after my final post, tomorrow. 😉

Happy #GAAD!
Had someone ask me about screen readers on Linux - it seems like Orca is the go-to, but I've no experience with it so can't say if it is anything like VoiceOver or NVDA.

help.ubuntu.com/stable/ubuntu-…
Missing some Tweet in this thread? You can try to force a refresh.

Keep Current with Larene

Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

Twitter may remove this content at anytime, convert it as a PDF, save and print for later use!

Try unrolling a thread yourself!

how to unroll video

1) Follow Thread Reader App on Twitter so you can easily mention us!

2) Go to a Twitter thread (series of Tweets by the same owner) and mention us with a keyword "unroll" @threadreaderapp unroll

You can practice here first or read more on our help page!

Related hashtags

#GAAD #accessibility #a11y

More from @LareneLg see all

Profile picture
Larene
@LareneLg
#GAAD morning, it's Day 2!

How'd everyone go with keyboard #a11y yesterday?

You may have found it slow to browse a site with just the keyboard. Yes, there is a learning curve, also, many users have software that gives them shortcuts!

Today is about colour and contrast 🖍 -> 5 days to #a11y (accessibil...
In Australia, 8% of men, and 0.4% of women have some degree of colourblindness.

We cannot use only colour to provide meaning, or risk excluding nearly 1-2 in every 20 people from the web.
Here is a sign up form, it uses colour to show whether an input is valid or invalid. In this example, the password field is invalid, it has a red border, and the other fields have a green border.

I use colororacle.org to simulate types of colourblindness, just hit f5
Read 8 tweets
Profile picture
Larene
@LareneLg
Did you know that 70% of the web is inaccessible folks with low vision?

This Thursday is #GAAD - Global Accessibility Awareness Day.

I'll be tweeting about 5 #a11y techniques I use everyday to ensure I don't exclude people on the web.

Let's start with unplugging your mouse -> Image
There are many keyboard-only users out there. People who use a screen reader fall in this category. These users generally have low-vision or blindness (but not necessarily).

Also, people with motor disabilities, or injuries, that temporarily or permanently cannot use a mouse.
Keyboard accessibility is *essential* for some people, they can't operate the web without it.

However, keyboard navigation is also *beneficial for all* users - it's much more efficient to use a keyboard to fill in a complex form, than it is to use a mouse. Think, hospital admin.
Read 11 tweets

Embed code for your website

×
Follow Us on Twitter!

Did Thread Reader help you today?

Support us! We are indie developers!

This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3.00/month or $30.00/year) and get exclusive features!

Become Premium

Too expensive? Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal Become our Patreon

Thank you for your support!