键盘支持
视力或运动存在障碍的客户可能会使用键盘进行在线导航和完成任务。这些客户依靠可视的指示器来传达他们的键盘焦点在网页上的位置。在以下示例中,电子邮件字段具有一个可视的焦点指示器:
如果您要编辑模板的样式表,请确保没有从任何页面元素中删除键盘焦点样式。请遵循以下准则:
当所有交互式页面元素都有键盘焦点时,它们都有一个清晰的可视指示器。这些元素包括链接、按钮和表单字段。
资源
若要详细了解本文中讨论的主题的 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 开发人员的一篇文章
Shopify商户官网原文详情:
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 accessibility 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 Help Center
Keyboard support resources
Keyboard Compatibility, an article from the Web Accessibility Initiative
Introduction to Focus, an article from Google Developers
文章内容来源:Shopify商户官方网站