Question

我可以为HTML5中用作海报的图片添加alt信息吗？

 <video controls poster="/images/w3html5.gif">
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

Answer 1

我们对Coverr.co的视频存在相同的问题-尽管它们声音很小，但我们希望有一种方法可以为视障用户或使用旧浏览器（不支持html的用户）描述视频5 <video>标签）。使视频可访问的一个很好的附加好处是，由于Google无法抓取视频，但是可以肯定地抓取我们添加到HTML中的其他可访问文本，因此您将获得额外的SEO提升。

底线/ TLDR-尽管alt属性已经存在并广泛用于图像，但似乎没有等效的视频本机属性。这样做的理由是here，如果您有兴趣的话，但我觉得它不足以错过为那些根本无法观看视频的人准备一个简单标签的所有好处否则。

我们拥有什么？

解说词-对“视频中正在发生的事情”的描述。没有本机支持，但是对于如何将其集成到html中有一些建议。一项似乎简单有效的建议（摘自here）：

function showTranscript() {
  var x = document.getElementById('transcript');
  // var toggle = document.getElementById('trans_toggle');
  if (x.style.display === "none" || !x.style.display) {
    x.style.display = "block";
    this.text = "hide transcript"
  } else {
    x.style.display = "none";
    this.text = "see transcript"
  }
}

document.addEventListener("DOMContentLoaded", function(event) {
  var toggle = document.getElementById('trans_toggle');
  toggle.onclick = function() {
    showTranscript();
  };
});

#transcript {
  display: none;
}

<h2 id="title">Title of my video</h2> (<a href="#transcript" onclick="showTranscript()" id="trans_toggle">see transcript</a>)
<video src="foo.ogv" aria-labelledby="title" aria-describedby="transcript">
    <track kind="captions" label="English captions" src="captions.vtt" srclang="en" default></track>
  </video>
<div id="transcript">
  <strong>Transcript of the video:</strong> Transcript here
</div>

另一种选择是使用aria attributes，虽然有效，甚至推荐使用，但这种方法却不被支持。

字幕-如果我正确理解，则正确的集成方式是使用<track> tag。 什么是字幕？，摘自Media accessibility checklist：

字幕不应与字幕混淆，它们是相似的，但彼此不同。字幕是视频对话的直接翻译，通常是用不同的语言，字幕不仅具有口语的文字描述，而且还包含背景音乐或声音的描述，从而提供与水平相同的信息会从听音频中得到。

字幕-视频对话的直接翻译。我们不需要在Coverr中使用它，因为我们所有的股票视频都没有声音，但这当然是让听力受损的用户（以及FB上85％的用户在滚动视频时始终保持静音的一种非常有效的方法） feed）以“收听”您的视频。可以嵌入视频本身，也可以添加为VTT文件并由supported players显示。
Fallback text （不是可访问性，但将帮助使用旧浏览器的用户）。

有用的链接：

将native transcript tag添加到HTML标准的想法/计划。
Adding captions and subtitles to HTML videos。
Captions on the web and FCC compliance + converting to VTT。

我知道这不是您常见的，明确的SO答案，但是当前网络上视频可访问性的状态需要它能够获得的所有支持。很乐意提出任何意见或改进建议，因为这对我们来说仍然是一个本应解决的未解决问题，应尽快发展为标准解决方案。

是否可以为视频的海报添加alt属性？

1 个答案:

我们拥有什么？