E-mail List Archives

You are here: Home > Community > E-mail List Archives > View Thread

Thread: How to convey password requirements on registration pages

Number of posts in this thread: 6 (In chronological order)

From: Fix, Lawrence
Date: Mon, Apr 22 2019 11:41AM
Subject: How to convey password requirements on registration pages
No previous message | Next message →

We're working on a registration page where the users need to create an ID and PW. There are several requirements for the password e.g. length, numbers, capitals, etc. Does anyone have thoughts on how to provide the requirements to the screen reader user. I've seen examples where the requirements are displayed as a list that appears either below the password field or to the right of the entire form. For the visual user I think that is OK (not great), but for the screen reader - I feel like it has to be read when the user gets to the PW input field. The concern is that the design may look funny with the list of requirements displayed between the ID and PW fields. Any ideas are much appreciated!

Thank you,

Larry

Larry Fix
AIG
Web Site Accessibility
L&R Experience Design
80 Pine St, New York, NY 10005
Tel +1 917 703 3916
= EMAIL ADDRESS REMOVED = | www.aig.com

From: Swift, Daniel P.
Date: Mon, Apr 22 2019 11:47AM
Subject: Re: How to convey password requirements on registration pages
← Previous message | Next message →

Larry:

Could you place the requirements after the textbox and within the label include extra text for the screen reader only indicating that there is a list of password requirements listed just after the textbox.

<label>PasswordPlease note that requirements are listed just after the password textbox</label>

Thoughts?

Dan Swift
Senior Web Specialist
Enterprise Services
West Chester University
610.738.0589

From: Mallory
Date: Mon, Apr 22 2019 11:58AM
Subject: Re: How to convey password requirements on registration pages
← Previous message | Next message →

