英文:
This video element does not have a mechanism that allows an accessible name value to be calculated
问题
以下是翻译好的部分:
"这个视频元素没有允许计算可访问名称值的机制。确保嵌入对象可以直接访问 [WEB-60]"
"可能是空属性导致了这个问题(playsinline="" loop="" autoplay="")吗?"
英文:
I have the following code, which was rendered in AEM, but cannot understand what exactly needs to be corrected to resolve this accessibility report error:
"This video element does not have a mechanism that allows an accessible name value to be calculated. Ensure embedded objects are directly accessible [WEB-60]"
<video playsinline="" loop="" muted="" autoplay="" width="100%"/>
<source src="video.mp4" type="video/mp4" data-src="video.mp4"/>
<source src="video.mp4" type="video/webm" data-src="video.mp4"/>
sorry, your browser doesn&#039;t support embedded videos.
</video/>
Could it be the empty attributes that are causing the issue (playsinline="" loop="" autoplay="")?
答案1
得分: 2
通常,视频播放器本身不需要成为一个可聚焦的元素,这意味着它实际上不需要一个可访问的名称。 视频播放器内部的所有控件(播放、暂停、静音、设置等)需要一个可访问的名称。
但如果键盘焦点可以移动到视频播放器,那么只需为视频添加一个aria-label
。
<video aria-label="视频主题" playsinline="" loop="" muted="" autoplay="" width="100%">
...
</video>
如果您的页面上有其他地方包含视频的标题,那么您可以使用aria-labelledby
。
<h2 id="newID">小猫和小狗</h2>
...
<video aria-labelledby="newID" playsinline="" loop="" muted="" autoplay="" width="100%">
...
</video>
英文:
Typically, the video player itself does not have to be a focusable element, which means it doesn't really need an accessible name. All the controls within the video player (play, pause, mute, settings, etc) do need an accessible name.
But if keyboard focus can move to the video player, then just add an aria-label
to the video.
<video aria-label="subject of the video" playsinline="" loop="" muted="" autoplay="" width="100%">
...
</video>
If you have text elsewhere on your page that has the title of the video, then you can use aria-labelledby
instead.
<h2 id="newID">kittens and puppies</h2>
...
<video aria-labelledby="newID" playsinline="" loop="" muted="" autoplay="" width="100%">
...
</video>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论