Wordpress 如何将alt文本添加到实际上是无声、循环、自动播放MP4的GIF<;视频>;?
我有一本书。为了减少这些GIF的巨大尺寸,我将它们转换为MP4视频,现在使用Wordpress 如何将alt文本添加到实际上是无声、循环、自动播放MP4的GIF<;视频>;?,wordpress,video,accessibility,animated-gif,web-accessibility,Wordpress,Video,Accessibility,Animated Gif,Web Accessibility,我有一本书。为了减少这些GIF的巨大尺寸,我将它们转换为MP4视频,现在使用标记来显示它们,如下所示: <div> <video src="myVideo.mp4" autoplay="autoplay" loop="loop" muted="" playsinline="" webkit-playsinline="" width="600"> </video> <p class="wp-caption-text">My caption that
标记来显示它们,如下所示:
<div>
<video src="myVideo.mp4" autoplay="autoplay" loop="loop" muted="" playsinline="" webkit-playsinline="" width="600">
</video>
<p class="wp-caption-text">My caption that makes it look more like an img than a video</p>
</div>
我的字幕让它看起来更像img而不是视频
我的问题是,添加alt文本的最佳方式是什么,就像添加在
标记上一样?这些视频可能使用了
标记,但实际上它们更像和图像,应该能够有alt文本。什么最适合屏幕阅读器,什么最适合搜索引擎优化
是否有其他方法可以实现我不知道的更小、更高效的GIF目标?使用title属性,这对视频元素有效。因为ALT文本描述的是静态图像
<video title="xyz" ...>
比如:
我的字幕让它看起来更像img而不是视频
> <> >这里有一些事情需要考虑:-/P>
1.视频是否为屏幕阅读器用户添加了任何内容
如果没有(即下面的说明准确描述了视频内容),则最好使用aria hidden=“true”
从屏幕阅读器中隐藏视频内容。不要为屏幕阅读器用户复制信息。由于你的“标题”实际上不是标题,我认为你最好这样做
2.让你的“标题”更通用
不合适吗?试着把自行车举起来,再靠近一点。这个停车收费表比我的自行车短了一点(看看车把是怎么碰到收费表的),所以我不能把它弄得像一根空杆子那么近,但还是很近
上面的示例引用了视频。相反,如果没有附带视频,请描述该步骤。尝试将其更改为以下内容:-
不合适吗?试着把自行车举起来,再靠近一点。我试着用的停车收费表比我的自行车短了一点,车把碰到了收费表,所以我不能把它弄得像一根空杆那么近,但还是很近
上面这句话并没有以任何方式引用视频,它本身就有意义。如果你把所有的“标题”都做成这样,那么说明在没有视频的情况下仍然有意义
3.你能暂停视频吗?
显然,您无法暂停GIF,但现在您正在使用视频,您应该允许用户选择暂停页面上的所有动画。可以通过单击暂停视频,也可以通过页面上的切换暂停所有动画。这些可能会分散焦虑症患者的注意力(尤其是当一个页面上同时播放数百个视频时)
您的用例
根据您的使用案例,只需使用aria hidden=“true”
隐藏视频元素并更新您的描述,就可以在以可访问的格式提供信息和不使用重复信息重载屏幕阅读器用户之间取得很好的平衡(如果在下面正确描述了每个视频,那么为每个视频添加标题
是没有意义的,而使无声视频可访问的正确方法是添加场景的增强音频描述
,这对于您的用例来说是过分的。)
不要忘记添加一种暂停视频的方法,可以一次暂停一个视频,也可以在页面开始处使用切换开关同时暂停所有视频
<div>
<video title="xyz " src="myVideo.mp4" autoplay="autoplay" loop="loop" muted="" playsinline="" webkit-playsinline="" width="600">
</video>
<p class="wp-caption-text">My caption that makes it look more like an img than a video</p>
</div>