Page MenuHomePhabricator

Special:Version table syntax has accessibility issues
Closed, ResolvedPublicBUG REPORT

Description

Steps to replicate the issue (include links if applicable):
Go to https://www.mediawiki.org/wiki/Special:Version

What should have happened instead?:
Tables with multiple captions should be separated and every table should be given its own <caption>:

- <tr><th colspan="5" id="sv-credits-specialpage">Special pages</th></tr>
+ <caption id="sv-credits-specialpage">Special pages</caption>

(id might also be moved to the <table> tag for simplicity)

- <tr class="sv-space"><td colspan="5"></td></tr>
+ </table>
+ <table class="…">

This might introduce a small misalignment between the nearby tables but, frankly, that is less of an issue than a WCAG violation.

Another good thing would be to add scope="col" on all table headers remaining:

- <th class="mw-version-ext-col-label">Extension</th>
+ <th scope="col" class="mw-version-ext-col-label">Extension</th>

Maybe upon a closer review from other accessibility-minded people there might be other issues.

Other information (browser name/version, screenshots, etc.):
Prompted by reading a comment in T363726: ?action=info should have a Table of Contents and looking into the code.

Event Timeline

Change #1027509 had a related patch set uploaded (by Pcoombe; author: Pcoombe):

[mediawiki/core@master] Improve accessibility of Special:Version tables

https://gerrit.wikimedia.org/r/1027509

Change #1027509 merged by jenkins-bot:

[mediawiki/core@master] Improve accessibility of Special:Version tables

https://gerrit.wikimedia.org/r/1027509

Change #1028430 had a related patch set uploaded (by Bartosz Dziewoński; author: Bartosz Dziewoński):

[mediawiki/core@master] Set consistent column widths on Special:Version

https://gerrit.wikimedia.org/r/1028430

Change #1028430 merged by jenkins-bot:

[mediawiki/core@master] Set consistent column widths on Special:Version

https://gerrit.wikimedia.org/r/1028430

There is a weird <table class="wikitable plainlinks" id="sv-skin"></table> on https://en.wikipedia.beta.wmflabs.org/wiki/Special:Version now, @matmarex can you take a look?

Also, hyphens: auto (maybe wrapped in @supports for entire block with widths) would’ve been preferred to word-break since the latter breaks the words pretty badly (I see EventStreamConfi/g and ElectronPdfServic/e now)

There is a weird <table class="wikitable plainlinks" id="sv-skin"></table> on https://en.wikipedia.beta.wmflabs.org/wiki/Special:Version now, @matmarex can you take a look?

Sure, seems to be caused by the other patch. I can write a fix for this later this week when I'm home, if no one gets to it first.

Also, hyphens: auto (maybe wrapped in @supports for entire block with widths) would’ve been preferred to word-break since the latter breaks the words pretty badly (I see EventStreamConfi/g and ElectronPdfServic/e now)

For some reasons we don't use hyphens: auto anywhere, but we do use word-break occasionally (have a look in Codesearch). I don't know why, but I assumed there's a reason and did the same thing.

