Wikipedia

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

Browse history interactively
← Previous edit
Content deleted Content added
VisualWikitext
Dodoïste (talk | contribs)
3,461 edits
 
(336 intermediate revisions by 47 users not shown)
Line 1:
{{skip to talk}}
== Unbulleted lists ==
{{page views}}
At the risk of increasing the number of templates in an article, there is a space-saving template called {{tl|Unbulleted list}} which might be useful when tables become wide. It produces the correct semantic markup for a list, which is exactly what is needed when a data cell contains a lower hierarchy of data (in this case a list). Here's an example:
{{talk header}}
{{WikiProject banner shell|
{{WikiProject Accessibility}}
}}
{{User:MiszaBot/config
| algo = old(250d)
| archive = Wikipedia talk:Manual of Style/Accessibility/Data tables tutorial/Archive %(counter)d
| counter = 2
| maxarchivesize = 150K
| archiveheader = {{Automatic archive navigator}}
| minthreadstoarchive = 1
| minthreadsleft = 4
}}
 
== MOS:COLHEAD potential workaround? ==
{|class="wikitable" border="1"
|+ List of albums
! scope="col" rowspan="2" width="100"| Title
! scope="col" rowspan="2" width="215"| Album details
! scope="col" colspan="10"| Peak chart positions
! scope="col" rowspan="2" width="145"| Sales
! scope="col" rowspan="2" width="125"| [[List of music recording certifications|Certifications]]
|-
! scope="col" style="width:2em;font-size:75%"| [[Billboard 200|US]]
! scope="col" style="width:2em;font-size:75%"| [[ARIA Charts|AUS]]
! scope="col" style="width:2em;font-size:75%"| [[Austria|AUT]]
! scope="col" style="width:2em;font-size:75%"| [[Finland|FIN]]
! scope="col" style="width:2em;font-size:75%"| [[Netherlands|NLD]]
! scope="col" style="width:2em;font-size:75%"| [[New Zealand|NZ]]
! scope="col" style="width:2em;font-size:75%"| [[Norway|NOR]]
! scope="col" style="width:2em;font-size:75%"| [[Sweden|SWE]]
! scope="col" style="width:2em;font-size:75%"| [[Switzerland|SWI]]
! scope="col" style="width:2em;font-size:75%"| [[UK Albums Chart|UK]]
|-
! scope="row" | ''[[Bleach (album)|Bleach]]''
|
*Released: June 15, 1989
*Label: [[Sub Pop]] <small>(SP #34)</small>
*Format: [[Compact disc|CD]], [[Compact cassette|cassette]], [[LP album|LP]]
|align="center"| 89
|align="center"| 34
|align="center"| 26
|align="center"| 24
|align="center"| —
|align="center"| 30
|align="center"| —
|align="center"| —
|align="center"| —
|align="center"| 33
| {{nowrap|1.7 million (US)}}
| {{nowrap|Platinum (US)}}
|-
! scope="row" | ''[[Nevermind]]''
|
*Released: September 24, 1991
*Label: [[DGC Records|DGC]] <small>(DGC #24425)</small>
*Format: CD, CS, LP
|align="center"| 1
|align="center"| 2
|align="center"| 2
|align="center"| 1
|align="center"| 5
|align="center"| 2
|align="center"| 2
|align="center"| 1
|align="center"| 2
|align="center"| 7
| {{nowrap|10 million(US)}}<br>{{nowrap|26 million (worldwide)}}
| {{nowrap|Diamond (US)}}<br />{{nowrap|2× Platinum (UK)}}
|}
 
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)
would become:
 
: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)
{|class="wikitable" border="1"
::@[[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.
|+ List of albums
::Maybe remove the rows and replace them with {{tlx|notes}} or {{tlx|efn}}? [[User:Qwerty284651|Qwerty284651]] ([[User talk:Qwerty284651|talk]]) 16:42, 3 June 2024 (UTC)
! scope="col" rowspan="2" | Title
:::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)
! scope="col" rowspan="2" | Album details
::::@[[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)
! scope="col" colspan="10"| Peak chart positions
::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)
! scope="col" rowspan="2" | Sales
:::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)
! scope="col" rowspan="2" | [[List of music recording certifications|Certifications]]
 
|-
== Cells on multiple rows ==
! scope="col" style="width:2em;font-size:75%"| [[Billboard 200|US]]
 
! scope="col" style="width:2em;font-size:75%"| [[ARIA Charts|AUS]]
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)
! scope="col" style="width:2em;font-size:75%"| [[Austria|AUT]]
: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)
! scope="col" style="width:2em;font-size:75%"| [[Finland|FIN]]
::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)
! scope="col" style="width:2em;font-size:75%"| [[Netherlands|NLD]]
:::@[[User:Graham87|Graham87]] I get the same result with NVDA [[User:Redjedi23|Redjedi23]] ([[User talk:Redjedi23|talk]]) 16:01, 21 June 2024 (UTC)
! scope="col" style="width:2em;font-size:75%"| [[New Zealand|NZ]]
::::{{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)
! scope="col" style="width:2em;font-size:75%"| [[Norway|NOR]]
:::::But in this way the header column loses its meaning, right? [[User:Redjedi23|Redjedi23]] ([[User talk:Redjedi23|talk]]) 18:01, 21 June 2024 (UTC)
! scope="col" style="width:2em;font-size:75%"| [[Sweden|SWE]]
::::::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)
! scope="col" style="width:2em;font-size:75%"| [[Switzerland|SWI]]
! scope="col" style="width:2em;font-size:75%"| [[UK Albums Chart|UK]]
|-
! scope="row" | ''[[Bleach (album)|Bleach]]''
|{{Unbulleted list
|Released: June 15, 1989
|Label: [[Sub Pop]] <small>(SP #34)</small>
|Format: [[Compact disc|CD]], [[Compact cassette|cassette]], [[LP album|LP]]
}}
|style="text-align:center"| 89
|style="text-align:center"| 34
|style="text-align:center"| 26
|style="text-align:center"| 24
|style="text-align:center"| —
|style="text-align:center"| 30
|style="text-align:center"| —
|style="text-align:center"| —
|style="text-align:center"| —
|style="text-align:center"| 33
| {{nowrap|1.7 million (US)}}
| {{nowrap|Platinum (US)}}
|-
! scope="row" | ''[[Nevermind]]''
| {{Unbulleted list
|Released: September 24, 1991
|Label: [[DGC Records|DGC]] <small>(DGC #24425)</small>
|Format: CD, CS, LP
}}
|style="text-align:center"| 1
|style="text-align:center"| 2
|style="text-align:center"| 2
|style="text-align:center"| 1
|style="text-align:center"| 5
|style="text-align:center"| 2
|style="text-align:center"| 2
|style="text-align:center"| 1
|style="text-align:center"| 2
|style="text-align:center"| 7
| {{Unbulleted list
|{{nowrap|10 million (US)}}
|{{nowrap|26 million (worldwide)}}
}}
| {{Unbulleted list
|{{nowrap|Diamond (US)}}
|{{nowrap|2× Platinum (UK)}}
}}
|}
 
==Colgroups and rowgroups==
This also removes some of the the superfluous column widths (if you ''must'' have them, use ems because you don't know the metrics of the client's browser font) as well as the deprecated <nowiki><br /></nowiki> tags that are being used to visually mimic a list. Also, style="text-align:center" is much better than setting a td to the deprecated align=center. As usual, this isn't compulsory, but it is much better practice. The extra whitespace indenting in the unbulleted lists is only there to help make the structure clearer. I don't expect every editor to cope with this sort of markup, but there's no reason why experienced editors can't improve this as they clean-up tables. --[[User:RexxS|RexxS]] ([[User talk:RexxS|talk]]) 14:47, 10 September 2010 (UTC)
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)
:#I do agree about the widths. Widths do make the table look prettier. But they should be made of <code>em</code> rather than pixels. A good practice that I forgot to apply here. Thanks for reporting. :-)
:#I agree about <code>style="text-align:center"</code> as well.
:#Now I'm not sure about this particular use of unbuletted lists. Sure the principle is good and all. But I'm not sure it's worth the effort here. In the "Album details" column it saves a little space. And in "Sales" and "Certifications" column it can sometimes indicate a list of two items. It's a lot of code for a small change. However, [[The Prodigy discography]] contains a few examples where unbuletted lists would really be useful (lists of 4 to 7 items). It needs some more thoughts (and possibly feedback from users) on my opinion.
:Among tables, there are some far more urgent use of {{t|Flatlist}} (with another layout) in {{t|Navbox}} for example. I'd rather work on a large-scale important improvement on Navbox than a few lists here and there. Priorities, priorites. ;-) [[User:Dodoïste|Dodoïste]] ([[User talk:Dodoïste|talk]]) 04:35, 11 September 2010 (UTC)
 
== Better describe the problem of missing captions for screen reader users (SRUs)? ==
== Avoiding more than two levels of headers ==
 
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)
The table given as the good example could be improved by using row headers (in this case the distances). Remember, screen readers are capable of non-linear navigation, so the ability to announce the [column header][row header] before any cell value can be more effective when row headers are present, particularly on larger tables. --[[User:RexxS|RexxS]] ([[User talk:RexxS|talk]]) 15:05, 10 September 2010 (UTC)
:In theory I agree of course. In this particular case I was unsure the distance would made relevant row headers. But at a second thought – and after I saw more use cases – I think you are right. :-) [[User:Dodoïste|Dodoïste]] ([[User talk:Dodoïste|talk]]) 15:16, 10 September 2010 (UTC)
Add topic
Retrieved from "https://en.wikipedia.org/wiki/Wikipedia_talk:Manual_of_Style/Accessibility/Data_tables_tutorial"