WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Accessible and Mobile enabled Date Pickers

for

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

From: Nancy Johnson
Date: Wed, Mar 28 2012 10:18AM
Subject: Accessible and Mobile enabled Date Pickers
No previous message | Next message →

Hi,

I was wondering if anyone on this list could recommend a date picker
that is both accessible and will work well on mobile.

I have this one, I wasn't happy with the mobile, but maybe I could do
something with it for mobile
http://oaa-accessibility.org/examplep/datepicker1/

Thanks

Nancy Johnson

From: Bryan Garaventa
Date: Wed, Mar 28 2012 11:10AM
Subject: Re: Accessible and Mobile enabled Date Pickers
← Previous message | Next message →

Here's one example
http://whatsock.com/modules/aria_calendar_module/demo.htm
I used it to build the day planner service at
http://planner.whatsock.com

----- Original Message -----
From: "Nancy Johnson" < = EMAIL ADDRESS REMOVED = >
To: "WebAIM Discussion List" < = EMAIL ADDRESS REMOVED = >
Sent: Wednesday, March 28, 2012 9:18 AM
Subject: [WebAIM] Accessible and Mobile enabled Date Pickers


> Hi,
>
> I was wondering if anyone on this list could recommend a date picker
> that is both accessible and will work well on mobile.
>
> I have this one, I wasn't happy with the mobile, but maybe I could do
> something with it for mobile
> http://oaa-accessibility.org/examplep/datepicker1/
>
> Thanks
>
> Nancy Johnson
> > >

From: Stella Mudd
Date: Wed, Mar 28 2012 11:11AM
Subject: Re: Accessible and Mobile enabled Date Pickers
← Previous message | Next message →

@Bryan G, I know your date picker works well. Does it work on mobile?

On Wednesday, March 28, 2012, Nancy Johnson wrote:

> Hi,
>
> I was wondering if anyone on this list could recommend a date picker
> that is both accessible and will work well on mobile.
>
> I have this one, I wasn't happy with the mobile, but maybe I could do
> something with it for mobile
> http://oaa-accessibility.org/examplep/datepicker1/
>
> Thanks
>
> Nancy Johnson
> > > >

From: Bryan Garaventa
Date: Wed, Mar 28 2012 11:21AM
Subject: Re: Accessible and Mobile enabled Date Pickers
← Previous message | Next message →

I've tested it on iOS devices like iPhones and iPads with no problems. I
don't have access to others like Blackberries though, so I'd need someone
else's feedback for that though.



----- Original Message -----
From: "Stella Mudd" < = EMAIL ADDRESS REMOVED = >
To: "WebAIM Discussion List" < = EMAIL ADDRESS REMOVED = >
Sent: Wednesday, March 28, 2012 10:11 AM
Subject: Re: [WebAIM] Accessible and Mobile enabled Date Pickers


> @Bryan G, I know your date picker works well. Does it work on mobile?
>
> On Wednesday, March 28, 2012, Nancy Johnson wrote:
>
>> Hi,
>>
>> I was wondering if anyone on this list could recommend a date picker
>> that is both accessible and will work well on mobile.
>>
>> I have this one, I wasn't happy with the mobile, but maybe I could do
>> something with it for mobile
>> http://oaa-accessibility.org/examplep/datepicker1/
>>
>> Thanks
>>
>> Nancy Johnson
>> >> >> >>
> > >

From: Stella Mudd
Date: Wed, Mar 28 2012 11:26AM
Subject: Re: Accessible and Mobile enabled Date Pickers
← Previous message | Next message →

Bryan you are quick on that keyboard! Beat me! Sounds good. You might
also consider Han's Hillens jQuery implementation:
http://hanshillen.github.com/jqtest/#goto_datepicker Once again, I have
not tested this on mobile. Maybe someone else can provide feedback.

On Wed, Mar 28, 2012 at 10:21 AM, Bryan Garaventa <
= EMAIL ADDRESS REMOVED = > wrote:

> I've tested it on iOS devices like iPhones and iPads with no problems. I
> don't have access to others like Blackberries though, so I'd need someone
> else's feedback for that though.
>
>
>
> ----- Original Message -----
> From: "Stella Mudd" < = EMAIL ADDRESS REMOVED = >
> To: "WebAIM Discussion List" < = EMAIL ADDRESS REMOVED = >
> Sent: Wednesday, March 28, 2012 10:11 AM
> Subject: Re: [WebAIM] Accessible and Mobile enabled Date Pickers
>
>
> > @Bryan G, I know your date picker works well. Does it work on mobile?
> >
> > On Wednesday, March 28, 2012, Nancy Johnson wrote:
> >
> >> Hi,
> >>
> >> I was wondering if anyone on this list could recommend a date picker
> >> that is both accessible and will work well on mobile.
> >>
> >> I have this one, I wasn't happy with the mobile, but maybe I could do
> >> something with it for mobile
> >> http://oaa-accessibility.org/examplep/datepicker1/
> >>
> >> Thanks
> >>
> >> Nancy Johnson
> >> > >> > >> > >>
> > > > > > >
> > > >