As a "slow person" I benefit from (and I don't care how ugly) a list of how I have to do it being visible to me at all times (I mean, not only when I have focus on the pw field).

Just try not to put the requirements in an aria-describedby setup, or if it is, it can also be normally navigated to and read in any way needed (like by character). I've focussed on pw fields in the past and got a book blasted at me. It still meant I had to try to hold all the rules in my head.

Dan: don't forget a space, but yeah that does look like it could be reasonable:
(to avoid PasswordPlease, tho it depends on SR and setting whether you'd get that as one or two words)

cheers,
_mallory

On Mon, Apr 22, 2019, at 7:47 PM, Swift, Daniel P. wrote:
> Larry:
>
> Could you place the requirements after the textbox and within the label
> include extra text for the screen reader only indicating that there is
> a list of password requirements listed just after the textbox.
>
> <label>PasswordPlease note that requirements are
> listed just after the password textbox</label>
>
> Thoughts?
>
> Dan Swift
> Senior Web Specialist
> Enterprise Services
> West Chester University
> 610.738.0589
>
>

From: Isabel Holdsworth
Date: Tue, Apr 23 2019 6:20AM
Subject: Re: How to convey password requirements on registration pages
← Previous message | Next message →

Larry:

If the list of requirements is long, no matter how or where they
appear on the screen, it's likely that some users, especially those
with learning difficulties (and me), will struggle to follow the
instructions.

But for the benefit of screenreader users, the requirements need to be
in very close proximity to the field they refer to, and as has been
said by others, if the instructions come after the field then
screenreader users need to be informed of their presence.

I personally think that aria-describedby would work quite well here,
but not relied upon. So if the instructions were placed just after the
password field in the DOM, and associated with it using
aria-describedby, this could offer quite a good solution.

Cheers, Isabel

On 22/04/2019, Mallory < = EMAIL ADDRESS REMOVED = > wrote:
> As a "slow person" I benefit from (and I don't care how ugly) a list of how
> I have to do it being visible to me at all times (I mean, not only when I
> have focus on the pw field).
>
> Just try not to put the requirements in an aria-describedby setup, or if it
> is, it can also be normally navigated to and read in any way needed (like by
> character). I've focussed on pw fields in the past and got a book blasted at
> me. It still meant I had to try to hold all the rules in my head.
>
> Dan: don't forget a space, but yeah that does look like it could be
> reasonable:
> (to avoid PasswordPlease, tho it depends on SR and setting whether you'd get
> that as one or two words)
>
> cheers,
> _mallory
>
>
> On Mon, Apr 22, 2019, at 7:47 PM, Swift, Daniel P. wrote:
>> Larry:
>>
>> Could you place the requirements after the textbox and within the label
>> include extra text for the screen reader only indicating that there is
>> a list of password requirements listed just after the textbox.
>>
>> <label>PasswordPlease note that requirements are
>> listed just after the password textbox</label>
>>
>> Thoughts?
>>
>> Dan Swift
>> Senior Web Specialist
>> Enterprise Services
>> West Chester University
>> 610.738.0589
>>
>>

From: Maxability
Date: Wed, Apr 24 2019 9:18PM
Subject: Re: How to convey password requirements on registration pages
← Previous message | Next message →

This is always a question to me. Here are my two cents.

Placing the instructions elsewhere and using aria-describedby perhaps
will be difficult for users with learning challenges as they have
navigate back and forth between the instructions area and the password
field. For SR users using aria-describedby will not allow to navigate
word by word at the PWD field.

I dint think of the pros and cons but here is my proposal.

Place a PWD instructions button in close proximity to the create new
pass word field. This button should receive focus before the password
field. On activating the button the instructions should be displayed,
once the user read the instruction, just by hitting the escape key focus
should be pushed to the password field allowing the user to type in.

In case user want to read the instructions again, the instruction button
is just a shift + tab away and enter key opens the button.

Only challenge I could think right now is an extra tab focus.

Thoughts?

Thanks & Regards

Rakesh

On 4/23/2019 5:50 PM, Isabel Holdsworth wrote:
> Larry:
>
> If the list of requirements is long, no matter how or where they
> appear on the screen, it's likely that some users, especially those
> with learning difficulties (and me), will struggle to follow the
> instructions.
>
> But for the benefit of screenreader users, the requirements need to be
> in very close proximity to the field they refer to, and as has been
> said by others, if the instructions come after the field then
> screenreader users need to be informed of their presence.
>
> I personally think that aria-describedby would work quite well here,
> but not relied upon. So if the instructions were placed just after the
> password field in the DOM, and associated with it using
> aria-describedby, this could offer quite a good solution.
>
> Cheers, Isabel
>
> On 22/04/2019, Mallory < = EMAIL ADDRESS REMOVED = > wrote:
>> As a "slow person" I benefit from (and I don't care how ugly) a list of how
>> I have to do it being visible to me at all times (I mean, not only when I
>> have focus on the pw field).
>>
>> Just try not to put the requirements in an aria-describedby setup, or if it
>> is, it can also be normally navigated to and read in any way needed (like by
>> character). I've focussed on pw fields in the past and got a book blasted at
>> me. It still meant I had to try to hold all the rules in my head.
>>
>> Dan: don't forget a space, but yeah that does look like it could be
>> reasonable:
>> (to avoid PasswordPlease, tho it depends on SR and setting whether you'd get
>> that as one or two words)
>>
>> cheers,
>> _mallory
>>
>>
>> On Mon, Apr 22, 2019, at 7:47 PM, Swift, Daniel P. wrote:
>>> Larry:
>>>
>>> Could you place the requirements after the textbox and within the label
>>> include extra text for the screen reader only indicating that there is
>>> a list of password requirements listed just after the textbox.
>>>
>>> <label>PasswordPlease note that requirements are
>>> listed just after the password textbox</label>
>>>
>>> Thoughts?
>>>
>>> Dan Swift
>>> Senior Web Specialist
>>> Enterprise Services
>>> West Chester University
>>> 610.738.0589
>>>
>>>

From: Mallory
Date: Thu, Apr 25 2019 2:02AM
Subject: Re: How to convey password requirements on registration pages
← Previous message | No next message

... or the instructions are visible plain text before the password field. I know some users stick to a forms-mode way of dealing with forms and so may miss it, so as Dan mentioned, having something attached to the field pointing out "hey there are password rules [at this location]" would help with that.
Plain text is always visible, always navigable, doesn't have problems with popups or vanishing or whatnot. I think the needs of users in this case especially should override visual-design concerns with the possible exception of, could a long set of instructions create issues for people who have some trouble focussing or determining what they're doing while in the form (some coga stuff).

It's something that certainly benefits from extra thinking.

cheers,
_mallory

On Thu, Apr 25, 2019, at 5:19 AM, Maxability wrote:
> This is always a question to me. Here are my two cents.
>
>
> Placing the instructions elsewhere and using aria-describedby perhaps
> will be difficult for users with learning challenges as they have
> navigate back and forth between the instructions area and the password
> field. For SR users using aria-describedby will not allow to navigate
> word by word at the PWD field.
>
> I dint think of the pros and cons but here is my proposal.
>
> Place a PWD instructions button in close proximity to the create new
> pass word field. This button should receive focus before the password
> field. On activating the button the instructions should be displayed,
> once the user read the instruction, just by hitting the escape key focus
> should be pushed to the password field allowing the user to type in.
>
> In case user want to read the instructions again, the instruction button
> is just a shift + tab away and enter key opens the button.
>
>
> Only challenge I could think right now is an extra tab focus.
>
>
> Thoughts?
>
>
> Thanks & Regards
>
> Rakesh
>
> On 4/23/2019 5:50 PM, Isabel Holdsworth wrote:
> > Larry:
> >
> > If the list of requirements is long, no matter how or where they
> > appear on the screen, it's likely that some users, especially those
> > with learning difficulties (and me), will struggle to follow the
> > instructions.
> >
> > But for the benefit of screenreader users, the requirements need to be
> > in very close proximity to the field they refer to, and as has been
> > said by others, if the instructions come after the field then
> > screenreader users need to be informed of their presence.
> >
> > I personally think that aria-describedby would work quite well here,
> > but not relied upon. So if the instructions were placed just after the
> > password field in the DOM, and associated with it using
> > aria-describedby, this could offer quite a good solution.
> >
> > Cheers, Isabel
> >
> > On 22/04/2019, Mallory < = EMAIL ADDRESS REMOVED = > wrote:
> >> As a "slow person" I benefit from (and I don't care how ugly) a list of how
> >> I have to do it being visible to me at all times (I mean, not only when I
> >> have focus on the pw field).
> >>
> >> Just try not to put the requirements in an aria-describedby setup, or if it
> >> is, it can also be normally navigated to and read in any way needed (like by
> >> character). I've focussed on pw fields in the past and got a book blasted at
> >> me. It still meant I had to try to hold all the rules in my head.
> >>
> >> Dan: don't forget a space, but yeah that does look like it could be
> >> reasonable:
> >> (to avoid PasswordPlease, tho it depends on SR and setting whether you'd get
> >> that as one or two words)
> >>
> >> cheers,
> >> _mallory
> >>
> >>
> >> On Mon, Apr 22, 2019, at 7:47 PM, Swift, Daniel P. wrote:
> >>> Larry:
> >>>
> >>> Could you place the requirements after the textbox and within the label
> >>> include extra text for the screen reader only indicating that there is
> >>> a list of password requirements listed just after the textbox.
> >>>
> >>> <label>PasswordPlease note that requirements are
> >>> listed just after the password textbox</label>
> >>>
> >>> Thoughts?
> >>>
> >>> Dan Swift
> >>> Senior Web Specialist
> >>> Enterprise Services
> >>> West Chester University
> >>> 610.738.0589
> >>>
> >>>