E-mail List Archives
Thread: how to make use of asterisks accessible
Number of posts in this thread: 8 (In chronological order)
From: Angela French
Date: Thu, Nov 08 2012 4:35PM
Subject: how to make use of asterisks accessible
No previous message | Next message →
Hello,
I have a web page I'm building that uses some asterisks to supply additional information. I'm wondering if I should move the supplemental information to the bottom of the page and link to it like one might do with footnotes, or is it understandable if it soon follows the use of the first asterisk?
Here is my context (pasted from a Word document).
* PERS/TRS participants, or those with no retirement plan:
* $17,000 - If you are under age 50
* $22,500* - If you are age 50 or over
* State Board Retirement Plan participants:
* $17,000 - If you are under age 50
* $22,500* - If you are age 50 or over.
*The VIP maximum contribution amount shown above includes the Age 50 "Catch-up Contribution" of $5,500 as described in the "Catch-up Contributions" section below.
Thank you,
Angela French
Internet Specialist
State Board for Community and Technical Colleges
360-704-4316
= EMAIL ADDRESS REMOVED =
http://www.checkoutacollege.com/
From: Lucy Greco
Date: Thu, Nov 08 2012 5:19PM
Subject: Re: how to make use of asterisks accessible
← Previous message | Next message →
hello:
I and many screen reader users turn off punctuation so i have no idea
ware you put the * so i would vote for the footnote
On 11/8/12, Angela French < = EMAIL ADDRESS REMOVED = > wrote:
> Hello,
> I have a web page I'm building that uses some asterisks to supply additional
> information. I'm wondering if I should move the supplemental information to
> the bottom of the page and link to it like one might do with footnotes, or
> is it understandable if it soon follows the use of the first asterisk?
>
> Here is my context (pasted from a Word document).
>
>
> * PERS/TRS participants, or those with no retirement plan:
> * $17,000 - If you are under age 50
> * $22,500* - If you are age 50 or over
> * State Board Retirement Plan participants:
> * $17,000 - If you are under age 50
> * $22,500* - If you are age 50 or over.
> *The VIP maximum contribution amount shown above includes the Age 50
> "Catch-up Contribution" of $5,500 as described in the "Catch-up
> Contributions" section below.
> Thank you,
>
> Angela French
> Internet Specialist
> State Board for Community and Technical Colleges
> 360-704-4316
> = EMAIL ADDRESS REMOVED =
> http://www.checkoutacollege.com/
>
> > > >
--
Lucia Greco
Web Access Analyst
IST-Campus Technology Services
University of California, Berkeley
(510) 289-6008
http://webaccess.berkeley.edu
From: Angela French
Date: Thu, Nov 08 2012 5:22PM
Subject: Re: how to make use of asterisks accessible
← Previous message | Next message →
An asterisk is punctuation? I had no idea. I still see forms that use an asterisk to identify required fields on form elements.
I decided the block of content was poorly written and received permission to edit it.
>-----Original Message-----
>From: = EMAIL ADDRESS REMOVED = [mailto:webaim-forum-
> = EMAIL ADDRESS REMOVED = ] On Behalf Of Lucy Greco
>Sent: Thursday, November 08, 2012 4:19 PM
>To: WebAIM Discussion List
>Subject: Re: [WebAIM] how to make use of asterisks accessible
>
>hello:
> I and many screen reader users turn off punctuation so i have no idea ware
>you put the * so i would vote for the footnote
>
>
>On 11/8/12, Angela French < = EMAIL ADDRESS REMOVED = > wrote:
>> Hello,
>> I have a web page I'm building that uses some asterisks to supply
>> additional information. I'm wondering if I should move the
>> supplemental information to the bottom of the page and link to it like
>> one might do with footnotes, or is it understandable if it soon follows the
>use of the first asterisk?
>>
>> Here is my context (pasted from a Word document).
>>
>>
>> * PERS/TRS participants, or those with no retirement plan:
>> * $17,000 - If you are under age 50
>> * $22,500* - If you are age 50 or over
>> * State Board Retirement Plan participants:
>> * $17,000 - If you are under age 50
>> * $22,500* - If you are age 50 or over.
>> *The VIP maximum contribution amount shown above includes the Age 50
>> "Catch-up Contribution" of $5,500 as described in the "Catch-up
>> Contributions" section below.
>> Thank you,
>>
>> Angela French
>> Internet Specialist
>> State Board for Community and Technical Colleges
>> 360-704-4316
>> = EMAIL ADDRESS REMOVED =
>> http://www.checkoutacollege.com/
>>
>> >> >> list messages to = EMAIL ADDRESS REMOVED =
>>
>
>
>--
>Lucia Greco
>Web Access Analyst
>IST-Campus Technology Services
>University of California, Berkeley
>(510) 289-6008
>http://webaccess.berkeley.edu
>>>messages to = EMAIL ADDRESS REMOVED =
From: Lucy Greco
Date: Thu, Nov 08 2012 5:42PM
Subject: Re: how to make use of asterisks accessible
← Previous message | Next message →
i would not say don't use them to indicate required fields but use
offscreen text as well. you need to still use * because it is a
recognized simple and people with ld find it helpfull
On 11/8/12, Angela French < = EMAIL ADDRESS REMOVED = > wrote:
> An asterisk is punctuation? I had no idea. I still see forms that use an
> asterisk to identify required fields on form elements.
> I decided the block of content was poorly written and received permission
> to edit it.
>
>
>
>>-----Original Message-----
>>From: = EMAIL ADDRESS REMOVED = [mailto:webaim-forum-
>> = EMAIL ADDRESS REMOVED = ] On Behalf Of Lucy Greco
>>Sent: Thursday, November 08, 2012 4:19 PM
>>To: WebAIM Discussion List
>>Subject: Re: [WebAIM] how to make use of asterisks accessible
>>
>>hello:
>> I and many screen reader users turn off punctuation so i have no idea
>> ware
>>you put the * so i would vote for the footnote
>>
>>
>>On 11/8/12, Angela French < = EMAIL ADDRESS REMOVED = > wrote:
>>> Hello,
>>> I have a web page I'm building that uses some asterisks to supply
>>> additional information. I'm wondering if I should move the
>>> supplemental information to the bottom of the page and link to it like
>>> one might do with footnotes, or is it understandable if it soon follows
>>> the
>>use of the first asterisk?
>>>
>>> Here is my context (pasted from a Word document).
>>>
>>>
>>> * PERS/TRS participants, or those with no retirement plan:
>>> * $17,000 - If you are under age 50
>>> * $22,500* - If you are age 50 or over
>>> * State Board Retirement Plan participants:
>>> * $17,000 - If you are under age 50
>>> * $22,500* - If you are age 50 or over.
>>> *The VIP maximum contribution amount shown above includes the Age 50
>>> "Catch-up Contribution" of $5,500 as described in the "Catch-up
>>> Contributions" section below.
>>> Thank you,
>>>
>>> Angela French
>>> Internet Specialist
>>> State Board for Community and Technical Colleges
>>> 360-704-4316
>>> = EMAIL ADDRESS REMOVED =
>>> http://www.checkoutacollege.com/
>>>
>>> >>> >>> list messages to = EMAIL ADDRESS REMOVED =
>>>
>>
>>
>>--
>>Lucia Greco
>>Web Access Analyst
>>IST-Campus Technology Services
>>University of California, Berkeley
>>(510) 289-6008
>>http://webaccess.berkeley.edu
>>>>>>messages to = EMAIL ADDRESS REMOVED =
> > > >
--
Lucia Greco
Web Access Analyst
IST-Campus Technology Services
University of California, Berkeley
(510) 289-6008
http://webaccess.berkeley.edu
From: John E Brandt
Date: Fri, Nov 09 2012 9:39AM
Subject: Re: how to make use of asterisks accessible
← Previous message | Next message →
I have seen some developers approach this by using an image (<img>) of an
asterisk and then using the ALT description and Title to inform the screen
reader (and others) that there is more information available about this
particular item. The image is also clickable and links to the additional
information. But using an actual link and anchor on the page for more
information is also a valid approach as long as the link content makes sense
when read out of context (i.e., NOT "click here" or "more info", but rather
"Use this link for more information about .....").
In polls/survey's in SurveyGizmo, if you identify an item as "required" they
use the image approach and the ALT indicates "this item is required" with no
additional link.
~j
John E. Brandt
www.jebswebs.com
= EMAIL ADDRESS REMOVED =
207-622-7937
Augusta, Maine, USA
-----Original Message-----
From: = EMAIL ADDRESS REMOVED =
[mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Angela French
Sent: Thursday, November 08, 2012 6:35 PM
To: 'WebAim Forum ( = EMAIL ADDRESS REMOVED = )'
Subject: [WebAIM] how to make use of asterisks accessible
Hello,
I have a web page I'm building that uses some asterisks to supply additional
information. I'm wondering if I should move the supplemental information to
the bottom of the page and link to it like one might do with footnotes, or
is it understandable if it soon follows the use of the first asterisk?
Here is my context (pasted from a Word document).
* PERS/TRS participants, or those with no retirement plan:
* $17,000 - If you are under age 50
* $22,500* - If you are age 50 or over
* State Board Retirement Plan participants:
* $17,000 - If you are under age 50
* $22,500* - If you are age 50 or over.
*The VIP maximum contribution amount shown above includes the Age 50
"Catch-up Contribution" of $5,500 as described in the "Catch-up
Contributions" section below.
Thank you,
Angela French
Internet Specialist
State Board for Community and Technical Colleges
360-704-4316
= EMAIL ADDRESS REMOVED =
http://www.checkoutacollege.com/
messages to = EMAIL ADDRESS REMOVED =
From: Bim Egan
Date: Fri, Nov 09 2012 10:32AM
Subject: Re: how to make use of asterisks accessible
← Previous message | Next message →
Hi,
To Angela: my feeling is that there are too many asterisks. For people
without sight, it's difficult to determine whether the * is at the start or
end of a line. Don't know if it's just because of the limitations of text
email, but to me it sounded as though everything was related, and there was
no point at which it was clear what explained the *'s. Try using headings
and list structure, and add the word "Note" to the explanation paragraph and
suddenly it makes a lot more sense.
Suggestion:
<h3> PERS/TRS participants, or those with no retirement plan:</h3>
<ul>
<li>
$17,000 - If you are under age 50
</li>
<li>
$22,500* - If you are age 50 or over
</li></ul>
<h3> State Board Retirement Plan participants: </h3>
<ul>
<li>
$17,000 - If you are under age 50
</li>
<li>
$22,500* - If you are age 50 or over.
</li></ul>
* Note: The VIP maximum contribution amount shown above includes the Age 50
"Catch-up Contribution" of $5,500 as described in the "Catch-up
Contributions" section below.
To John: using images to represent asterisks may cause issues for some
users. depending on the browser and screen reader in use, some screen
readers don't pick them up, even when they are within explicit labels. This
may be a screen reader bug, and it would be wrong to tell developers not to
do something because of a software bug, but it's as well to be aware that
this practice may cause problems. Best is to keep it simple and use the
text * instead.
Cheers,
Bim
----- Original Message -----
From: "John E Brandt" < = EMAIL ADDRESS REMOVED = >
To: "'WebAIM Discussion List'" < = EMAIL ADDRESS REMOVED = >
Sent: Friday, November 09, 2012 4:39 PM
Subject: Re: [WebAIM] how to make use of asterisks accessible
I have seen some developers approach this by using an image (<img>) of an
asterisk and then using the ALT description and Title to inform the screen
reader (and others) that there is more information available about this
particular item. The image is also clickable and links to the additional
information. But using an actual link and anchor on the page for more
information is also a valid approach as long as the link content makes sense
when read out of context (i.e., NOT "click here" or "more info", but rather
"Use this link for more information about .....").
In polls/survey's in SurveyGizmo, if you identify an item as "required" they
use the image approach and the ALT indicates "this item is required" with no
additional link.
~j
John E. Brandt
www.jebswebs.com
= EMAIL ADDRESS REMOVED =
207-622-7937
Augusta, Maine, USA
-----Original Message-----
From: = EMAIL ADDRESS REMOVED =
[mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Angela French
Sent: Thursday, November 08, 2012 6:35 PM
To: 'WebAim Forum ( = EMAIL ADDRESS REMOVED = )'
Subject: [WebAIM] how to make use of asterisks accessible
Hello,
I have a web page I'm building that uses some asterisks to supply additional
information. I'm wondering if I should move the supplemental information to
the bottom of the page and link to it like one might do with footnotes, or
is it understandable if it soon follows the use of the first asterisk?
Here is my context (pasted from a Word document).
* PERS/TRS participants, or those with no retirement plan:
* $17,000 - If you are under age 50
* $22,500* - If you are age 50 or over
* State Board Retirement Plan participants:
* $17,000 - If you are under age 50
* $22,500* - If you are age 50 or over.
*The VIP maximum contribution amount shown above includes the Age 50
"Catch-up Contribution" of $5,500 as described in the "Catch-up
Contributions" section below.
Thank you,
Angela French
Internet Specialist
State Board for Community and Technical Colleges
360-704-4316
= EMAIL ADDRESS REMOVED =
http://www.checkoutacollege.com/
messages to = EMAIL ADDRESS REMOVED =
From: Iaffaldano, Michelangelo
Date: Fri, Nov 09 2012 2:09PM
Subject: Re: how to make use of asterisks accessible
← Previous message | Next message →
Is it still OK to mark required form fields with an asterisk at the end of the label string? I have seen various demos that complicate that technique but I am not sure about the benefits to the end users.
Michelangelo
-----Original Message-----
From: Bim Egan [mailto: = EMAIL ADDRESS REMOVED = ]
Sent: November 9, 2012 12:32 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] how to make use of asterisks accessible
Hi,
To Angela: my feeling is that there are too many asterisks. For people without sight, it's difficult to determine whether the * is at the start or
end of a line. Don't know if it's just because of the limitations of text
email, but to me it sounded as though everything was related, and there was no point at which it was clear what explained the *'s. Try using headings and list structure, and add the word "Note" to the explanation paragraph and suddenly it makes a lot more sense.
Suggestion:
<h3> PERS/TRS participants, or those with no retirement plan:</h3> <ul> <li>
$17,000 - If you are under age 50
</li>
<li>
$22,500* - If you are age 50 or over
</li></ul>
<h3> State Board Retirement Plan participants: </h3> <ul> <li>
$17,000 - If you are under age 50
</li>
<li>
$22,500* - If you are age 50 or over.
</li></ul>
* Note: The VIP maximum contribution amount shown above includes the Age 50 "Catch-up Contribution" of $5,500 as described in the "Catch-up Contributions" section below.
To John: using images to represent asterisks may cause issues for some users. depending on the browser and screen reader in use, some screen readers don't pick them up, even when they are within explicit labels. This may be a screen reader bug, and it would be wrong to tell developers not to do something because of a software bug, but it's as well to be aware that this practice may cause problems. Best is to keep it simple and use the text * instead.
Cheers,
Bim
From: Paul J. Adam
Date: Fri, Nov 09 2012 2:23PM
Subject: Re: how to make use of asterisks accessible
← Previous message | No next message
I have some feedback on the use of * to indicate required form fields.
I wrote a blog post a while back discussing this. http://www.deque.com/accessible-client-side-form-validation-html5-wai-aria
Here's the excerpt:
By default NVDA will not speak an asterisk * as star. VoiceOver & JAWS both say star. NVDA users can adjust their Symbol Pronunciation settings to force * to be spoken by setting the Level to some but not all users are aware of this feature and will usually be running on default settings. By placing the aria-required=true attribute on all required fields NVDA will now announce they are required at the default settings. VoiceOver and JAWS will speak the star and the required attribute.
aria-required=true
The easiest enhancement is to add the aria-required=true attribute to all required fields in your form.
Paul J. Adam
Accessibility Evangelist
Deque Systems
= EMAIL ADDRESS REMOVED =
www.PaulJAdam.com
@pauljadam on Twitter
On Nov 9, 2012, at 3:09 PM, "Iaffaldano, Michelangelo" < = EMAIL ADDRESS REMOVED = > wrote:
> Is it still OK to mark required form fields with an asterisk at the end of the label string? I have seen various demos that complicate that technique but I am not sure about the benefits to the end users.
>
> Michelangelo
>
> -----Original Message-----
> From: Bim Egan [mailto: = EMAIL ADDRESS REMOVED = ]
> Sent: November 9, 2012 12:32 PM
> To: WebAIM Discussion List
> Subject: Re: [WebAIM] how to make use of asterisks accessible
>
> Hi,
>
> To Angela: my feeling is that there are too many asterisks. For people without sight, it's difficult to determine whether the * is at the start or
> end of a line. Don't know if it's just because of the limitations of text
> email, but to me it sounded as though everything was related, and there was no point at which it was clear what explained the *'s. Try using headings and list structure, and add the word "Note" to the explanation paragraph and suddenly it makes a lot more sense.
> Suggestion:
>
> <h3> PERS/TRS participants, or those with no retirement plan:</h3> <ul> <li>
> $17,000 - If you are under age 50
> </li>
> <li>
> $22,500* - If you are age 50 or over
> </li></ul>
>
> <h3> State Board Retirement Plan participants: </h3> <ul> <li>
> $17,000 - If you are under age 50
> </li>
> <li>
> $22,500* - If you are age 50 or over.
> </li></ul>
>
> * Note: The VIP maximum contribution amount shown above includes the Age 50 "Catch-up Contribution" of $5,500 as described in the "Catch-up Contributions" section below.
>
>
> To John: using images to represent asterisks may cause issues for some users. depending on the browser and screen reader in use, some screen readers don't pick them up, even when they are within explicit labels. This may be a screen reader bug, and it would be wrong to tell developers not to do something because of a software bug, but it's as well to be aware that this practice may cause problems. Best is to keep it simple and use the text * instead.
>
> Cheers,
>
> Bim
>
> > >