E-mail List Archives
Thread: Comparison widgets
Number of posts in this thread: 5 (In chronological order)
From: Karl Brown
Date: Mon, Apr 17 2017 6:30AM
Subject: Comparison widgets
No previous message | Next message →
Hi,
I'm starting learning JavaScript and wanted to write a price comparison
tool.
I want to make sure it's accessible, but the ones I see all look like divs.
I was wondering whether people think that using a table would be more
accessible? It's probably harder for me to code in JavaScript but that's
why I'm trying to learn it.
--
Karl Brown
Twitter: @kbdevelops
Skype: kbdevelopment
Professional Certificate Web Accessibility Compliance (Distinction),
University of South Australia, 2015
From: Tim Harshbarger
Date: Mon, Apr 17 2017 6:50AM
Subject: Re: Comparison widgets
← Previous message | Next message →
I think a table would work quite well for this kind of information.
-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Karl Brown
Sent: Monday, April 17, 2017 7:30 AM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: [WebAIM] Comparison widgets
Hi,
I'm starting learning JavaScript and wanted to write a price comparison
tool.
I want to make sure it's accessible, but the ones I see all look like divs.
I was wondering whether people think that using a table would be more
accessible? It's probably harder for me to code in JavaScript but that's
why I'm trying to learn it.
--
Karl Brown
Twitter: @kbdevelops
Skype: kbdevelopment
Professional Certificate Web Accessibility Compliance (Distinction),
University of South Australia, 2015
From: JP Jamous
Date: Mon, Apr 17 2017 7:29AM
Subject: Re: Comparison widgets
← Previous message | Next message →
Karl,
Definitely a table. If you have a Div for me and I used a screen reader, how am I supposed to compare its value with that of its sibling? The only way is to down arrow through the page.
However, if you make a table with scope="col" and scope="row", then I can hear the column or row heading plus the value. Now, I can map out that table in my head and compare a WD 1TB hard drive with a Seagate 1TB hard drive with similar features.
You can do it in JavaScript, but you will need lots of coding and aria all over the place. Why do that when the solution is much easier? Plus, too much aria can be counter-productive as it can crash screen readers and browsers like JAWS and IE.
-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Karl Brown
Sent: Monday, April 17, 2017 7:30 AM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: [WebAIM] Comparison widgets
Hi,
I'm starting learning JavaScript and wanted to write a price comparison tool.
I want to make sure it's accessible, but the ones I see all look like divs.
I was wondering whether people think that using a table would be more accessible? It's probably harder for me to code in JavaScript but that's why I'm trying to learn it.
--
Karl Brown
Twitter: @kbdevelops
Skype: kbdevelopment
Professional Certificate Web Accessibility Compliance (Distinction), University of South Australia, 2015
From: Birkir R. Gunnarsson
Date: Mon, Apr 17 2017 7:35AM
Subject: Re: Comparison widgets
← Previous message | Next message →
Karl
Maybe you can create a table where users can click the column header
to sort the columns.
You can start with the Deque University example:
https://dequeuniversity.com/library/aria/tables/sf-sortable-grid
On 4/17/17, JP Jamous < = EMAIL ADDRESS REMOVED = > wrote:
> Karl,
>
> Definitely a table. If you have a Div for me and I used a screen reader, how
> am I supposed to compare its value with that of its sibling? The only way is
> to down arrow through the page.
>
> However, if you make a table with scope="col" and scope="row", then I can
> hear the column or row heading plus the value. Now, I can map out that table
> in my head and compare a WD 1TB hard drive with a Seagate 1TB hard drive
> with similar features.
>
> You can do it in JavaScript, but you will need lots of coding and aria all
> over the place. Why do that when the solution is much easier? Plus, too much
> aria can be counter-productive as it can crash screen readers and browsers
> like JAWS and IE.
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf
> Of Karl Brown
> Sent: Monday, April 17, 2017 7:30 AM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: [WebAIM] Comparison widgets
>
> Hi,
>
> I'm starting learning JavaScript and wanted to write a price comparison
> tool.
>
> I want to make sure it's accessible, but the ones I see all look like divs.
> I was wondering whether people think that using a table would be more
> accessible? It's probably harder for me to code in JavaScript but that's why
> I'm trying to learn it.
>
> --
> Karl Brown
> Twitter: @kbdevelops
> Skype: kbdevelopment
>
> Professional Certificate Web Accessibility Compliance (Distinction),
> University of South Australia, 2015
> > > http://webaim.org/discussion/archives
> >
> > > > >
--
Work hard. Have fun. Make history.
From: Karl Brown
Date: Tue, Apr 18 2017 3:58AM
Subject: Re: Comparison widgets
← Previous message | No next message
Thanks, everyone.
I've been thinking it was time to learn how to do some JavaScript for a
while, this kind of functionality should give me an excuse to learn and to
make sure I'm building something accessible at the same time. If I can get
it right, not only will I have learnt something new (new skills are always
a plus), but I'll have something that could go live with minimal effort.
Thanks again!
On Mon, Apr 17, 2017 at 2:35 PM, Birkir R. Gunnarsson <
= EMAIL ADDRESS REMOVED = > wrote:
> Karl
>
> Maybe you can create a table where users can click the column header
> to sort the columns.
> You can start with the Deque University example:
> https://dequeuniversity.com/library/aria/tables/sf-sortable-grid
>
>
>
> On 4/17/17, JP Jamous < = EMAIL ADDRESS REMOVED = > wrote:
> > Karl,
> >
> > Definitely a table. If you have a Div for me and I used a screen reader,
> how
> > am I supposed to compare its value with that of its sibling? The only
> way is
> > to down arrow through the page.
> >
> > However, if you make a table with scope="col" and scope="row", then I can
> > hear the column or row heading plus the value. Now, I can map out that
> table
> > in my head and compare a WD 1TB hard drive with a Seagate 1TB hard drive
> > with similar features.
> >
> > You can do it in JavaScript, but you will need lots of coding and aria
> all
> > over the place. Why do that when the solution is much easier? Plus, too
> much
> > aria can be counter-productive as it can crash screen readers and
> browsers
> > like JAWS and IE.
> >
> > -----Original Message-----
> > From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf
> > Of Karl Brown
> > Sent: Monday, April 17, 2017 7:30 AM
> > To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> > Subject: [WebAIM] Comparison widgets
> >
> > Hi,
> >
> > I'm starting learning JavaScript and wanted to write a price comparison
> > tool.
> >
> > I want to make sure it's accessible, but the ones I see all look like
> divs.
> > I was wondering whether people think that using a table would be more
> > accessible? It's probably harder for me to code in JavaScript but that's
> why
> > I'm trying to learn it.
> >
> > --
> > Karl Brown
> > Twitter: @kbdevelops
> > Skype: kbdevelopment
> >
> > Professional Certificate Web Accessibility Compliance (Distinction),
> > University of South Australia, 2015
> > > > > archives at
> > http://webaim.org/discussion/archives
> > > >
> > > > > > > > > >
>
>
> --
> Work hard. Have fun. Make history.
> > > > >
--
Karl Brown
Twitter: @kbdevelops
Skype: kbdevelopment
Professional Certificate Web Accessibility Compliance (Distinction),
University of South Australia, 2015