E-mail List Archives

Search E-mail List Archives for

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

From: Mohith BP
Date: Tue, Nov 13 2018 4:00AM
Subject: Help needed to integrate aXe webdriverjs into selenium
No previous message | Next message →

Hi Folks,

I am trying to integrate aXe webdriverjs into existing automation
framework. However I am hitting road blocks as the documentation
suggests to use node.js with jasmine.
As I have no experience with Node.JS.

The current environment I am running is Eclipse and Selenium with
webdrivers for Chrome and Firefox.

Would like to know the experience of integrating aXe webdriverjs into
existing automation framework.

Thanks & Regards,
Mohith B. P.

From: Marcy Sutton
Date: Tue, Nov 13 2018 12:14PM
Subject: Re: Help needed to integrate aXe webdriverjs into selenium
← Previous message | Next message →

Hi Mohith,

The axe-webdriverjs library requires Node.js, as that is how it injects into the page. There is an open source axe Selenium Java project you could check out: https://github.com/dequelabs/axe-selenium-java <https://github.com/dequelabs/axe-selenium-java>

Otherwise, the best place to get help with axe implementations is in our Gitter channel: https://gitter.im/dequelabs/axe-core <https://gitter.im/dequelabs/axe-core>

Hope that helps!

Marcy Sutton | Developer Advocate | 206-819-8408
Deque Systems - Accessibility for Good
deque.com <http://deque.com/>;

