Skip navigation

Accessibility

Page Content

九游会国际采用了最佳实践和标准 as defined by Section 508 of the U.S. Rehabilitation Act 和万维网联盟(W3C)的AA级 Web内容可访问性指南(WCAG.1. 这些指导方针解释了如何使网页内容对残障人士无障碍. 

POUR

WCAG建立在可访问性的四个主要指导原则之上.  这四个原则的首字母缩写为POUR perceivableoperableunderstandable and robust


Accessibility Basics

Images

有文字的图片,如海报或信息图表是盲人无法访问的. 根据法律规定,视力正常的人可以使用的一切东西也必须提供给视力不正常的人 users. 因此,图像中显示的任何信息也必须写入 out in the text on the page.

如果图像也是一个链接,那么链接目的地应该在 alt text.

Alt text (image description)

为了让视障人士也能看到图像,重要的是要始终 include “alt text.屏幕阅读器使用Alt文本来解释图像显示的内容.

在写所有文本时,你要提供一个简洁而完整的描述 is in the image. 你可以省去像“photo of”或“image of”这样的短语,因为 alt text implies this already. 一些屏幕阅读器会在125个字符之后切断所有文本, 所以如果可能的话,让你的描述与角色数量保持一致是很重要的. 我们还建议在所有文本的末尾使用句号,以便屏幕阅读器暂停 在继续剩下的内容之前.

Alt Text Example

周五晚上在精神公园举行的动员会上,九游会国际啦啦队长对着扩音器大喊

Ok: Photo of cheerleader

更好的场景:啦啦队长用扩音器大声喊叫

最佳:九游会国际啦啦队长在周五晚上的动员会上对着扩音器大喊 at Spirit Park

 

Links

屏幕阅读器逐字读出所有文本,包括url. To create a better 对于那些使用屏幕阅读器的用户体验,使用有意义的超链接是很重要的 instead of spelling out URLs. 您还需要将超链接文本保持在100个字符以内 或者更少,以确保屏幕阅读器可以访问它们.

屏幕阅读器也可以读取所有的超链接,允许盲人“扫描”。 the web page. 为了使这个功能对视力不佳的读者有用,我们建议避免 “在这里”和“点击这里”链接,因为它们不告诉用户链接的位置. Creating 有意义的超链接也有助于视力正常的用户,因为它可以让他们快速 scan the page for important links.

下面是一些如何重写“here" and "click here" links:

而不是“您可以通过 clicking here” try:

Apply to USM online!

而不是“查看服务的完整描述” click here” try:

有关我们服务的更多信息,请查看 完整服务描述(PDF).

Instead of “click here to register” try:

Register online through our system.

Tables

我们的内容管理系统应用适当的“标记”或编码来帮助制作表格 accessible to non-sighted readers. 如果您将表复制/粘贴到CMS中,您将 我想确保它的编码是正确的,这样盲人也能读到. W3C has an excellent resource on creating accessible tables.

除了正确编码之外,所有表都必须包含标题. The caption 表的内容应该有一个简短的标题吗.

Videos

建议在USM网站上使用的所有视频都加字幕,并使用字幕 像YouTube这样的视频播放器. 如果你使用的是自动生成的字幕, 在将标题视频添加到您的网站之前,请务必检查标题的准确性 website. 自动生成的封闭字幕准确率通常在80%左右. You must go in and edit the transcript.

想了解更多关于编辑YouTube视频字幕的信息? Check out this Google Support article: "Edit or remove captions"

PDFs

许多pdf根本无法被屏幕阅读器读取,即使是那些可以读取的 can be difficult to use. 我们建议限制PDF的使用,但如果需要PDF,他们可以 must be accessible.

创建可访问的PDF从文档阶段开始. We recommend using Word, PowerPoint或Excel已经可以访问,然后导出为PDF格式. When 在写文档时,你会用到:

  • Meaningful hyperlinks
  • Alt text on your images
  • 分页,而不是跳转到下一页
  • 标题,遵循一致的标题层次或结构
  • Simple tables

一旦文档创建完成,一定要保存为PDF格式,并选择“最佳电子版” 发行和可访问性”,如果这是一个选项的话. Saving as a PDF allows screen 阅读器访问原始文档中的代码. If you use print as a PDF instead, 它将剥离所有这些代码,使屏幕阅读器无法访问内容.

有关使PDF更易于访问的详细信息,请参阅Adobe的“Make PDF’s Accessible" tutorial.

Headings

章节、页面标题和标题标签告诉视力不佳的用户内容是如何组织的 on a page. 因此,对信息层次结构适当使用标记是很重要的 并按适当的顺序(H1, H2, H3等).). 请不要简单地使用标题 the text more visually appealing.

例如,您不希望使用标题标记突出显示申请截止日期. 您也不希望使用粗体文本代替标题标记,因为这会 当屏幕阅读器“扫描”标题时被跳过,并且不会有相同的方向 effect as a heading would.