I was going to add &shy; to some of the ugly long camel-case names (e.g. https://gerrit.wikimedia.org/g/mediawiki/extensions/TimedMediaHandler/+/master/i18n/en.json#5), I didn't expect my change to get merged so quickly before I got around to that. I'll do this later as well.

This work seems to be underway in T356532 and related tasks. I’ll do the patch.

Change #1028572 had a related patch set uploaded (by Saint Johann; author: Saint Johann):

[mediawiki/core@master] Fix the erroneous table in Special:Version

https://gerrit.wikimedia.org/r/1028572

Change #1028572 merged by jenkins-bot:

[mediawiki/core@master] Fix the erroneous table in Special:Version

https://gerrit.wikimedia.org/r/1028572

For some reasons we don't use hyphens: auto anywhere, but we do use word-break occasionally (have a look in Codesearch). I don't know why, but I assumed there's a reason and did the same thing.

It's because language support for auto hyphens is very dependent on the quality of the dictionary and breaking rules of the browser, and past experience is that outside of like 5 major languages it is simply terrible and people complain about it.

For me, in this case, both act about equally bad btw (CommonsMetada/ta), as the table is simply very width restrained.

Also, there is a problem with the patch. It uses nesting, without switching to less. While some browsers already support nesting in pure css, it is so new, i wouldn't use it yet without less.

Change #1028614 had a related patch set uploaded (by TheDJ; author: TheDJ):

[mediawiki/core@master] Use less for Special:Version stylesheet

https://gerrit.wikimedia.org/r/1028614

Change #1028614 merged by jenkins-bot:

[mediawiki/core@master] Use less for Special:Version stylesheet

https://gerrit.wikimedia.org/r/1028614

Change #1030247 had a related patch set uploaded (by Bartosz Dziewoński; author: Bartosz Dziewoński):

[mediawiki/extensions/ArticleCreationWorkflow@master] Add line-break hints in very long extension name

https://gerrit.wikimedia.org/r/1030247

Change #1030248 had a related patch set uploaded (by Bartosz Dziewoński; author: Bartosz Dziewoński):

[mediawiki/extensions/LabeledSectionTransclusion@master] Add line-break hints in very long extension name

https://gerrit.wikimedia.org/r/1030248

Change #1030249 had a related patch set uploaded (by Bartosz Dziewoński; author: Bartosz Dziewoński):

[mediawiki/extensions/WikimediaCampaignEvents@master] Add line-break hints in very long extension name

https://gerrit.wikimedia.org/r/1030249

Change #1030250 had a related patch set uploaded (by Bartosz Dziewoński; author: Bartosz Dziewoński):

[mediawiki/extensions/UniversalLanguageSelector@master] Add line-break hints in very long extension name

https://gerrit.wikimedia.org/r/1030250

After @TheDJ made the column a little wider, these are the only 4 WMF-deployed extensions whose names had ugly line breaks, at least on my machine.

I think that once these patches are merged, we're done with the follow-ups.

Change #1030256 had a related patch set uploaded (by Bartosz Dziewoński; author: Bartosz Dziewoński):

[mediawiki/extensions/DismissableSiteNotice@master] Add line-break hints in very long extension name

https://gerrit.wikimedia.org/r/1030256

Change #1030257 had a related patch set uploaded (by Bartosz Dziewoński; author: Bartosz Dziewoński):

[mediawiki/extensions/TheWikipediaLibrary@master] Add line-break hints in very long extension name

https://gerrit.wikimedia.org/r/1030257

(Added 2 more after testing on Ubuntu, which for some reason tends to use wider fonts. I'm really done now.)

Change #1030257 merged by jenkins-bot:

[mediawiki/extensions/TheWikipediaLibrary@master] Add line-break hints in very long extension name

https://gerrit.wikimedia.org/r/1030257

Change #1030248 merged by jenkins-bot:

[mediawiki/extensions/LabeledSectionTransclusion@master] Add line-break hints in very long extension name

https://gerrit.wikimedia.org/r/1030248

Change #1030249 merged by jenkins-bot:

[mediawiki/extensions/WikimediaCampaignEvents@master] Add line-break hints in very long extension name

https://gerrit.wikimedia.org/r/1030249

Change #1030250 merged by jenkins-bot:

[mediawiki/extensions/UniversalLanguageSelector@master] Add line-break hints in very long extension name

https://gerrit.wikimedia.org/r/1030250

Change #1030256 merged by jenkins-bot:

[mediawiki/extensions/DismissableSiteNotice@master] Add line-break hints in very long extension name

https://gerrit.wikimedia.org/r/1030256

Change #1030247 merged by jenkins-bot:

[mediawiki/extensions/ArticleCreationWorkflow@master] Add line-break hints in very long extension name

https://gerrit.wikimedia.org/r/1030247