Larene Profile picture
πŸ‘©πŸ»β€πŸ’» Engineer @datalust_seq πŸ• Meetup host @WomenWhoCodeBNE & @CTOSchoolBNE πŸ—£ @yow_conf ambassador, '19 πŸ… Microsoft MVP πŸ’– #accessibility #a11y
22 May 20
This final #GAAD post is a bit of a mashup.

I want to debunk things I was confused about when I first started learning about #accessibility, esp. ARIA (Accessible Rich Internet Applications), and give you some tips and everyday references.

Day 5 is #a11y learning πŸ“š -> Larene's 5 days to accessib...
Many years ago, the web started becoming more "dynamic", i.e. we started adding a bunch of JavaScript to do fancy things.

Before HTML5, we only had <div> and <span>, so these fancy things were basically invisible to assistive technology.

ARIA was created created to solve this.
ARIA is a list of HTML tags that add *semantic* meaning to an element.

<h1>, <button>, <a> generally don't need ARIA, but <div> and <span> do, especially if they are interactive.

Always use semantic HTML over using ARIA.
Read 16 tweets
20 May 20
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…
Read 10 tweets
19 May 20
Day 3 of 5! Tomorrow, there will be #GAAD events around the globe.

In Australia, tune-in to @a11ybytes Thu 21 May, 4pm AEST; 12 talks, 10 minutes each, all about #inclusion and #accessibility - this event changed my life.

Today, we're about accessibility checking tools πŸ” -> 5 days to accessibility - d...
So, we've talked about keyboard, and colour and contrast.

Other common #a11y mistakes:
❌ images without alt-text
❌ unlabelled <input>s
❌ icon-only links and buttons, with no labels
❌ and more...

Can all be found in one go with an accessibility analyser
Accessibility checkers are code analysers - they scan a web page's source code, and give back a report of all potential #a11y problems.

This report resembles something like what you would see out of a professional accessibility audit, with one big caveat πŸ‘‰
Read 10 tweets
18 May 20
#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
18 May 20
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 ->
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