Color Contrast

文字和图标之间,为了便于阅读,必须有足够的对比 foreground and background colors. W3C Web内容可访问性指南(WCAG) 定义为符合要求而必须满足的特定对比度. Where we usually 看到颜色对比的问题是使用不同于标准的背景色 白色/灰色的表格,上面有文字. 某些颜色不能满足对比度要求 从而导致可访问性问题. 下面的工具和参考资料中有一些工具 部分,这将有助于确定将工作的颜色.

Tools and Resources

  • axe
    这个来自Deque(可访问性咨询)的可访问性测试工具包是什么 我们的CMS将在不久的将来转移到. It’s available as the axe Chrome Extension.
  • 站点改进可访问性扩展
    Siteimprove无障碍扩展是免费的,可以检查任何网页的可访问性 issues at any given time. 所有的分析完全在浏览器内完成,允许 安全评估密码保护或非公共页面、多步骤表单和 dynamic content.
  • WAVE
    这个在线工具是由WebAIM开发的,用来评估网页的可访问性 显示结果使用图标和指标,嵌入到原始页面. It’s available 作为一个独立的网站,或者作为 WAVE browser extension for both Chrome and Firefox.
  • 功能可访问性评估员 (FAE)
    这是一个来自伊利诺伊大学的在线网站可访问性评估器. FAE 能够抓取网站并提供摘要报告,加上报告 each individual page.
  • PageSpeed Insights -这是谷歌的一个工具,它将分析你的页面,而不仅仅是可访问性 比如加载速度和搜索引擎优化.
  • Color Contrast Analyzer
    这个免费的应用程序,在Windows和Mac版本中都可以使用,很容易检查 foreground & background color combinations. 两个版本都包括一个滴管工具 方便地从屏幕上的任何地方抓取特定的颜色.
  • WebAIM Color Contrast Checker
    这个方便的在线工具包括“变亮”或“变暗”现有颜色的功能 直到找到符合WCAG 2的组合.1 requirements. This functionality 也内置到WAVE扩展(见WAVE下的“第三方可访问性检查器 & Browser Extensions”).
  • NVDA
    NVDA(“非可视化桌面访问”)是一个免费的、开源的Windows屏幕阅读器. WebAIM publishes a handy guide on 使用NVDA评估网页可访问性. 这是一个很好的工具,可以了解使用屏幕阅读器的人听到了什么 when browsing your site.

尝试发布页面时可能遇到的特定错误

Header nesting issues

这些错误通常是指您的标头级别乱序. Think of your 标题作为页面的大纲. 如果一个人遇到那轮廓和部分 如果大纲被跳过,他们会认为遗漏了什么或犯了错误.

首先是一级报头(H1). 这通常是你的页面标题和自动获取 在填写页面标题字段时放置在页面上. Many people will start 创建他们的页面,并使用H3作为标题紧随其后,因为 他们根据标题的大小进行选择. 你可能觉得这样更好,但不幸的是 不符合无障碍标准. 你必须在你的页面中首先使用H2. Then an H3, and so on. 所以一个合适的结构应该是这样的:

Header 2

Header 3

Header 3

Header 2

Header 3

Header 4

Header 2

更多关于标题和适当的结构


Anchor contains no text

通常触发此错误是因为您将图像链接到另一个页面. 这可以通过简单地在所见即所得中填写链接的标题字段来解决 editor. 单击图像,然后单击编辑器中的链接按钮,然后填写 the title field.

链接模式窗口的截图,标题栏突出显示

导致此错误的另一种方式是删除过去用作链接的文本 编辑器在代码中留下了链接标签. 如果可以用错误文字来说明 在空链接的地方,然后在空白的地方点击删除, 你也许能解决这个问题. If not, you can fill out a support request 我们会尽快删除空链接,这样你就可以得到你的 page published.


b (bold) element used, i (italic) element used

这通常是由从其他应用程序复制/粘贴文本引起的. To fix this, 只需用粗体或斜体突出显示文本,单击相关按钮 关闭,然后点击它回来再次加粗/斜体您的文本. The editor will then 添加可访问的适当标记.

Examples and More Information


id attribute is not unique

在页面上使用相同的跳转菜单链接可能会产生此错误. Each anchor jump link needs to be unique. 但大多数情况下,这个错误是由旧代码生成的 以前的软件是在您的页面上. 如果你得到这个错误,不 在你的页面上有跳转链接,那么请发送一个 support ticket 我们将清除代码中多余的id标签.


Questions?

如果您对USM网站的可访问性有任何疑问或疑虑, please fill out a web support request or email webFREEMississippi.

您是访问我们网站有困难的访问者吗?

Please read our web accessibility statement 他们有获得帮助的工具和资源.