Wikipedia talk:Manual of Style/Accessibility/Data tables tutorial: Difference between revisions

Revision as of 22:24, 20 March 2022

Latest revision as of 18:46, 8 October 2024

(41 intermediate revisions by 14 users not shown)

Line 1:

{{skip to talk}}

{{page views}}

{{talk header}}

{{WikiProject banner shell|

{{WikiProject Accessibility}}

}}

{{talk header|archive_age=250|archive_bot=Lowercase sigmabot III}}

{{User:MiszaBot/config

| algo = old(250d)

Line 12 ⟶ 15:

}}

== MOS:COLHEAD potential workaround? ==

== Table values as manual separators (List of countries by median age#By population division) ==

<small>See updated link below</small>

At [[List of countries by median age#By population division]] table values are used as manual separators. What is the best way to fix this? A separate table for each? --[[User:Emir of Wikipedia|Emir of Wikipedia]] ([[User talk:Emir of Wikipedia|talk]]) 17:20, 7 March 2021 (UTC) {{pme}}

: {{reply to|Emir of Wikipedia}} I actually think that usage is not too bad. From your description here, I pictured some colspanned rows like the dividers [[Bad (tour)#Tour dates|here]]. But the table you're pointing at has rows which include data in all columns, and aren't so much dividers (especially after sorting by Region, say, or "1970") as they are just aggregations of other (groups of) rows. I'd prefer to see the table right-aligned (except for the Type column), the headers need <code>scope</code> attributes, and the caption needs its caps corrected, but otherwise, the table seems nicely accessible to me. Even the presence of the Type column means that the colors aren't the only indicator of aggregate rows. I wouldn't separate anything. <i>&mdash;&nbsp;[[User:JohnFromPinckney|JohnFromPinckney]] ([[User talk:JohnFromPinckney|talk]])</i> 00:17, 8 March 2021 (UTC)

:: If other people think it alright then it might be fine, just looked like a very strange way to do a table to me. [[User:Emir of Wikipedia|Emir of Wikipedia]] ([[User talk:Emir of Wikipedia|talk]]) 15:20, 20 March 2021 (UTC)

:::Two things:

:::#I have changed the section heading pointed to above, as it turns out "population division" is an office or team or department of the UN, ''not'' a different way of organizing the data. '''The new target for the discussion here is [[List of countries by median age#UN figures]].'''

:::#I'm no longer so sure I like that table. It's copied pretty much directly from the UN's Excel file, where those dividers and aggregates seem to make more sense. I'll have to think about this some more, but (or even: ''therefore'') if anybody else has some input I'd be keen to hear/see it.

:::Warm regards, <i>&mdash;&nbsp;[[User:JohnFromPinckney|JohnFromPinckney]] ([[User talk:JohnFromPinckney|talk]])</i> 06:27, 23 March 2021 (UTC)

::::Thanks for taking more time to consider this. Looks like it was more complicated than I thought. [[User:Emir of Wikipedia|Emir of Wikipedia]] ([[User talk:Emir of Wikipedia|talk]]) 15:48, 27 March 2021 (UTC)

== Wrong for 11 years ==

This advice guide has been wrong since it was created in 2010 by {{u|Dodoïste}}. Dodoïste wrote the following:[https://en.wikipedia.org/w/index.php?title=Wikipedia:Manual_of_Style/Accessibility/Data_tables_tutorial&oldid=383609766]

{{blockquote|1=A data table needs a table caption that roughly describes what the the table is about. It is to a table what a section header is to a paragraph.}}

Dodoïste referred to an online style guide at [https://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/H39 W3.org titled H39: Using caption elements to associate data table captions with data tables.] The W3 guide is concerned that a table may shift around in an HTML setting, and they are making sure that your table doesn't lose its context. The only accessibility concern was that the table might slip out from under the parts that give it context.

Here on Wikipedia, the context is almost always very clear. A table is always in an article with a unique title. The table is almost always in a section which has a section heading. So right there we have all the proper context; we do not have to repeat this information. For instance, the Vital Level-3 Featured Article [[Logarithm]] has a table listing four base counting methods. The table is in a section titled [[Logarithm#Particular bases|Particular bases]]. This is enough context for the reader to know that the table is about logarithm bases—we don't need a table caption repeating that information.

This guideline should make it clear that a "caption" for a table (really we are talking about a table header, not a caption) is an {{em|option}} for any time that the table context is unclear, for whatever reason. We should not be saying that it is required for accessibility. [[User:Binksternet|Binksternet]] ([[User talk:Binksternet|talk]]) 17:47, 18 September 2021 (UTC)

:{{replyto|Binksternet}} Yes, but the problem is that screen readers identify tables by captions and sometimes determine whether a table is worth alerting a user to by the presence or absence of a caption. See [[Wikipedia talk:Manual of Style/Accessibility/Archive 15#RfC on table captions]]. TFor cases where it's highly undesirable for a sighted user to see the caption there's {{tl|Screen reader-only}}. '''[[User:Graham87|Graham]]'''[[User talk:Graham87|<span style="color: green;">87</span>]] 07:10, 19 September 2021 (UTC)

== Avoiding column headers in the middle of the table - outdated and incorrect ==

The section on [https://en.wikipedia.org/wiki/Wikipedia:Manual_of_Style/Accessibility/Data_tables_tutorial#Avoiding_column_headers_in_the_middle_of_the_table Avoiding column headers in the middle of the table] is outdated and has been for 10 years. I recall having a discussion on this 10 years ago when were were designing tables at Tennis project and asking those with screen readers to tell us if there were any issues. There were none. We did follow not putting in ! to start rows in the middle of tables and used | instead, but modern screen readers flew through both. A few years back we were also told that using the "scope" command makes using ! perfectly fine. Perhaps when this passage was written for wikipedia there were still those with Commodore 64s or Amigas with old archaic screen readers, but it's 2021 now and screen readers have no issues with it.

Do we need an rfc on changing this outdated advise? Multiple tables often look messier or adding an extra column turns into a bunch of redundant words, where a simple new row statement can take care of thing with a snap. If it looks better, and today's screen readers have no issues at all, then having statements such as "Assistive technologies will get confused as they cannot know which previous headers still apply to parts of the table after the first one," are false and a disservice to our readers. The whole section is not true (or perhaps I should word that as no longer true) and should be scrapped or reworded. [[User:Fyunck(click)|Fyunck(click)]] ([[User talk:Fyunck(click)|talk]]) 19:32, 22 September 2021 (UTC)

:Please link to these discussions; I've tried to search for them. I did however find [[Wikipedia talk:WikiProject Tennis/Archive 18#Template:Tennis performance timeline|this discussion at the WikiProject's talk page]], [[User talk:Graham87/Archive 40#Roger Federer chart|this thread on my talk page]], and [[Wikipedia talk:WikiProject Tennis/Article guidelines/Archive 1#Players' performance timeline tables|this thread on the WikiProject Tennis guidelines talk page]]. I don't know if a full RFC would be necessary but a notification on the main accessibility talk page would probably be helpful, since this section has an attached shortcut and all. For what it's worth the bad example in the tutorial is still problematic here with [[JAWS (screen reader)|JAWS]]. '''[[User:Graham87|Graham]]'''[[User talk:Graham87|<span style="color: green;">87</span>]] 06:37, 23 September 2021 (UTC)

::I can't speak for tables that use ! without using the scope command, since we tried to remove those from tennis project guidelines upon request. But here's what's interesting. Years ago, In our designing the table [https://en.wikipedia.org/wiki/Wikipedia:WikiProject_Tennis/Article_guidelines#Full_timeline used in every tennis article] we had readers that use JAWS climb up and down and sideways. I think you might have been one of the editors that helped us. There was another popular screen reader at the time whose name eludes me. We talked with accessibility over and over, and no issues were found. We had checked and doubled checked it. It uses the same principle but avoids using the ! to signify an actual header change. The bad examples on this article all use ! for headers in the middle of tables. If that's what it's trying to convey it should be more specific not to use !. And if an old screen reader has trouble using ! in the middle of a table, then why can we use ! with the scope command in the middle of a table [https://en.wikipedia.org/wiki/Wikipedia:Manual_of_Style/Accessibility/Data_tables_tutorial#Caption like we do in the good example?]. That should cause the same issues.

::This came to the surface because someone said a screen reader [https://en.wikipedia.org/wiki/Talk:List_of_Grand_Slam_men%27s_singles_champions#Version_0_break might have trouble with this example here.] [[User:Fyunck(click)|Fyunck(click)]] ([[User talk:Fyunck(click)|talk]]) 07:27, 23 September 2021 (UTC)

== Row headers when table contains only two columns ==

This issue has bugged me for ages and I'd like some guidance, although I confess I'm not at all familiar with some of the terminology involved in table creation.

On a few album articles, I've seen editors reformatting a charts table so that, where previously the two columns (national chart/compiler; peak position) both appeared in what I'd describe as a shade of light grey or off-white, now the left-hand column is rendered with a dark grey background, just like the column headers. In my opinion, this treatment looks over the top and something of an eyesore, because – since the chart names take up far more width than a one-, two- or three-digit chart position – the vast majority of the table becomes a mass of heavy, dark grey.

As an example, the [[Rubber Soul]] article looked [https://en.wikipedia.org/w/index.php?title=Rubber_Soul&oldid=1046980802#Charts like this] until recently; it now looks [https://en.wikipedia.org/w/index.php?title=Rubber_Soul&oldid=1048879685#Charts like this]. I think the first example is perfectly clear and easy on the eye. Also, it's not as if tables such as reviewer ratings boxes get the same heavy treatment, eg at [https://en.wikipedia.org/w/index.php?title=Rubber_Soul&oldid=1046980802#Retrospective_assessment Rubber Soul again]. And I see tables where there are several more rows (in which case, you'd think the row header aspect was far more important) but all are set with the lighter, off-white background: eg [https://en.wikipedia.org/wiki/2016_Summer_Olympics_medal_table#Medal_table 2016 Olympics medal table], [https://en.wikipedia.org/wiki/2012_Summer_Olympics#Bidding_process 2012 Olympics host city election]. (In addition, I've come across pages like [[Help:Sorting]] where [https://en.wikipedia.org/wiki/Help:Sorting#Example none of the examples] have this treatment either.)

So my question is, is it possible/permissible to still set these two-column charts tables without the heavy background? I guess it's an issue to do with "plainrowheaders"(?), the term used by an editor to explain a [https://en.wikipedia.org/w/index.php?title=All_Things_Must_Pass&diff=1038588755&oldid=1038586559 similar change in another album article]. They cited [[MOS:ACCESS]], although I have to say I couldn't find any reference to plainrowheaders on that MOS page – which is why I've ended up here, in fact. Thanks, [[User:JG66|JG66]] ([[User talk:JG66|talk]]) 01:57, 10 October 2021 (UTC)

:A big problem is that blind people using screen readers can't really know just how annoying a grey background is. They can't see it.

:Also, another problem is that some editors, especially some of those that camp out on this talk page, are trying to put scope tags on all header and column rows, even though almost no other websites do. Because other websites look at the actual [[Web Content Accessibility Guidelines]] at the source, and not as they are interpreted by some people on Wikipedia. --[[User:Timeshifter|'''Timeshifter''']] ([[User talk:Timeshifter|talk]]) 02:48, 10 October 2021 (UTC)

::Thank you for the speedy reply but ... um, I don't know if your opening paragraph is a dig at my complaint or ...? Sorry, could just be the way I'm reading it. I'm an optimist – I'll take it that it isn't a dig(!)

::I fully appreciate the importance of accessibility to all. So I suppose the question is whether ensuring the best access for screen readers (via "wikitable sortable", "plainrowheaders"?) necessarily has to dictate how that process or code is visually rendered in a table. As mentioned, this approach hardly seems consistent – eg, how are screen readers coping with the two-column reviewer ratings box?

::Again, I emphasise that I'm completely ignorant about table formatting. I'm sure that tests the patience of regulars here, but I would like to get to the bottom of it if possible. [[MOS:CHARTS]] says "The chart positions should be organized into one table, and the table should be formatted using <code>class="wikitable sortable"</code>." Well, that was already in place before the recent changes at one or two album articles I watch; it seems to have been the introduction of these plainrowheaders that creates the darker grey background. [[User:JG66|JG66]] ([[User talk:JG66|talk]]) 03:25, 10 October 2021 (UTC)

Can [[MOS:COLHEAD]] violation in [[Iga Świątek career statistics#Performance timelines|this case]] be worked around by adding "id=colX is empty. In row13 you can found...." or a hidden comment with a similar message to indicate to screen readers that more content can be found in the next row instead of rearranging the rows? [[User:Qwerty284651|Qwerty284651]] ([[User talk:Qwerty284651|talk]]) 23:55, 2 June 2024 (UTC)

:::{{u|JG66}}. No dig intended. I deleted my first answer. Here is my second answer. See:

:::'''[https://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/H63.html H63: Using the scope attribute to associate header cells and data cells in data tables | Techniques for WCAG 2.0].''' It says:

:::"Note: For simple tables that have the headers in the first row or column then it is sufficient to simply use the TH elements without scope."

:::See: '''[https://www.w3.org/WAI/tutorials/tables Tables Concepts &bull; Tables &bull; WAI Web Accessibility Tutorials].''' It says:

:::"Tables with one header for rows or columns: For tables with content that is easy to distinguish, mark up header cells with <nowiki><th></nowiki> and data cells with <nowiki><td></nowiki> elements."

:::But when you go to the fine print it says "For tables with unclear header directions, define the direction of each header by setting the scope attribute to col or row."

:::I think most tables on Wikipedia do not have unclear header directions. The column headers are on the top. The row headers are on the left.

:::'''[https://www.w3.org/TR/WCAG20-TECHS/H51.html H51: Using table markup to present tabular information | Techniques for WCAG 2.0].''' "Simple tables generally have only one level of headers for columns and/or one level of headers on the rows." Example 1 is definitive as far as I am concerned. There is no requirement for scopes on such simple tables.

:::I did some tests awhile back that confirmed this:

:::[[Wikipedia talk:Manual of Style/Accessibility/Data tables tutorial#Comparing tables with and without scope=col and scope=row]]. Please ignore the heated tone of some of the discussion. I apologize for my part in the heated tone.

:::Getting to your questions. I don't see the need for designating row headers in the 2 column table examples you gave. Screen readers will read the column header for each data cell. It will be obvious to the user what the relationship is between the the 2 cells in each row, even without row headers. And scopes are total overkill in that example.

:::--[[User:Timeshifter|'''Timeshifter''']] ([[User talk:Timeshifter|talk]]) 10:41, 10 December 2021 (UTC)

:That whole table is messed up so trying to workaround one bad part of it, won't really "fix" it. Look at the "Career statistics" section, 5 of the 9 rows have cell content unrelated to the column headers. Separate the tables, make better column headers, remove bad usage of bold. Not everything needs to be in one giant table. [[User:Gonnym|Gonnym]] ([[User talk:Gonnym|talk]]) 06:30, 3 June 2024 (UTC)

::::Thanks, {{u|Timeshifter}}. You've given me a fair bit of homework, and I can't promise I'll jump on it immediately ... As I've said, I'm hopeless with table terminology ("scope"?).

::@[[User:Gonnym|Gonnym]], I proposed an [[Wikipedia talk:WikiProject Tennis#Performance timeline|improved version]] (pinging those involved in creating the new design {{ping|Fyunck(click)|Unnamelessness}}) which passes MOS:COLHEAD in my project's community, but people are used to one design, prevalent in 100s of tennis BLPs. The new look meets accessibility criteria [[WCAG]] for screen reader users but offsets the sighted who are used to the old design...a balancing act.

::::I'm all for ensuring good accessibility for screen readers, but I'm confused as to why a simple, two-column table has to be rendered in the current way. And/or: why it is that the screen-reader-friendly input needs to even register visually when one reads the page "normally". (Why do we need to ''see'' what that software handles differently?) As I've said, my concern is with the two-column tables for record charts. Not only is it so simple in presentation that one questions whether info in the left-hand column really is a row header, but the table ends up such an eyesore, because the darkened-out LH column is usually far wider than the RH column, which contains just a single or double digit.

::::Anyway,Maybe don't feelremove the needrows toand replyreplace tothem that.with I{{tlx|notes}} obviouslyor need to do some reading.{{tlx|efn}}? [[User:JG66Qwerty284651|JG66Qwerty284651]] ([[User talk:JG66Qwerty284651|talk]]) 1516:5742, 103 DecemberJune 20212024 (UTC)

:::Yeah, not surprised. There are some places I'll never touch just because I don't want to deal with that type of editors. [[User:Gonnym|Gonnym]] ([[User talk:Gonnym|talk]]) 16:48, 3 June 2024 (UTC)

:::::{{u|JG66}}. I agree. I don't see the need for the gray background of the row headers. Or the bold font. It is obvious what are row headers in most tables when the row headers are on the left side of the table. And screen readers only need the scopes or <nowiki><th></nowiki>.

::::@[[User:Gonnym|Gonnym]], I get you. I am going to make a push in favor of the visually impaired. Hopefully, it sticks. The minority needs to be tended to as well not just the ones blessed with the gift to see. [[User:Qwerty284651|Qwerty284651]] ([[User talk:Qwerty284651|talk]]) 16:54, 3 June 2024 (UTC)

:::::I think a gray background with black text is not enough contrast. Especially when the gray is too dark as in Wikipedia tables. And I keep my monitor brightness turned down. As recommended by many eye doctors. That makes the contrast even less.

::That is something I originally proposed, but you know, some kinds of compromise have to take as this is Wikipedia. :) [[User:Unnamelessness|Unnamelessness]] ([[User talk:Unnamelessness|talk]]) 06:08, 4 June 2024 (UTC)

:::::It is annoying. So it would be nice to have truly plain row headers with a white background and a regular (non-bold) font. Then people would be more likely to add scopes for row headers. At least for more complex tables. Scopes are not needed on simple tables. --[[User:Timeshifter|'''Timeshifter''']] ([[User talk:Timeshifter|talk]]) 02:25, 11 December 2021 (UTC)

:::I know. It is the bitter sweet truth. You can't please everybody. [[User:Qwerty284651|Qwerty284651]] ([[User talk:Qwerty284651|talk]]) 10:21, 4 June 2024 (UTC)

== RowgroupsCells andon plainrowheadersmultiple rows ==

Hi, are the cells spanned on multiple rows accessible? E.g., [[DC Extended Universe#Films]]: the correct way is to split the "Zack Snyder" cell into two cells with the same date or are they just fine as they are? [[User:Redjedi23|Redjedi23]] ([[User talk:Redjedi23|talk]]) 14:43, 21 June 2024 (UTC)

Hi, currently in the `Complex tables` section (but not in any section previous), it is recommended to use scope=rowgroup for row headers that are part of a rowspan. I was going to add this to my accessibility reviews at [[WP:FLC]], but quickly found out that the 'plainrowheaders' table class doesn't seem to affect scope=rowgroup cells, only scope=row. Is this a known issue? For example:

:I state that because if I try to read the ''Batman v Superman'' row, the Apple VoiceOver skips the director's name [[User:Redjedi23|Redjedi23]] ([[User talk:Redjedi23|talk]]) 15:41, 21 June 2024 (UTC)

::They're fine as they are. VoiceOver isn't that good with this kind of thing. [[User:Graham87|Graham87]] ([[User talk:Graham87|talk]]) 15:51, 21 June 2024 (UTC)

:::@[[User:Graham87|Graham87]] I get the same result with NVDA [[User:Redjedi23|Redjedi23]] ([[User talk:Redjedi23|talk]]) 16:01, 21 June 2024 (UTC)

::::{{replyto|Redjedi23}} Same, but also those sorts of tables aren't meant to be read linearly ... they're supposed to be read with table navigation commands (control+alt+arrows in NVDA's case), which works as expected. [[User:Graham87|Graham87]] ([[User talk:Graham87|talk]]) 17:39, 21 June 2024 (UTC)

:::::But in this way the header column loses its meaning, right? [[User:Redjedi23|Redjedi23]] ([[User talk:Redjedi23|talk]]) 18:01, 21 June 2024 (UTC)

::::::Not really. Screen reader users will just get used to having a blank cell (with information hopefully about the row spans) and things will be fine. [[User:Graham87|Graham87]] ([[User talk:Graham87|talk]]) 18:16, 21 June 2024 (UTC)

==Colgroups and rowgroups==

{| class="wikitable sortable plainrowheaders"

In [[Wikipedia:Manual of Style/Accessibility/Data tables tutorial#Complex tables]] it says "To clearly define relationships and avoid accessibility issues, use <code>! scope="colgroup" colspan="2" | </code> when a column header spans two columns and <code>! scope="rowgroup" rowspan="2" | </code> when a row header spans two rows..." Can a combination of those be used when a column spans multiple rows <code>scope="rowgroup" colspan="2"</code> and when a row spans multiple columns <code>scope="colgroup" rowspan="2"</code> in complex tables? [[User:Qwerty284651|Qwerty284651]] ([[User talk:Qwerty284651|talk]]) 12:00, 13 August 2024 (UTC)

|+{{sronly|Awards and nominations received by Anne Hathaway}}

|-

! scope="col" | Organizations

! scope="col" | Year

! scope="col" | Recipient(s)

! scope="col" | Category

! scope="col" | Result

|-

!scope="rowgroup" rowspan="2"| [[Academy Awards]] {{anchor|A}}

| [[81st Academy Awards|2009]]

| ''[[Rachel Getting Married]]''

| [[Academy Award for Best Actress|Best Actress]]

| {{nom}}

|-

| [[85th Academy Awards|2013]]

| ''[[Les Misérables (2012 film)|Les Misérables]]''

| [[Academy Award for Best Supporting Actress|Best Supporting Actress]]

| {{won}}

|-

!scope="row"| [[Alliance of Women Film Journalists]]

| 2009

| ''[[Rachel Getting Married]]''

|Best Ensemble Cast

| {{won}}

|}

== Better describe the problem of missing captions for screen reader users (SRUs)? ==

plainrowheaders is affecting the second non-spanned row but not the first, spanned row. --'''[[User:PresN|<span style="color:green">Pres</span>]][[User talk:PresN|<span style="color:blue">N</span>]]''' 15:10, 20 March 2022 (UTC)

Do we need to expand on the issue of missing captions? I ask because '''so many data tables do not have a caption''', suggesting that editors are unaware of the problems caused where one is missing. For example, a SRU can call up a list of tables on a page, each labelled by their caption. Where the caption is missing, the table is announced along the lines of "6 columns, 20 rows" by [[VoiceOver]]. I suspect that other software says something similar. Unless the user is a mind-reader (!), this is no good at all. What do others think? What can we do? I do not want to spend my whole editing career adding captions to existing tables! [[User:CrazyBuilder|<span style="color: #db0000">Crazy</span><span style="color: #3c78b4">Builder</span>]] [[User talk:CrazyBuilder|talk]] 20:08, 7 October 2024 (UTC)

:{{re|PresN}} I created an issue for it here: [[MediaWiki talk:Common.css#Plainrowheaders row and rowgroup scopes]]. [[User:Jroberson108|Jroberson108]] ([[User talk:Jroberson108|talk]]) 21:25, 20 March 2022 (UTC)

::{{re|Jroberson108}} Thanks! --'''[[User:PresN|<span style="color:green">Pres</span>]][[User talk:PresN|<span style="color:blue">N</span>]]''' 22:24, 20 March 2022 (UTC)