shopify商店模板为特殊人群提供的键盘支持功能以及资源访问-ESG跨境

键盘支持

视力或运动存在障碍的客户可能会使用键盘进行在线导航和完成任务。这些客户依靠可视的指示器来传达他们的键盘焦点在网页上的位置。在以下示例中，字段具有一个可视的焦点指示器：

如果您要编辑模板的样式表，请确保没有从任何页面元素中删除键盘焦点样式。请遵循以下准则：

• 当所有交互式页面元素都有键盘焦点时，它们都有一个清晰的可视指示器。这些元素包括链接、按钮和表单字段。

资源

若要详细了解本文中讨论的主题的 Web 可访问性，请参阅以下资源。

颜色对比度资源

• Colors with Good Contrast（对比度良好的颜色），来自 Web Accessibility Initiative 的一篇文章

• Contrast Ratio，一种在线工具，可以用于查找两种颜色之间的对比度

• Color Contrast Analyzer，一个可供下载的对比率应用程序，由 Paciello Group 开发

文本资源

• 16 Pixels Font Size: For Body Copy. Anything Less Is A Costly Mistake（16 像素字体大小：适用于正文。任何一个细节的缺失都是一个代价昂贵的错误）,来自 Smashing Magazine 的一篇文章

• 来自 Web AIM 的文章：Text alignment（Text alignment）

• Link Appearance（链接外观），来自 Web AIM 的一篇文章

• 来自 Web AIM 的文章：Using Headings for Content Structure（对内容结构使用标题）

替代文本资源

• Text to Speech（文本到语音转换），来自 Web Accessibility Initiative 的一篇文章

• Alternative Text（替代文本），来自 Web AIM 的一篇文章

• 来自 Medium 的文章：Considerations when writing alt text（编写替代文本时的）

幻灯片和视频资源

• 来自 A11Y 项目的文章：A Primer to Vestibular Disorders（前庭疾病入门）

• Text to Speech（文本到语音转换），来自 Web Accessibility Initiative 的一篇文章

• Video Captions（视频字幕），来自 Web Accessibility Initiative 的一篇文章

• 来自 YouTube 帮助的文章：Use automatic captioning（使用自动字幕）

• Captions and subtitles（字幕和副标题），来自 Vimeo 帮助中心的一篇文章

键盘支持资源

• Keyboard Compatibility（键盘兼容性），来自 Web Accessibility Initiative 的一篇文章

• Introduction to Focus（焦点简介），来自 Google 开发人员的一篇文章

Keyboard support

Customers with vision or motor impairment might use a keyboard to navigate and complete tasks online. These customers rely on a visual indicator to communicate where their keyboard’s focus is on a web page. In the example below, the Email field has a visual focus indicator:

If you edit your theme's stylesheet, then make sure that you don't remove the keyboard focus style from any page elements. Use the following guideline:

• All interactive page elements have a clear visual indicator when they have keyboard focus. These elements include links, buttons, and form fields.

Resources

To learn more about web acssibility for the topics discussed in this article, see the following resources.

Color contrast resources

• Colors with Good Contrast, an article from the Web Accessibility Initiative

• Contrast Ratio, an online tool that you can use to find the contrast ratio between two colors

• Color Contrast Analyzer, a contrast ratio application for download that was developed by the Paciello Group

Text resources

• 16 Pixels Font Size: For Body Copy. Anything Less Is A Costly Mistake, an article from Smashing Magazine

• Text alignment, an article from Web AIM

• Link Appearance, an article from Web AIM

• Using Headings for Content Structure, an article from Web AIM

Alternative text resources

• Text to Speech, an article from the Web Accessibility Initiative

• Alternative Text, an article from Web AIM

• Considerations when writing alt text, an article on Medium.

Slideshow and video resources

• A Primer to Vestibular Disorders, an article from The A11Y Project

• Text to Speech, an article from the Web Accessibility Initiative

• Video Captions, an article from the Web Accessibility Initiative

• Use automatic captioning, an article from YouTube Help

• Captions and subtitles, an article from the Vimeo H Center

Keyboard support resources

• Keyboard Compatibility, an article from the Web Accessibility Initiative

• Introduction to Focus, an article from Google Developers

特别声明：以上文章内容仅代表作者本人观点，不代表ESG跨境电商观点或立场。如有关于作品内容、版权或其它问题请于作品发表后的30日内与ESG跨境电商联系。