User:TheDJ/accessibility tests

I'm thinking of making several changes:

1. Currently all items will pronounce: "Play media, button". I want to change this into "Play video, button" and "Play audio, button" respectively. I think this will make it easier to understand what to expect ?
2. I'm intending on prefixing the duration information with "Duration:"
3. Some of the items belong together, but especially when used inline are not sharing a widget group. I intend to introduce a aria group with the aria-label "Media widget" or "Media launcher" or "Media player". For consistency, I think i will also provide this group inside the thumbnail. This might get pretty redundant however. What is the preference ? Consistency or brevity ?
4. Currently this launching widget has the play button first, optionally followed by the duration and then optionally "Subtitles available". This provides the most important action before the information. I'm not sure if this is the right order. I could invert this for discoverability of the information before the action. However if I look at most video players, they seem to have the play action first, so I think people are already used to skipping ahead if they want more details ? For now I'm keeping this the same.
5. Alt text. Currently audio and video items do not support alt. This matches the behavior of the native audio/video element. However thumbnails can be quite different from the video, and especially when used inline, there currently isn't caption information to fall back on either. I am considering preserving the alt information if there is any, and reflecting it via the aria-label on the above mentioned new group. The demo will have it as "Possible alt text".

Below is demo content of several common audio and video embeddings. I followed them with rough transcriptions by VoiceOver, when cursoring through them. I've shortened the subtitles and duration groups of these, but other than that, they should be pretty accurate transcriptions.

Inline video small

This is a small inline video element. It does not have a caption. It only has a play media button.

Inline demo of Blender spring movie

VoiceOver transcription: Play media, button.

Thumbnail video small

This is a small thumbnail for a video. It has a caption and is inside the figure element, like all other thumbnails are since recently. It only has a play media button, because visually it is not large enough to show much more information.

caption of thumbnail demo of Blender spring movie

VoiceOver transcription: Caption of thumbnail of Blender spring movie, figure. Play media, button. link, File:Spring_-_Blender_Open_Movie.webm. Caption of thumbnail of Blender spring movie. End of, caption of thumbnail of Blender spring movie, figure.

Inline video

This is a larger inline video element. It does not have a caption, but, it has additional information about the duration of the video and will mention when there are subtitles available.

Inline demo of Blender spring movie

VoiceOver transcription: Play media, button. 7 minutes and 45 seconds, group. Subtitles available, group.

Video thumbnail

caption of thumbnail of Blender spring movie

VoiceOver transcription: Caption of thumbnail of Blender spring movie, figure. Play media, button. 7 minutes and 45 seconds, group. Subtitles available, group. link, File:Spring_-_Blender_Open_Movie.webm. Caption of thumbnail of Blender spring movie. End of, caption of thumbnail of Blender spring movie, figure.

Inline audio

alt of inline audio fragment

VoiceOver transcription: Play media, button. 7 seconds, group.

Thumbnail audio

caption of thumbnailed audio fragment

VoiceOver transcription: Caption of thumbnailed audio fragment, figure. Play media, button. 7 seconds, group. link, File:Example.ogg. caption of thumbnailed audio fragment, text. End of, caption of thumbnailed audio fragment, figure.