Analyzing your prompt, please hold on...
An error occurred while retrieving the results. Please refresh the page and try again.
多媒体网络无障碍指的是确保多媒体内容,如视频、音频文件和交互式演示文稿,能够被包括残障人士在内的所有人访问。多媒体内容在互联网上非常普遍,每个人都必须能够访问和理解所传达的信息。无障碍媒体必须满足残疾人的所有需求,并且必须包括:
无障碍多媒体是为辅助技术定制的。这意味着盲人不必再依赖他人为他们朗读。他们只需打开浏览器,自行与内容互动,因为读屏软件就是为大声朗读在线内容而设计的。
如果音频文件没有字幕,聋人就无法识别音频所传达的有意义的信息。但是,如果字幕编写得好并与音频内容同步,就能对多媒体中的关键视觉细节和动作进行描述。
我们已经在
屏幕阅读器无障碍 一文中介绍了如何检查图像、按钮等的 alt 文本。在此,我们将探讨使用<track>元素对多媒体无障碍的重要性。
<track> 元素视障人士无法看到视频内容,听障人士无法听到音频内容。<track>元素的主要目的是为视频和音频内容提供字幕和标题。虽然它的目的不是直接提供音频描述,但它可以与其他方法结合使用,为视觉障碍者提供音频描述。
使用视频 alt 文本不是 HTML 的标准或推荐做法。alt “属性主要用于为图像提供替代文本,并不适用于<video>元素。不过,也有其他方法可以使视频内容易于访问。
视频中的字幕包括所有基本背景噪音和其他声音的文字说明,以及所有对话和旁白的文字说明。<video> 元素必须包括一个具有 kind="captions" 属性的 <track> 元素。字幕必须传达视频中所有相关的听觉信息,包括对话、音乐提示、音效和其他对聋人用户至关重要的数据。
下面介绍如何使用 <track> 元素实现多媒介无障碍访问:
1<video poster="myvideo.png" controls>
2 <source src="myvideo.mp4" srclang="en" type="video/mp4">
3 <source src="myvideo.webm" srclang="fr" type="video/webm">
4 <source src="myvideo.webm" srclang="ua" type="video/webm">
5 <track src="myvideo_en.vtt" kind="captions" srclang="en" label="English">
6 <track src="myvideo_fr.ttml" kind="captions" srclang="fr" label="French">
7 <track src="mvideo_ua.vtt" kind="captions" srclang="ua" label="Ukrainian">
8</video>让我们看看 HTML 代码的第 5 行。<track>元素的src属性指定了曲目文件名,并指向包含字幕的 WebVTT 文件(“myvideo_en.vtt”)。kind 属性描述了文件的内容。srclang 属性指定轨道文件的语言。label 属性指定音轨名称。除 src 属性外,这些属性都不是必需的。不过,我们强烈建议使用这些属性,因为它们可以提高清晰度。
使用带有 kind="captions" 属性的 <track> 元素,确保网站上所有带有音频内容的元素都有字幕。字幕是与音频文件同步的文本,包含对话、旁白和任何重要的听觉信息,以方便聋哑用户。下面的代码显示了如何添加两个不同的音轨–一个英语音轨和一个西班牙语音轨:
1<audio>
2 <source src="mySpeech.mp3" type="audio/mp3">
3 <track src="captions_en.vtt" kind="captions" srclang="en" label="english_captions">
4 <track src="captions_es.vtt" kind="captions" srclang="es" label="spanish_captions">
5</audio><video> 元素的音频描述在 <video>元素中添加音频描述是一种重要的无障碍做法,可确保有视觉障碍的人能够完全理解和欣赏视频内容。虽然盲人可以顺利听到视频中的音频内容,但他们会错过电影中的视觉内容,如面部表情和场景。电影中发生的许多事情完全是视觉的,没有听觉成分。例如,一个人可以做面部表情,但不能说话。音频描述提供有关视频视觉元素的叙述信息,如场景、动作和手势。
下面的代码展示了如何添加两种不同的音频描述–一种是英语,一种是西班牙语:
1<video width="300" height="200">
2 <source src="myVideo.mp4" type="video/mp4">
3 <track src="audio_desc_en.vtt" kind="descriptions" srclang="en" label="english_description">
4 <track src="audio_desc_es.vtt" kind="descriptions" srclang="es" label="spanish_description">
5</video>要检查您的网站是否符合多媒体无障碍标准,您需要遵循以下步骤:
webAccessibility 对象的
Rules属性,可以访问网络辅助功能规则集合。document) 方法检查 HTML 文档的可访问性。结果存储在 validationResult 变量中。在本例中,您可以检查 HTML 文档是否符合 “1.2 基于时间的媒体 “准则中的所有标准。
1// Validate HTML for multimedia accessibility using C#
2
3// Initialize a webAccessibility container
4WebAccessibility webAccessibility = new WebAccessibility();
5
6// Get from the rules list Principle "1.Perceivable" by code "1" and get guideline "1.2 Time-based Media"
7Guideline guideline = webAccessibility.Rules.GetPrinciple("1").GetGuideline("1.2");
8
9//Create an accessibility validator, pass the found guideline as parameters, and specify the full validation settings
10AccessibilityValidator validator = webAccessibility.CreateValidator(guideline, ValidationBuilder.All);
11
12// Initialize an HTMLDocument object
13using (HTMLDocument document = new HTMLDocument("https://www.youtube.com/watch?v=Yugq1KyZCI0&t=4s"))
14{
15 // Check the document
16 ValidationResult validationResult = validator.Validate(document);
17
18 // Checking for success
19 if (!validationResult.Success)
20 {
21 // Get all result details
22 foreach (RuleValidationResult ruleResult in validationResult.Details)
23 {
24 // If the result of the rule is unsuccessful
25 if (!ruleResult.Success)
26 {
27
28 // Get an errors list
29 foreach (ITechniqueResult result in ruleResult.Errors)
30 {
31 // Check the type of the erroneous element
32 if (result.Error.Target.TargetType == TargetTypes.HTMLElement)
33 {
34 HTMLElement rule = (HTMLElement)result.Error.Target.Item;
35 Console.WriteLine("Error in rule {0} : {1}", result.Rule.Code, result.Error.ErrorMessage);
36 Console.WriteLine("HTML Element: {0}", rule.OuterHTML);
37 }
38 }
39 }
40 }
41 }
42}例如,要检查是否有音频描述,您必须选择所需的标准并对其进行检查。
1 // Get from the rules list Principle "1.Perceivable" by code "1" and get guideline "1.2 Time-based Media"
2 var guideline = webAccessibility.Rules.GetPrinciple("1").GetGuideline("1.2");
3
4 // Get criterion – 1.2.3 Audio Description or Media Alternative (Prerecorded)
5 var criterion = guideline.GetCriterion("1.2.3");
6
7 // Create an accessibility validator – and pass the found guideline as parameters and specify the full validation settings
8 var validator = webAccessibility.CreateValidator(criterion, ValidationBuilder.All);
9
10 ...请记住,关键是要确保残障用户能够访问多媒体内容并有效理解其上下文。结合多种无障碍技术,如字幕、文字稿和音频描述,可以为所有用户提供全面的包容性体验。
Aspose.HTML 提供免费的在线 网页可访问性检查器。该工具可扫描网页、验证网页是否符合 WCAG 标准、发现问题并提出改进建议。您可以即时了解网站的合规性,确定必要的修正范围,以及网站或 HTML 文档的当前状态与 WCAG 要求之间的差距。
Analyzing your prompt, please hold on...
An error occurred while retrieving the results. Please refresh the page and try again.