From: ihenix
Date: Wed, Mar 28 2012 11:35AM
Subject: Re: Accessible and Mobile enabled Date Pickers
← Previous message | Next message →

Hi,

I've tested Han's demos on iOS and the date picker didn't test so well. See http://www.iheni.com/wai-aria-support-on-ios/

One thing to remember is that ARIA support on mobile is not mature and as such not a fail safe solution. It's great to use to progressively enhance an already accessible page however.

Using a standard drop down for users to select dates from would do the trick.

Henny

---
@iheni
www.iheni.com

On 28 Mar 2012, at 18:26, Stella Mudd < = EMAIL ADDRESS REMOVED = > wrote:

> Bryan you are quick on that keyboard! Beat me! Sounds good. You might
> also consider Han's Hillens jQuery implementation:
> http://hanshillen.github.com/jqtest/#goto_datepicker Once again, I have
> not tested this on mobile. Maybe someone else can provide feedback.
>
> On Wed, Mar 28, 2012 at 10:21 AM, Bryan Garaventa <
> = EMAIL ADDRESS REMOVED = > wrote:
>
>> I've tested it on iOS devices like iPhones and iPads with no problems. I
>> don't have access to others like Blackberries though, so I'd need someone
>> else's feedback for that though.
>>
>>
>>
>> ----- Original Message -----
>> From: "Stella Mudd" < = EMAIL ADDRESS REMOVED = >
>> To: "WebAIM Discussion List" < = EMAIL ADDRESS REMOVED = >
>> Sent: Wednesday, March 28, 2012 10:11 AM
>> Subject: Re: [WebAIM] Accessible and Mobile enabled Date Pickers
>>
>>
>>> @Bryan G, I know your date picker works well. Does it work on mobile?
>>>
>>> On Wednesday, March 28, 2012, Nancy Johnson wrote:
>>>
>>>> Hi,
>>>>
>>>> I was wondering if anyone on this list could recommend a date picker
>>>> that is both accessible and will work well on mobile.
>>>>
>>>> I have this one, I wasn't happy with the mobile, but maybe I could do
>>>> something with it for mobile
>>>> http://oaa-accessibility.org/examplep/datepicker1/
>>>>
>>>> Thanks
>>>>
>>>> Nancy Johnson
>>>> >>>> >>>> >>>>
>>> >>> >>> >>
>> >> >> >>
> > >

From: Nancy Johnson
Date: Thu, Mar 29 2012 11:43AM
Subject: Re: Accessible and Mobile enabled Date Pickers
← Previous message | Next message →

Thank you both for sharing; I spent a long time testing with
platforms that I had available.

modules/aria_calendar_module/demo.htm...
This one was very good and worked on PC and my Android. Did not have
access to IOS. desktop nor mobile

1. I would like to see a close button, in case I change my mind, I can
get out of it without picking a date. I had to refresh the entire page
to get out of it.

There are inline styles that I can see only in firebug that are
associated with the aria roles... Can these move to the css with a
class as the font attribute is no longer supported in html5 and prefer
not to use inline styling.

Han's demo, http://hanshillen.github.com/jqtest/#goto_datepicker,
worked wonderfully on HTC Incredible 1 Android... However neither
the images were visible, nor was it keyboard accessible on Chrome,
Firefox, or IE8, pc platform.
I need it to work in all devices and platforms..

Thanks

Nancy

On Wed, Mar 28, 2012 at 1:35 PM, ihenix < = EMAIL ADDRESS REMOVED = > wrote:
> Hi,
>
> I've tested Han's demos on iOS and the date picker didn't test so well. See http://www.iheni.com/wai-aria-support-on-ios/
>
> One thing to remember is that ARIA support on mobile is not mature and as such not a fail safe solution. It's great to use to progressively enhance an already accessible page however.
>
> Using a standard drop down for users to select dates from would do the trick.
>
> Henny
>
> ---
> @iheni
> www.iheni.com
>
> On 28 Mar 2012, at 18:26, Stella Mudd < = EMAIL ADDRESS REMOVED = > wrote:
>
>> Bryan you are quick on that keyboard!

From: Bryan Garaventa
Date: Thu, Mar 29 2012 1:23PM
Subject: Re: Accessible and Mobile enabled Date Pickers
← Previous message | Next message →

Glad to hear it :)

If you press escape from within the calendar, it will close the popup and
place focus back on the triggering element.
Still though, I see that this wouldn't be much use from a mobile device. It
would be easy for a developer to add a close icon by modifying the code at
http://whatsock.com/modules/aria_calendar_module.zip
Just do a search for "<table" in the JS source code file.

I'm not sure what you mean by the ARIA related styling. All visual styling
is controlled from an external style sheet (global.css) also in the above
download. You can change the appearance of everything by changing those
classes. Which role are you referring to?