> On Nov 13, 2018, at 11:00 AM, = EMAIL ADDRESS REMOVED = wrote:
>
> Send WebAIM-Forum mailing list submissions to
> = EMAIL ADDRESS REMOVED =
>
> To subscribe or unsubscribe via the World Wide Web, visit
> http://list.webaim.org/mailman/listinfo/webaim-forum
> or, via email, send a message with subject or body 'help' to
> = EMAIL ADDRESS REMOVED =
>
> You can reach the person managing the list at
> = EMAIL ADDRESS REMOVED =
>
> When replying, please edit your Subject line so it is more specific
> than "Re: Contents of WebAIM-Forum digest..."
> Today's Topics:
>
> 1. Accessible table where some data spans multiple columns
> (Jeremy Echols)
> 2. Re: Accessible table where some data spans multiple columns
> (Philippe Vayssi?re)
> 3. Fwd: [community] Tenon-UI - a11y-oriented React component
> library (Brandon Keith Biggs)
> 4. Help needed to integrate aXe webdriverjs into selenium (Mohith BP)
> 5. Re: Accessible table where some data spans multiple columns
> (Birkir R. Gunnarsson)
> 6. Re: Accessible table where some data spans multiple columns
> (glen walker)
> 7. Re: Accessible table where some data spans multiple columns
> (Jeremy Echols)
> 8. Re: Accessible table where some data spans multiple columns
> (glen walker)
> 9. Re: Accessible dragon drop component? ? some questions
> (Bryan Garaventa)
>
> From: Jeremy Echols < = EMAIL ADDRESS REMOVED = >
> Subject: [WebAIM] Accessible table where some data spans multiple columns
> Date: November 12, 2018 at 12:24:07 PM PST
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>
>
> I'm trying to figure out how to make a table read the headers properly when a data cell spans multiple columns. We have a data table (gist URL below) where we're describing fines for library resources, and some of the fines are the same across multiple groups, so naturally we used "colspan" to make it clear that the information pertains to multiple groups. Unfortunately, when I tested this out with NVDA, it only read the first pertinent header for the data. I'm not sure why this is happening, as the markup looks correct to me.
>
> Any ideas what's going on? Is this an NVDA bug or am I missing something obvious?
>
> Gist URL: https://gist.github.com/jechols/8e1d447e98c9c40e24e114e80a5c5b7b#file-table-html
>
>
>
>
> From: Philippe Vayssière < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] Accessible table where some data spans multiple columns
> Date: November 13, 2018 at 12:45:34 AM PST
> To: = EMAIL ADDRESS REMOVED =
>
>
> Hi,
>
> headers and cells should be associated via the id and headers attributes mechanism (even better if you can simplify your table and not have colspan and rowspan. If).
> WCAG Techniques H43 and F90 are relevant here:
>
> * H43: Using id and headers attributes to associate data cells with header cells in data tables <https://www.w3.org/WAI/GL/WCAG20-TECHS/H43.html>
> * F90: Failure of Success Criterion 1.3.1 for incorrectly associating table headers and content via the headers and id attributes <F90: Failure of Success Criterion 1.3.1 for incorrectly associating table headers and content via the headers and id attributes>
>
> This bookmarklet by Gez Lemon may help verifying the tedious – and prone to error – work of adding headers: <http://juicystudio.com/article/complextableinspector.php>;
>
>
> Philippe
>
> Le 12/11/2018 à 21:24, Jeremy Echols a écrit :
>> I'm trying to figure out how to make a table read the headers properly when a data cell spans multiple columns. We have a data table (gist URL below) where we're describing fines for library resources, and some of the fines are the same across multiple groups, so naturally we used "colspan" to make it clear that the information pertains to multiple groups. Unfortunately, when I tested this out with NVDA, it only read the first pertinent header for the data. I'm not sure why this is happening, as the markup looks correct to me.
>>
>> Any ideas what's going on? Is this an NVDA bug or am I missing something obvious?
>>
>> Gist URL: https://gist.github.com/jechols/8e1d447e98c9c40e24e114e80a5c5b7b#file-table-html
>>
>
>
>
>
>
> From: Brandon Keith Biggs < = EMAIL ADDRESS REMOVED = >
> Subject: [WebAIM] Fwd: [community] Tenon-UI - a11y-oriented React component library
> Date: November 13, 2018 at 2:28:51 AM PST
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>
>
> Hello,
> Just thought people would like to know about this new accessible framework
> in React:
> https://github.com/tenon-io/tenon-ui
> Thanks,
>
> Brandon Keith Biggs <http://brandonkeithbiggs.com/>;
>
>
> ---------- Forwarded message ---------
> From: Harnum, Alan < = EMAIL ADDRESS REMOVED = >
> Date: Mon, Nov 12, 2018 at 2:10 PM
> Subject: [community] Tenon-UI - a11y-oriented React component library
> To: = EMAIL ADDRESS REMOVED = < = EMAIL ADDRESS REMOVED = >
>
>
> Released in 1.0 as of today:
>
> Docs: https://tenon-ui.info/
> GitHub repo: https://github.com/tenon-io/tenon-ui
>
> Released by the development team behind the https://tenon.io/ accessibility
> testing tool.
>
> I haven't seriously used React in a few years but I know the mindshare and
> adoption of it is, shall we say, significant in the web development world,
> so this looks like an important effort.
>
> ALAN HARNUM
> SENIOR INCLUSIVE DEVELOPER
> INCLUSIVE DESIGN RESEARCH CENTRE, OCAD UNIVERSITY
>
> E = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
> OCAD UNIVERSITY
> 100 McCaul Street, Toronto, Canada, M5T 1W1
> www.ocadu.ca<;http://ocadu.ca/>;
>
> > Inclusive Design Community ( = EMAIL ADDRESS REMOVED = )
> > https://lists.idrc.ocadu.ca/mailman/listinfo/community
>
>
>
>
> From: Mohith BP < = EMAIL ADDRESS REMOVED = >
> Subject: [WebAIM] Help needed to integrate aXe webdriverjs into selenium
> Date: November 13, 2018 at 3:00:56 AM PST
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>
>
> Hi Folks,
>
> I am trying to integrate aXe webdriverjs into existing automation
> framework. However I am hitting road blocks as the documentation
> suggests to use node.js with jasmine.
> As I have no experience with Node.JS.
>
> The current environment I am running is Eclipse and Selenium with
> webdrivers for Chrome and Firefox.
>
> Would like to know the experience of integrating aXe webdriverjs into
> existing automation framework.
>
> Thanks & Regards,
> Mohith B. P.
>
>
>
>
> From: "Birkir R. Gunnarsson" < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] Accessible table where some data spans multiple columns
> Date: November 13, 2018 at 6:43:29 AM PST
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>
>
> Simple data tables do not need headers.
>
> The default behavior of data tables where regular table cells span
> multiple columns however is to associate the first column header with
> that cell (tested with NVDA and Jaws).
> As already pointed out, you can force associating all the headers with
> a cell using the headers attribute (assign a unique id to each header
> and use the headers attribute on the cell to announce them).
> That's probably your best best short of trying to reorganize the whole table.
>
>
>
> On 11/13/18, Philippe Vayssière < = EMAIL ADDRESS REMOVED = > wrote:
>> Hi,
>>
>> headers and cells should be associated via the id and headers attributes
>> mechanism (even better if you can simplify your table and not have
>> colspan and rowspan. If).
>> WCAG Techniques H43 and F90 are relevant here:
>>
>> * H43: Using id and headers attributes to associate data cells with
>> header cells in data tables
>> <https://www.w3.org/WAI/GL/WCAG20-TECHS/H43.html>
>> * F90: Failure of Success Criterion 1.3.1 for incorrectly associating
>> table headers and content via the headers and id attributes <F90:
>> Failure of Success Criterion 1.3.1 for incorrectly associating table
>> headers and content via the headers and id attributes>
>>
>> This bookmarklet by Gez Lemon may help verifying the tedious – and prone
>> to error – work of adding headers:
>> <http://juicystudio.com/article/complextableinspector.php>;
>>
>>
>> Philippe
>>
>> Le 12/11/2018 à 21:24, Jeremy Echols a écrit :
>>> I'm trying to figure out how to make a table read the headers properly
>>> when a data cell spans multiple columns. We have a data table (gist URL
>>> below) where we're describing fines for library resources, and some of the
>>> fines are the same across multiple groups, so naturally we used "colspan"
>>> to make it clear that the information pertains to multiple groups.
>>> Unfortunately, when I tested this out with NVDA, it only read the first
>>> pertinent header for the data. I'm not sure why this is happening, as the
>>> markup looks correct to me.
>>>
>>> Any ideas what's going on? Is this an NVDA bug or am I missing something
>>> obvious?
>>>
>>> Gist URL:
>>> https://gist.github.com/jechols/8e1d447e98c9c40e24e114e80a5c5b7b#file-table-html
>>>
>>
>> >> >> >> >>
>
>
> --
> Work hard. Have fun. Make history.
>
>
>
>
> From: glen walker < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] Accessible table where some data spans multiple columns
> Date: November 13, 2018 at 7:02:42 AM PST
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>
>
> In general, as stated already, the <th scope=row/col> works great for
> associating headers with data cells. The id/header attributes aren't
> normally needed.
>
> And spanned row or column headers also works pretty well. But in your
> case, none of your headers are spanned but rather the data cells are
> spanned. One could argue that maybe the screen reader should figure out
> that a data cell that's spanned has multiple headers, but in the meantime,
> the headers attribute fixes the problem. I tried a quick test with JAWS on
> IE and NVDA on firefox and the following read multiple column headers.
>
> 1. Added an ID to each column header.
> 2. Added a header attribute to two of the data cells (just to test those
> two - I didn't update the entire table). It's only needed for the spanned
> cells.
>
> However, visually, I find the table hard to scan because there is no
> consistent cell shape. I can't read a column header and then scan down to
> find the fee. So while spanned data cells might seem like a good idea in
> this case to convey that all the different headers have the same charge,
> I'm not sure that's conveyed very well.
>
>
> <thead>
> <tr>
> <th scope="col" id="col1">Borrower type/Material type</th>
> <th scope="col" id="col2">Faculty/Staff</th>
> <th scope="col" id="col3">Grad Student or Honors Student</th>
> <th scope="col" id="col4">Undergrad or Community Ed.</th>
> <th scope="col" id="col5">Member, UO Alum Assoc.</th>
> <th scope="col" id="col6">Oregon Card and NCU</th>
> </tr>
> </thead>
>
> ...
> <tr>
> <th scope="row">General Materials</th>
> <td style="text-align: center;">No general fines<br>
> $5/day recall fine (max=$20)</td>
> <td colspan="4" style="text-align: center;" headers="col3 col4 col5
> col5">$0.50/day (max=$20)</td>
> </tr>
> <tr>
> <th scope="row">Summit Loans</th>
> <td style="text-align: center;">$0.50/day (max=$20</td>
> <td colspan="2" style="text-align: center;" headers="col3 col4">$0.50/day
> (max=$20)</td>
> <td style="text-align: center;">NA</td>
> <td style="text-align: center;">NA</td>
> </tr>
>
>
>
>
> From: Jeremy Echols < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] Accessible table where some data spans multiple columns
> Date: November 13, 2018 at 7:25:55 AM PST
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>
>
> Interesting. I knew about associating multiple headers, but didn't know that was necessary just for colspans. I also didn't really see the table as being confusing, but now that you point that out, it does indeed seem a little difficult to navigate.
>
> Thanks for all the info everybody!
>
>

From: Mohith BP
Date: Tue, Nov 13 2018 10:44PM
Subject: Re: Help needed to integrate aXe webdriverjs into selenium
← Previous message | No next message

Hi Marcy Sutton,

Thank you for the response.
Will check out those resources and get connected in Gitter channel.

Thanks & Regards,
Mohith B. P.


On 11/14/18, Marcy Sutton < = EMAIL ADDRESS REMOVED = > wrote:
> Hi Mohith,
>
> The axe-webdriverjs library requires Node.js, as that is how it injects into
> the page. There is an open source axe Selenium Java project you could check
> out: https://github.com/dequelabs/axe-selenium-java
> <https://github.com/dequelabs/axe-selenium-java>
>
> Otherwise, the best place to get help with axe implementations is in our
> Gitter channel: https://gitter.im/dequelabs/axe-core
> <https://gitter.im/dequelabs/axe-core>
>
> Hope that helps!
>
> Marcy Sutton | Developer Advocate | 206-819-8408
> Deque Systems - Accessibility for Good
> deque.com <http://deque.com/>;
>
>> On Nov 13, 2018, at 11:00 AM, = EMAIL ADDRESS REMOVED = wrote:
>>
>> Send WebAIM-Forum mailing list submissions to
>> = EMAIL ADDRESS REMOVED =
>>
>> To subscribe or unsubscribe via the World Wide Web, visit
>> http://list.webaim.org/mailman/listinfo/webaim-forum
>> or, via email, send a message with subject or body 'help' to
>> = EMAIL ADDRESS REMOVED =
>>
>> You can reach the person managing the list at
>> = EMAIL ADDRESS REMOVED =
>>
>> When replying, please edit your Subject line so it is more specific
>> than "Re: Contents of WebAIM-Forum digest..."
>> Today's Topics:
>>
>> 1. Accessible table where some data spans multiple columns
>> (Jeremy Echols)
>> 2. Re: Accessible table where some data spans multiple columns
>> (Philippe Vayssi?re)
>> 3. Fwd: [community] Tenon-UI - a11y-oriented React component
>> library (Brandon Keith Biggs)
>> 4. Help needed to integrate aXe webdriverjs into selenium (Mohith BP)
>> 5. Re: Accessible table where some data spans multiple columns
>> (Birkir R. Gunnarsson)
>> 6. Re: Accessible table where some data spans multiple columns
>> (glen walker)
>> 7. Re: Accessible table where some data spans multiple columns
>> (Jeremy Echols)
>> 8. Re: Accessible table where some data spans multiple columns
>> (glen walker)
>> 9. Re: Accessible dragon drop component? ? some questions
>> (Bryan Garaventa)
>>
>> From: Jeremy Echols < = EMAIL ADDRESS REMOVED = >
>> Subject: [WebAIM] Accessible table where some data spans multiple columns
>> Date: November 12, 2018 at 12:24:07 PM PST
>> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>>
>>
>> I'm trying to figure out how to make a table read the headers properly
>> when a data cell spans multiple columns. We have a data table (gist URL
>> below) where we're describing fines for library resources, and some of the
>> fines are the same across multiple groups, so naturally we used "colspan"
>> to make it clear that the information pertains to multiple groups.
>> Unfortunately, when I tested this out with NVDA, it only read the first
>> pertinent header for the data. I'm not sure why this is happening, as the
>> markup looks correct to me.
>>
>> Any ideas what's going on? Is this an NVDA bug or am I missing something
>> obvious?
>>
>> Gist URL:
>> https://gist.github.com/jechols/8e1d447e98c9c40e24e114e80a5c5b7b#file-table-html
>>
>>
>>
>>
>> From: Philippe Vayssière < = EMAIL ADDRESS REMOVED = >
>> Subject: Re: [WebAIM] Accessible table where some data spans multiple
>> columns
>> Date: November 13, 2018 at 12:45:34 AM PST
>> To: = EMAIL ADDRESS REMOVED =
>>
>>
>> Hi,
>>
>> headers and cells should be associated via the id and headers attributes
>> mechanism (even better if you can simplify your table and not have colspan
>> and rowspan. If).
>> WCAG Techniques H43 and F90 are relevant here:
>>
>> * H43: Using id and headers attributes to associate data cells with header
>> cells in data tables <https://www.w3.org/WAI/GL/WCAG20-TECHS/H43.html>
>> * F90: Failure of Success Criterion 1.3.1 for incorrectly associating
>> table headers and content via the headers and id attributes <F90: Failure
>> of Success Criterion 1.3.1 for incorrectly associating table headers and
>> content via the headers and id attributes>
>>
>> This bookmarklet by Gez Lemon may help verifying the tedious – and prone
>> to error – work of adding headers:
>> <http://juicystudio.com/article/complextableinspector.php>;
>>
>>
>> Philippe
>>
>> Le 12/11/2018 à 21:24, Jeremy Echols a écrit :
>>> I'm trying to figure out how to make a table read the headers properly
>>> when a data cell spans multiple columns. We have a data table (gist URL
>>> below) where we're describing fines for library resources, and some of
>>> the fines are the same across multiple groups, so naturally we used
>>> "colspan" to make it clear that the information pertains to multiple
>>> groups. Unfortunately, when I tested this out with NVDA, it only read
>>> the first pertinent header for the data. I'm not sure why this is
>>> happening, as the markup looks correct to me.
>>>
>>> Any ideas what's going on? Is this an NVDA bug or am I missing something
>>> obvious?
>>>
>>> Gist URL:
>>> https://gist.github.com/jechols/8e1d447e98c9c40e24e114e80a5c5b7b#file-table-html
>>>
>>
>>
>>
>>
>>
>> From: Brandon Keith Biggs < = EMAIL ADDRESS REMOVED = >
>> Subject: [WebAIM] Fwd: [community] Tenon-UI - a11y-oriented React
>> component library
>> Date: November 13, 2018 at 2:28:51 AM PST
>> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>>
>>
>> Hello,
>> Just thought people would like to know about this new accessible framework
>> in React:
>> https://github.com/tenon-io/tenon-ui
>> Thanks,
>>
>> Brandon Keith Biggs <http://brandonkeithbiggs.com/>;
>>
>>
>> ---------- Forwarded message ---------
>> From: Harnum, Alan < = EMAIL ADDRESS REMOVED = >
>> Date: Mon, Nov 12, 2018 at 2:10 PM
>> Subject: [community] Tenon-UI - a11y-oriented React component library
>> To: = EMAIL ADDRESS REMOVED =
>> < = EMAIL ADDRESS REMOVED = >
>>
>>
>> Released in 1.0 as of today:
>>
>> Docs: https://tenon-ui.info/
>> GitHub repo: https://github.com/tenon-io/tenon-ui
>>
>> Released by the development team behind the https://tenon.io/
>> accessibility
>> testing tool.
>>
>> I haven't seriously used React in a few years but I know the mindshare and
>> adoption of it is, shall we say, significant in the web development world,
>> so this looks like an important effort.
>>
>> ALAN HARNUM
>> SENIOR INCLUSIVE DEVELOPER
>> INCLUSIVE DESIGN RESEARCH CENTRE, OCAD UNIVERSITY
>>
>> E = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
>> OCAD UNIVERSITY
>> 100 McCaul Street, Toronto, Canada, M5T 1W1
>> www.ocadu.ca<;http://ocadu.ca/>;
>>
>> >> Inclusive Design Community ( = EMAIL ADDRESS REMOVED = )
>> >> https://lists.idrc.ocadu.ca/mailman/listinfo/community
>>
>>
>>
>>
>> From: Mohith BP < = EMAIL ADDRESS REMOVED = >
>> Subject: [WebAIM] Help needed to integrate aXe webdriverjs into selenium
>> Date: November 13, 2018 at 3:00:56 AM PST
>> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>>
>>
>> Hi Folks,
>>
>> I am trying to integrate aXe webdriverjs into existing automation
>> framework. However I am hitting road blocks as the documentation
>> suggests to use node.js with jasmine.
>> As I have no experience with Node.JS.
>>
>> The current environment I am running is Eclipse and Selenium with
>> webdrivers for Chrome and Firefox.
>>
>> Would like to know the experience of integrating aXe webdriverjs into
>> existing automation framework.
>>
>> Thanks & Regards,
>> Mohith B. P.
>>
>>
>>
>>
>> From: "Birkir R. Gunnarsson" < = EMAIL ADDRESS REMOVED = >
>> Subject: Re: [WebAIM] Accessible table where some data spans multiple
>> columns
>> Date: November 13, 2018 at 6:43:29 AM PST
>> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>>
>>
>> Simple data tables do not need headers.
>>
>> The default behavior of data tables where regular table cells span
>> multiple columns however is to associate the first column header with
>> that cell (tested with NVDA and Jaws).
>> As already pointed out, you can force associating all the headers with
>> a cell using the headers attribute (assign a unique id to each header
>> and use the headers attribute on the cell to announce them).
>> That's probably your best best short of trying to reorganize the whole
>> table.
>>
>>
>>
>> On 11/13/18, Philippe Vayssière < = EMAIL ADDRESS REMOVED = > wrote:
>>> Hi,
>>>
>>> headers and cells should be associated via the id and headers attributes
>>> mechanism (even better if you can simplify your table and not have
>>> colspan and rowspan. If).
>>> WCAG Techniques H43 and F90 are relevant here:
>>>
>>> * H43: Using id and headers attributes to associate data cells with
>>> header cells in data tables
>>> <https://www.w3.org/WAI/GL/WCAG20-TECHS/H43.html>
>>> * F90: Failure of Success Criterion 1.3.1 for incorrectly associating
>>> table headers and content via the headers and id attributes <F90:
>>> Failure of Success Criterion 1.3.1 for incorrectly associating table
>>> headers and content via the headers and id attributes>
>>>
>>> This bookmarklet by Gez Lemon may help verifying the tedious – and prone
>>> to error – work of adding headers:
>>> <http://juicystudio.com/article/complextableinspector.php>;
>>>
>>>
>>> Philippe
>>>
>>> Le 12/11/2018 à 21:24, Jeremy Echols a écrit :
>>>> I'm trying to figure out how to make a table read the headers properly
>>>> when a data cell spans multiple columns. We have a data table (gist URL
>>>> below) where we're describing fines for library resources, and some of
>>>> the
>>>> fines are the same across multiple groups, so naturally we used
>>>> "colspan"
>>>> to make it clear that the information pertains to multiple groups.
>>>> Unfortunately, when I tested this out with NVDA, it only read the first
>>>> pertinent header for the data. I'm not sure why this is happening, as
>>>> the
>>>> markup looks correct to me.
>>>>
>>>> Any ideas what's going on? Is this an NVDA bug or am I missing
>>>> something
>>>> obvious?
>>>>
>>>> Gist URL:
>>>> https://gist.github.com/jechols/8e1d447e98c9c40e24e114e80a5c5b7b#file-table-html
>>>>
>>>
>>> >>> >>> >>> >>>
>>
>>
>> --
>> Work hard. Have fun. Make history.
>>
>>
>>
>>
>> From: glen walker < = EMAIL ADDRESS REMOVED = >
>> Subject: Re: [WebAIM] Accessible table where some data spans multiple
>> columns
>> Date: November 13, 2018 at 7:02:42 AM PST
>> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>>
>>
>> In general, as stated already, the <th scope=row/col> works great for
>> associating headers with data cells. The id/header attributes aren't
>> normally needed.
>>
>> And spanned row or column headers also works pretty well. But in your
>> case, none of your headers are spanned but rather the data cells are
>> spanned. One could argue that maybe the screen reader should figure out
>> that a data cell that's spanned has multiple headers, but in the meantime,
>> the headers attribute fixes the problem. I tried a quick test with JAWS
>> on
>> IE and NVDA on firefox and the following read multiple column headers.
>>
>> 1. Added an ID to each column header.
>> 2. Added a header attribute to two of the data cells (just to test those
>> two - I didn't update the entire table). It's only needed for the spanned
>> cells.
>>
>> However, visually, I find the table hard to scan because there is no
>> consistent cell shape. I can't read a column header and then scan down to
>> find the fee. So while spanned data cells might seem like a good idea in
>> this case to convey that all the different headers have the same charge,
>> I'm not sure that's conveyed very well.
>>
>>
>> <thead>
>> <tr>
>> <th scope="col" id="col1">Borrower type/Material type</th>
>> <th scope="col" id="col2">Faculty/Staff</th>
>> <th scope="col" id="col3">Grad Student or Honors Student</th>
>> <th scope="col" id="col4">Undergrad or Community Ed.</th>
>> <th scope="col" id="col5">Member, UO Alum Assoc.</th>
>> <th scope="col" id="col6">Oregon Card and NCU</th>
>> </tr>
>> </thead>
>>
>> ...
>> <tr>
>> <th scope="row">General Materials</th>
>> <td style="text-align: center;">No general fines<br>
>> $5/day recall fine (max=$20)</td>
>> <td colspan="4" style="text-align: center;" headers="col3 col4 col5
>> col5">$0.50/day (max=$20)</td>
>> </tr>
>> <tr>
>> <th scope="row">Summit Loans</th>
>> <td style="text-align: center;">$0.50/day (max=$20</td>
>> <td colspan="2" style="text-align: center;" headers="col3
>> col4">$0.50/day
>> (max=$20)</td>
>> <td style="text-align: center;">NA</td>
>> <td style="text-align: center;">NA</td>
>> </tr>
>>
>>
>>
>>
>> From: Jeremy Echols < = EMAIL ADDRESS REMOVED = >
>> Subject: Re: [WebAIM] Accessible table where some data spans multiple
>> columns
>> Date: November 13, 2018 at 7:25:55 AM PST
>> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>>
>>
>> Interesting. I knew about associating multiple headers, but didn't know
>> that was necessary just for colspans. I also didn't really see the table
>> as being confusing, but now that you point that out, it does indeed seem a
>> little difficult to navigate.
>>
>> Thanks for all the info everybody!
>>
>>