Re: Floating Action Buttons

 Hi Jonathan--
I like the idea of using JavaScript to provide a mechanism for invoking a Floating Action Button, in addition to ensuring it's available through fixed navigation.
My knowledge of JS is limited, but I assume it would listen for a particular keystroke combination and then trigger an action. 
Is there a keystroke combination you recommend?
And is there a JS implementation that someone on the list could point me to?
Thanks for all your help, Jonathan.  It's great to have the experts on the list as a resource!
Mike


    On Monday, July 6, 2020, 09:53:52 AM EDT, Jonathan Avila <jon.avila@levelaccess.com> wrote:  
 
 #yiv5266633092 #yiv5266633092 -- _filtered {} _filtered {} _filtered {}#yiv5266633092 #yiv5266633092 p.yiv5266633092MsoNormal, #yiv5266633092 li.yiv5266633092MsoNormal, #yiv5266633092 div.yiv5266633092MsoNormal {margin:0in;margin-bottom:.0001pt;font-size:11.0pt;font-family:sans-serif;}#yiv5266633092 a:link, #yiv5266633092 span.yiv5266633092MsoHyperlink {color:blue;text-decoration:underline;}#yiv5266633092 span.yiv5266633092EmailStyle19 {font-family:sans-serif;color:windowtext;}#yiv5266633092 .yiv5266633092MsoChpDefault {font-size:10.0pt;} _filtered {}#yiv5266633092 div.yiv5266633092WordSection1 {}#yiv5266633092 _filtered {} _filtered {} _filtered {} _filtered {} _filtered {} _filtered {} _filtered {} _filtered {} _filtered {} _filtered {}#yiv5266633092 ol {margin-bottom:0in;}#yiv5266633092 ul {margin-bottom:0in;}#yiv5266633092 
Hi Mike, I know others have said to ignore my advice – but I’ll explain what I was thinking.  I’ve seen tools like AppCues, WalkMe, and chat features that provide widgets on desktop sites but where you can’t control the order of the control because it’s added via a script.   This is where a skip navigation link type of approach could be useful for keyboard only users.  If you could control the order I agree changing the reading order to the top would be helpful – although having quick access from anywhere could be useful.   When I was thinking about keystrokes I was thinking about these desktop situations or situations and I was considering perhaps a non-access key solution perhaps a JavaScript based keystroke that could be changed by the user for flexibility.
 
  
 
In terms of desktop – I would also say keep in mind that when low vision users zoom in they tend to get the responsive mobile view of a site and thus it’s important to consider that responsive views could be accessed in any context – such as with a keyboard on a desktop when browser zoom is used.
 
  
 
Jonathan
 
  
 
From: Mike Elledge <melledge@yahoo.com> 
Sent: Thursday, July 2, 2020 11:57 AM

To: Sukriti Chadha <sukriti1408@gmail.com>; Jonathan Avila <jon.avila@levelaccess.com>
Cc: WCAG <w3c-wai-gl@w3.org>
Subject: Re: Floating Action Buttons
  
 
CAUTION: This email originated from outside of the organization. Do not click links or open attachments unless you recognize the sender and know the content is safe.
 
  
 
Thanks, Jonathan and Sukriti!
 
  
 
Jonathan, when you suggested using a keystroke did you mean assigning an access key or something else? If it is a dedicated key, which would be best?
 
  
 
Thanks again,
 
  
 
Mike
 



 

On Jul 1, 2020, at 9:50 PM, Sukriti Chadha <sukriti1408@gmail.com> wrote:
 


 
 
Hi all, 
 
  
 
I am a new member and excited to be part of this group. I designed and launched audio charts on Yahoo finance mobile apps and was a mobile developer before focusing on a11y and product management. Thank you!  
 
  
 
Looking forward to getting to know everyone in the next meeting!
 
  
 
Some thoughts and possible solution for FAB accessibility :
 
  
 
The intent as I understand from material guidelines for a FAB is the primary action a user would take on a given page. One example of this on the gmail app on Android is that the FAB (compose) is only accessible in thecontrols setting on TalkBack if accessed from it's original position. That one is a pretty limited, and IMO unpleasant experience since it doesn't allow navigation backwards or forwards unless the setting is changed from controls to headings or something else.  
 
  
 
The part that works reasonably well is when screenreader (TalkBack) is on, the compose button appears on the search bar on top - it is not there when TalkBack is off. 
 
  
 
To generalize the recommendation, if we think this is a reasonable approach we could say -
 
  
 
The primary action should be available with other site navigation such as search bar or navigation drawers on the page for screenreader users
 
  
 
Screenshots of Gmail app with and without TalkBack attached
 
  
 
Best,
 
Sukriti
 
  
 
On Wed, Jul 1, 2020, 9:08 PM Jonathan Avila <jon.avila@levelaccess.com> wrote:
 

My recommendation is to have multiple ways to reach:
    
   - Keystroke
   - Semantic role such as region where screen reader users could navigate to and also understand bounds
   - Skip to link on page such as at the top so the user can quickly jump to it and also make it’s presence known
 
 
 
Jonathan
 
 
 
From: Mike Elledge <melledge@yahoo.com>
Sent: Wednesday, July 1, 2020 5:55 PM
To: w3c-wai-gl@w3.org
Subject: Floating Action Buttons
 
 
 
CAUTION: This email originated from outside of the organization. Do not click links or open attachments unless you recognize the sender and know the content is safe.
 
 
 
Hi Everyone--
 
 
 
I've been asked if there is a way to implement accessible floating action buttons (FAB) as in Google Material Design.  
 
 
 
An example would be a floating map button that provides directions. Another would be a floating link that takes the user to the top of a page (leaving aside the potential confusion if it is styled like a button).  
 
 
 
There are pros and cons to using them, but it would seem to be a problem wrt accessibility.  In particular, how would a keyboard or screen reader user navigate to an object without a fixed location?  I thought of accesskeys, but their use is frowned on because of potential conflicts with shortcut keys.  Having an FAB appear after a number of keystrokes, time, or sentences sounds intrusive and arbitrary.  Putting them in a fixed position on a page seems to defeat their purpose.  I also thought of claiming equivalence if there is an existing keystroke that accomplishes the same thing, but that doesn't feel right.
 
 
 
Am I missing something?
 
 
 
Any help would be greatly appreciated.  Thanks!
 
 
 
Mike Elledge
 

<Screenshot_20200701-214617.png>
 
<Screenshot_20200701-214554.png>