----- Original Message -----
From: "Nancy Johnson" < = EMAIL ADDRESS REMOVED = >
To: "WebAIM Discussion List" < = EMAIL ADDRESS REMOVED = >
Sent: Thursday, March 29, 2012 10:43 AM
Subject: Re: [WebAIM] Accessible and Mobile enabled Date Pickers


Thank you both for sharing; I spent a long time testing with
platforms that I had available.

modules/aria_calendar_module/demo.htm...
This one was very good and worked on PC and my Android. Did not have
access to IOS. desktop nor mobile

1. I would like to see a close button, in case I change my mind, I can
get out of it without picking a date. I had to refresh the entire page
to get out of it.

There are inline styles that I can see only in firebug that are
associated with the aria roles... Can these move to the css with a
class as the font attribute is no longer supported in html5 and prefer
not to use inline styling.

Han's demo, http://hanshillen.github.com/jqtest/#goto_datepicker,
worked wonderfully on HTC Incredible 1 Android... However neither
the images were visible, nor was it keyboard accessible on Chrome,
Firefox, or IE8, pc platform.
I need it to work in all devices and platforms..

Thanks

Nancy

On Wed, Mar 28, 2012 at 1:35 PM, ihenix < = EMAIL ADDRESS REMOVED = > wrote:
> Hi,
>
> I've tested Han's demos on iOS and the date picker didn't test so well.
> See http://www.iheni.com/wai-aria-support-on-ios/
>
> One thing to remember is that ARIA support on mobile is not mature and as
> such not a fail safe solution. It's great to use to progressively enhance
> an already accessible page however.
>
> Using a standard drop down for users to select dates from would do the
> trick.
>
> Henny
>
> ---
> @iheni
> www.iheni.com
>
> On 28 Mar 2012, at 18:26, Stella Mudd < = EMAIL ADDRESS REMOVED = > wrote:
>
>> Bryan you are quick on that keyboard! Beat me! Sounds good. You might
>> also consider Han's Hillens jQuery implementation:
>> http://hanshillen.github.com/jqtest/#goto_datepicker Once again, I have
>> not tested this on mobile. Maybe someone else can provide feedback.
>>
>> On Wed, Mar 28, 2012 at 10:21 AM, Bryan Garaventa <
>> = EMAIL ADDRESS REMOVED = > wrote:
>>
>>> I've tested it on iOS devices like iPhones and iPads with no problems. I
>>> don't have access to others like Blackberries though, so I'd need
>>> someone
>>> else's feedback for that though.
>>>
>>>
>>>
>>> ----- Original Message -----
>>> From: "Stella Mudd" < = EMAIL ADDRESS REMOVED = >
>>> To: "WebAIM Discussion List" < = EMAIL ADDRESS REMOVED = >
>>> Sent: Wednesday, March 28, 2012 10:11 AM
>>> Subject: Re: [WebAIM] Accessible and Mobile enabled Date Pickers
>>>
>>>
>>>> @Bryan G, I know your date picker works well. Does it work on mobile?
>>>>
>>>> On Wednesday, March 28, 2012, Nancy Johnson wrote:
>>>>
>>>>> Hi,
>>>>>
>>>>> I was wondering if anyone on this list could recommend a date picker
>>>>> that is both accessible and will work well on mobile.
>>>>>
>>>>> I have this one, I wasn't happy with the mobile, but maybe I could do
>>>>> something with it for mobile
>>>>> http://oaa-accessibility.org/examplep/datepicker1/
>>>>>
>>>>> Thanks
>>>>>
>>>>> Nancy Johnson
>>>>> >>>>> >>>>> >>>>>
>>>> >>>> >>>> >>>
>>> >>> >>> >>>
>> >> >> > > >

From: Nancy Johnson
Date: Thu, Mar 29 2012 1:27PM
Subject: Re: Accessible and Mobile enabled Date Pickers
← Previous message | No next message

Thanks so much, If you look at the code page using Firebug which is
an addon to Firefox...

Nancy

On Thu, Mar 29, 2012 at 3:23 PM, Bryan Garaventa
< = EMAIL ADDRESS REMOVED = > wrote:
> Glad to hear it :)
>
> If you press escape from within the calendar, it will close the popup and
> place focus back on the triggering element.
> Still though, I see that this wouldn't be much use from a mobile device. It
> would be easy for a developer to add a close icon by modifying the code at
> http://whatsock.com/modules/aria_calendar_module.zip
> Just do a search for "<table" in the JS source code file.
>
> I'm not sure what you mean by the ARIA related styling. All visual styling
> is controlled from an external style sheet (global.css) also in the above
> download. You can change the appearance of everything by changing those
> classes. Which role are you referring to?
>
>
> ----- Original Message -----
> From: "Nancy Johnson" < = EMAIL ADDRESS REMOVED = >
> To: "WebAIM Discussion List" < = EMAIL ADDRESS REMOVED = >
> Sent: Thursday, March 29, 2012 10:43 AM
> Subject: Re: [WebAIM] Accessible and Mobile enabled Date Pickers
>
>
> Thank you both for sharing;