由 hrs, 14 十一月, 2019 HTML实例-070 html的类 标签 drupal 对 HTML 进行分类(设置类),使我们能够为元素的类定义 CSS 样式。 为相同的类设置相同的样式,或者为不同的类设置不同的样式。 实例代码: <!doctype html> <head> <meta charset="utf-8"> <style> .content{ background-color:black; color:white; padding:20px; margin:20px; width:600px; } p{ text-indent:2em; } </style> </head> <html> <body> <div class="content"> <h2>drupal内容管理系统</h2> <p>drupal 是一个面向Web的内容管理系统(content management system ,CMS), 源于比利时Antwerp大学的一个名为Dries Buytaert的学生在2000年发起的个人项目。 项目创立者们最初设计这个软件旨在让一个组内的人能够通过电子方式分享他们的想法和文件。 第一个公开使用Drupal构建的web站点是Drop.org。</p> <p>在2011年,用于此项目的软件被首次以“Drupal”的名字发布。Drupal的发音是“droo-puhl”(zhu-pou), 源于荷兰单词druppel的英文发音,意思是水滴(drop)。</p> <p>今天,成千上万的网站正在使用Drupal构建;它是世界上最流行的网站内容管理系统之一。 它的成功案例或许可以启发您在项目中考虑使用。</p> </div> </body> </html> 运行效果: 在这个网页设计中,我们定义div 宽度为600px ,背景颜色为黑色,字体颜色为白色,用<p>标签定义内容,并且每一段首行缩进4个字符,也就是两个中文的位置。 <div>标签:定义一个块元素 <style>标签:定义css 样式 background-color: 定义背景颜色 color:定义字体颜色 padding:定义文本的边距 margin:定义<div>标签跟页面的边距 width:定义字体白色。 text-indent:定义文本缩进。 评论
由 hrs, 26 十月, 2019 HTML实例-024 html 标签的块引用 标签 drupal 我们在编辑网页文本会遇到长短不一格式,我们怎么来统一这样格式呢?接下来我们就来学习一个<blockquote>标签,此例演示如何实现长短不一的引用语。 实例代码: <!doctype html> <head> <meta charset="utf-8"> <head> <html> <body> <p>这是一个长引用:</p> <blockquote> 这是一个长引用。这是一个长引用。这是一个长引用。这是一个长引用。这是一个长引用。 这是一个长引用。这是一个长引用。这是一个长引用。这是一个长引用。这是一个长引用。 </blockquote> <p>这是一个短引用。</p> </body> </html> 评论
由 hrs, 22 九月, 2019 如何进行无障碍审查? 标签 drupal 了解模块,主题或网站的可访问性似乎是一项艰巨的任务。如果您不熟悉可访问性,那么该主题的范围之广会让您想知道从哪里开始。适应各种各样的能力意味着相应地要考虑各种各样的问题。在本文档中,我们已将必要的注意事项列出为一个逻辑的逐步过程,以检查您的模块主题或网站的可访问性。 从运行自动化工具开始 通过自动工具运行页面可以发现许多可访问性问题。一些自动化工具包括WAVE,Tenon,Accessibility Insights,Google Lighthouse,Siteimprove和适用于Chrome 的Siteimprove Accessibility Checker扩展。使用axe-core可以使其中一些自动化。这些工具将帮助您快速捕获一些可访问性问题,例如标记的结构不正确,ARIA属性缺失和颜色对比度不足。 测试键盘导航 键盘导航是无法或选择不使用鼠标的用户访问屏幕上所有内容的主要方法。这包括屏幕阅读器用户,以及具有运动障碍(例如重复性应激损伤(RSI)或麻痹)的用户。为了获得良好的键盘体验,目标是具有合理的制表符顺序和易于识别的焦点样式。您还应该确保用户不必浏览过多的制表位。 要找什么 您可以跳过重复的内容吗? 应该提供一个跳过链接,使用户直接进入该页面唯一的内容,从而跳过重复的内容,例如导航菜单。跳过链接应该是页面上的第一个制表位,并且在聚焦时应该可见。 所有控件都可以完全操作吗? 每个交互元素都必须可与键盘一起使用。展开/折叠,树状视图和滑块,对话框和叠加层-拖放-一切。还是需要一种替代方法来完成操作。 您可以在两个方向上切换吗? 我们已经看到了一些应用程序,这些选项卡可以在页面上进行前移,但无法将其后移(使用Shift + Tab组合键),从而创建了键盘陷阱。确保可以在两个方向上一路浏览整个界面。 有键盘陷阱吗? 谨防在任何时候都完全陷入焦点。用户是否可以通过仅使用键盘来逃脱叠加层,模态和自动完成小部件?如果没有,那么您刚刚创建了一个键盘陷阱。 出现对话框时,您的注意力是否受到限制? 出现对话框时,应将键盘焦点限制在其中。否则,您可能会对其进行制表,并在对话框后面的页面上进行制表,而无法看到您的位置。 您的焦点始终可见吗? 一般的经验法则是,用户可以与之交互或提供输入的任何控件都应可聚焦并显示聚焦指示器(例如聚焦环)。如果键盘用户看不到重点,他们将无法与页面进行交互。 是否存在不可见但可以通过键盘访问的内容? 确保不存在应该被隐藏的内容,但按制表符顺序仍然存在。 是否存在与基于悬停可见的键盘可访问内容等效的功能? 使用鼠标来测试是否存在仅在悬停时才可见的内容,而您仅通过键盘无法访问这些内容。悬停可见的内容应具有替代的访问方式。使用键盘导航的用户不仅需要此功能,而且使用触摸导航的用户也需要此功能。 是否存在不应聚焦的可聚焦元素? 非交互式内容不应重点突出。如果某件事是可聚焦的,则期望用户可以使用它来做某事。用户可能对无法操作的可聚焦内容感到困惑或沮丧。 除非期望用户操作元素,否则不要在元素上放置tabindex =“ 0”属性。 在非交互式元素上添加不必要的tabindex属性也意味着导航内容需要花费更多的精力。 测试您的响应断点 完成所有这些键盘测试之后:增大浏览器的缩放比例,直到达到响应的断点,然后再次执行所有操作。使用高级别浏览器缩放功能的任何人都将与笔记本电脑上的“平板电脑”或“手机”版本进行交互。移动断点不仅限于触摸屏用户。 使用屏幕阅读器进行测试 运行自动辅助功能检查和手动浏览页面已经很长了。如果您不熟悉使用屏幕阅读器,则可以在不实际使用屏幕阅读器的情况下检测到许多这些问题。 要找什么 所有控件都有标签吗? 所有控件都应通过描述控件目的的标签来描述。在大多数情况下,这是通过使用元素完成的,但是在某些高级用例中,您可能必须使用aria-labelledby属性。 是否有任何自定义控件?是否通过适当的角色以及赋予其状态的任何必需的ARIA属性对其进行了描述? 辅助技术的用户应该可以访问通过格式,光标样式或位置等视觉提示传达给视力用户的相同信息。本机元素具有浏览器内置的此语义信息,但是对于自定义控件,您需要使用ARIA来添加此信息。例如,自定义滑块组件可能具有ARIA滑块的角色,它具有一些相关的ARIA属性: aria-valuenow,aria-valuemin和aria-valuemax。 信息流是否与您在屏幕上看到的一致,是否有意义? CSS可能会更改信息流。使用屏幕阅读器访问内容时,内容流是否也有意义? 链接文字有意义吗? 大多数屏幕阅读器在每个链接之前都说“链接”。例如,“产品”链接将被理解为“链接产品”。因此,链接不需要在链接文本中包含“链接”,因为所有用户已经知道它是链接。 在链接之间进行制表是一种为屏幕阅读器用户浏览Web内容的方法。链接应该脱离上下文。当从上下文中读出时,诸如“单击此处”,“更多”,“单击以获取详细信息”等短语是不明确的。 所有图像都有正确的替代文字吗? 所有图像均应带有适当的替代文字。这种做法的例外情况是,图像主要用于演示目的,而不是必不可少的内容。如果屏幕阅读器应跳过该图像,请将alt属性的值设置为空字符串。 使用屏幕阅读器进行手动测试 某些问题只能通过使用屏幕阅读器手动测试应用程序来解决。最常见的屏幕阅读器是VoiceOver(Mac OS)和NVDA(Windows)。要开始使用VoiceOver,您可以观看有关VoiceOver基础知识的视频并阅读VoiceAover的WebAIM教程。要开始使用NVDA,您可以观看有关NVDA基础知识的视频,并阅读有关如何使用NVDA和Firefox测试Marco Zehe的网页的信息。 熟悉屏幕阅读器并了解所需的常规键盘命令后,请尝试关闭显示器并放开鼠标。请记住,屏幕阅读器的发音应放在测试范围之外。 标题 标题是您内容的框架。良好的标题结构可以反映页面上的内容,例如书的索引。具有描述性标题和有意义的级别很重要,因为某些屏幕阅读器用户使用它们来浏览页面内容。 如果您已经运行了一种自动辅助功能工具,则很可能已经涵盖了与标题相关的大多数问题。 要找什么 每页只有一个H1元素吗? 每页仅应有一个H1元素来描述该页面的含义。 标题级别是否与内容匹配? 重要的是,根据其他标题而不是其字体大小来使用其他标题。重要的是不要跳过标题级别。 标题是否具有足够的描述性? 好的标题文本简短地描述了标题后面的内容。 颜色和对比度 必须有足够的色彩对比 颜色对比度是前景色(文本)和背景色的比率。文本与背景的比例应为4.5:1或更大。您可以使用颜色对比检查器来确定您的颜色是否符合此要求。 颜色一定不是显示视觉信息的唯一方法 尽管颜色是显示视觉信息的有效方法,但它并不是传达信息的唯一方法。当仅使用颜色来传达重要信息时,有色盲的人可能会遇到困难(他们可能会完全错过它)。 如果使用颜色来传达信息,请也至少使用以下一种额外方法: 使用有意义的文本来提供信息。例如,从绿色变为红色的圆圈旁边的“开”和“关”。 使用有意义的图标,以便用户可以按形状区分含义。 为了指示格式错误,不要只说“标记为红色的字段”。最好说出字段名称,并用可识别的错误图标标记它们。 另一个示例是用红色标记必填字段。一些用户可能无法将红色与其他颜色区分开,并且可能缺少填写此表格的信息。可以通过在字段标签上添加一个星号来解决此问题。 焦点状态不应仅依赖颜色。需要其他形状来传达焦点。通常,这将是围绕具有焦点的交互式控件的额外轮廓。 不单靠图标 如果图标代表功能的重要组成部分,则应随附描述其目的的文本。确保标记了交互式元素,例如导航菜单。并非每个用户都能理解对您显而易见的图标。屏幕阅读器还需要一个标签才能读取元素。 声音和视频 如果页面依靠声音或视频来传达信息,请确保提供字幕或解说词。有关字幕,字幕和音频描述的WebAim文章的更多信息 当使用信息的视频在您的网页音频或不带音频,视频也将需要为视障人士文本成绩单。 当您在网页上使用带有音频的内容丰富的视频 时 ,您的视频将需要为听障人士启用隐藏式字幕。 当使用带有声音的内容丰富且复杂的 视频 时,您可能需要为视力障碍人士提供音频描述,以描述通常不是由隐藏式字幕提供的视频中场景和动作的上下文。 使用实时视频时, 必须为听力障碍的人提供字幕。 使用 现场音频时,必须为视障人士提供文本替代。 这属于WCAG的基于时间的媒体指南1.2。 动画和自动播放视频和音频 在不受用户控制的情况下自动播放的动画,视频和/或音频可能会分散页面的其他部分。即使动画或视频位于页面上您可能认为不会引起问题的位置,我们也不知道用户如何查看页面。 动画,自动播放视频和音频的示例: 动画:轮播会自动循环播放一系列图像; 自动播放视频:页面加载后立即播放YouTube视频; 自动播放音频:页面加载后,广播源立即播放。 要减少页面上的干扰,请执行以下操作: 避免播放动画,视频和内容超过5秒。 为用户提供控件,以便他们可以选择何时停止,播放和暂停动画,视频和音频。 动态更改内容 JavaScript使动态更改页面的某些部分而无需完全重新加载它成为可能。无法完全看到这些更改的用户仍然需要知道它们已经发生。页面动态更改的示例包括动态更新搜索结果列表或显示不需要用户交互的离散通知。Drupal.announce()API 提供了一种在某些辅助技术上宣布动态内容更改的方法。 Drupal.announce()是一个基于ARIA活动区域构建的API 。在此有关ARIA活动区域角色的文档中可以找到一些示例用例。 测试动态更改的内容的最佳方法是使用屏幕阅读器。 评论
由 hrs, 22 九月, 2019 隐藏内容摘要 标签 drupal 隐藏内容对于辅助功能非常有用。我们可以以视觉方式隐藏事物,仅将其显示给屏幕阅读器用户,我们可以将内容隐藏于屏幕阅读器用户,而仅以视觉方式显示,或者我们可以同时隐藏两者。Drupal带有一些内置的CSS类,可以帮助确保意图明确。我们建议您不要使用它,因为它经常被滥用。 { display:none; } 技术视觉上隐藏屏幕阅读器隐藏附加信息 CSS: <div class="visually-hidden"></div>是没有这是内置在Drupal 8中的。在Drupal 7中是。class="element-invisible" CSS: <div class="hidden"></div>是是这是内置在Drupal 8中的。在Drupal 7中是。class="element-hidden" HTML5属性: <div hidden></div>是是在受支持的浏览器中,这与CSS相同。 { display:none; } ARIA属性: <div aria-hidden="true"></div>没有是内置于现代浏览器中。与HTML5的hidden属性非常相似 CSS: <div class="visually-hidden focusable"></div>是的,除非给予关注是它内置在Drupal 8中。在Drupal 7中, class="element-invisible element-focusable" 此格式取自18F的“隐藏内容”页面。 评论
由 hrs, 22 九月, 2019 正确隐藏内容 标签 drupal 并非所有隐藏内容的技术都适合屏幕阅读器或其他自适应技术的用户。此页面介绍了为所有用户和使用屏幕阅读器的用户隐藏内容的主要技术。 使内容不可见(在视觉上隐藏) 如果页面上的元素: 是一个交互式元素,但需要使其不可见,以便可以使其主题化(例如:链接,复选框,单选按钮或具有自定义样式的表单控件), 是某个目的是视觉上可见的东西的标题或标签(因此,标题/标签不需要向有视力的用户显示;例如:部分标签或表单元素标签),或者, 通常,对视力不佳的用户不应该看到,但对屏幕阅读器用户应该可见, ...那么您应该使其不可见(在视觉上隐藏)。 您可以通过以下方式做到这一点: 给元素一个类visually-hidden 在Drupal 8中,将“ 管理”显示页面中的字段配置为实体子类型(例如,“文章”内容类型上的“标记”字段),以将字段标签设置为“-可视隐藏-”, 使用CSS将其放置在页面可见区域之外,或者 使用CSS position: absolute !important; clip: rect(1px, 1px, 1px, 1px); overflow: hidden; height: 1px; width: 1px; word-wrap: normal; 在元素上。 例: 隐藏错误,警告和状态消息的标题。 推理: 在大多数主题中,状态消息会以彩色框突出显示,以吸引有眼力的用户,但为了符合WCAG 2.0第1.3.3节的要求,理解和操作内容不应仅依赖于组件的感官特性。例如形状,大小,视觉位置或方向。 如果没有标题指示状态消息是什么,则它们可能会使屏幕阅读器用户感到困惑。 大多数屏幕阅读器都可以使用页面上的标题跳过页面。给消息加上标题将使消息更易于查找。 使内容不可见,直到有人使用键盘导航到该内容为止 如果页面上的元素: 是帮助用户跳至主要内容或主要导航的链接, 是只能用鼠标使用的其他元素的替代,或者 通常,除非有视力的用户正在使用键盘导航页面,否则他们应该不可见。 ...那么您应该使它不可见,直到有人使用键盘导航到它为止。 您可以通过以下方式做到这一点: 赋予元素和类,或者,visually-hiddenfocusable 使用CSS css_selector_for_my_element { position: absolute !important; clip: rect(1px, 1px, 1px, 1px); overflow: hidden; height: 1px; width: 1px; word-wrap: normal; } css_selector_for_my_element:active, css_selector_for_my_element:focus { position: static !important; clip: auto; overflow: visible; height: auto; width: auto; } css_selector_for_my_element您要使其不可见的元素的选择器在哪里,直到有人使用键盘导航到它为止。 例: 核心主题中每个页面顶部的“跳至主要内容”链接。 推理: 纯键盘用户和屏幕阅读器用户想要一种快速跳转到页面主要内容的方法。 为了符合WCAG 2.0第2.4.1节标准,您必须提供一种跳过在多个页面上重复的内容块的方法。 为所有用户完全隐藏内容 如果页面上的元素: 在JavaScript事件将其显示之前,不应该显示它, 与上下文中的可见用户或屏幕阅读器用户无关, 包含由JavaScript读取/写入的值,但决不能直接显示,或者 通常,视力不佳的用户或屏幕阅读器用户不应看到, ...那么您应该为所有用户完全隐藏它。 您可以通过以下方式做到这一点: 为元素指定hidden类别(D8), 如果它是实体子类型的字段,则在该实体子类型的“ 管理”显示页面上将其格式设置为“-隐藏-” , 如果它是实体子类型中的字段标签,则在该实体子类型的“ 管理”显示页面上将其标签显示设置为“-隐藏-” ,或者, 在元素上使用CSS 。display: none; 例: 隐藏颜色模块的预览区域,直到运行Javascript: /* color.css (Drupal 7 and 8) */ #preview { display: none; } 推理: 如果JavaScript未运行,则预览无法正常工作,因此任何人都没有用。 滥用 “ display:none”的常见不当用法是删除表单标签或标题,以更改页面的视觉外观。但是,这将使表单元素对屏幕阅读器用户不可用! 例如,如果您删除带有“显示:无”的表单标签,则屏幕阅读器用户可能会告诉您:“我有一个必填的文本字段可输入,但我不知道该字段的用途。” 在这种情况下,使内容不可见(在视觉上隐藏)会更合适。 使内容对于屏幕阅读器不可见 如果页面上的元素: 有一个可访问的替代方案,它本身会造成混淆,或者, 通常,只应对有视力的用户可见, ...那么您应该使它对屏幕阅读器不可见。 您可以通过以下方式做到这一点: 给元素赋予属性 aria-hidden="true" 例: 删除搜索过滤器的控件仅向视力良好的用户显示“ x”,并为屏幕阅读器用户提供可访问的,视觉上隐藏的说明: Currently filtering by: <a href="...">Module <span class="visually-hidden">Click to remove this filter.</span> <span aria-hidden="true">x</span></a> 推理: 已经有可访问的替代文本。 即使听到替代文本,仅听到“ x”字样也会使屏幕阅读器用户感到困惑。 滥用 使内容对于屏幕阅读器不可见,意味着使用它们的人们无法感知或与其交互。为了符合WCAG 2.0第1.1节的规定,您必须提供可访问的替代内容,否则使用辅助技术的人将无法使用它。 进一步阅读不可见内容 WebAIM建议 显示:无屏幕阅读器问题 评论
由 hrs, 22 九月, 2019 外部无障碍资源 标签 drupal 一般资源 WCAG 2.0 - www.w3.org/TR/WCAG20 WCAG 2.1 - www.w3.org/TR/WCAG21 ATAG 2.0 - www.w3.org/TR/ATAG20 ARIA创作实践1.1 - www.w3.org/TR/wai-aria-practices-1.1 通用清单 - a11yproject.com/checklist.html 辅助评估工具 - webaim.org/articles/tools 辅助课程列表 - github.com/mgifford/a11y-courses 美国的18F辅助功能-https : //accessibility.18f.gov 英国的GDS可访问性-https : //accessibility.blog.gov.uk/ 社区资源 Drupal的松弛频道 - drupal.org/slack(加入辅助功能组) W3C松弛频道 - web-a11y.herokuapp.com 无障碍Drupal的集团 - groups.drupal.org/accessibility 无障碍Drupal的联谊会 - groups.drupal.org/search/site/a11ytalks 无障碍会见了YouTube频道 - www.youtube.com/c/AccessibilityTalks 辅助人员/公司名单 - github.com/joe-watkins/top-people-to-follow-in-web-accessibility 辅助工具 工具概述-http : //webaim.org/articles/tools A11Y风格指南 - http://a11y-style-guide.com/style-guide Wave - http://wave.webaim.org 页面可视化工具包-http : //khan.github.io/tota11y 斧头核心-https : //www.axe-core.org 斧头椰子(镀铬扩展) HTML代码嗅探器-http : //squizlabs.github.io/HTML_CodeSniffer/ 当前基于HTML代码嗅探器的站点审核工具-http : //pa11y.org Siteimprove辅助功能检查器(Chrome扩展程序) Koa11y(OSX应用程序) - https://open-indy.github.io/Koa11y Funkify(Chrome扩展程序) 色彩对比 色盲模拟器-http : //www.color-blindness.com/coblis-color-blindness-simulator 对比度检查器-https : //contrastchecker.com 颜色安全-http : //colorsafe.co 屏幕阅读器 VoiceOver会(内置苹果) - http://webaim.org/articles/voiceover(链接到WebAim条) NVDA(GPL适用于Windows) - https://www.nvaccess.org JAWS(专有适用于Windows) - http://www.freedomscientific.com/Products/Blindness/JAWS ChromeVox(Chrome扩展程序) 评论
由 hrs, 22 九月, 2019 在Drupal 8中扩展可访问性的贡献模块 标签 drupal 以下模块可以帮助改善站点的可访问性。 注意:其中某些模块可能已过时和/或未包含在Drupal的安全建议政策中。请检查各个模块页面以获取更多详细信息。对于Drupal 7模块。 自动替代文字 最新版本: 8.x-1.7 当用户未提供替代文本时,该模块将使用 Microsoft Azure认知服务API为图像生成替代文本。 封锁ARIA地标角色 最新版本: 8.x-1.1 受模块类的启发,该模块在模块配置表中添加了其他元素,使用户可以将ARIA标志性角色分配给模块。 CKEditor的缩写 最新版本: 8.x-1.1 在CKEditor中添加一个按钮,用于插入和编辑缩写。如果选择了现有的缩写标签,则上下文菜单还包含一个用于编辑缩写的链接。 CKEditor辅助功能检查器 * 最新版本: 8.x-1.0、8.x-1.x-dev CKEditor辅助功能检查器模块可在您所见即所得的CKEditor.com中启用Accessibility Checker插件。该插件是一种创新的解决方案,使您可以检查在CKEditor中创建的内容的可访问性级别,并立即解决发现的任何可访问性问题。 *注意:该模块现在不在Drupal安全最佳实践的范围内,因为它使用的QuailJS已不再受支持。 Fluidproject UI选项 最新版本: 8.x- 1.2、7.x-2.0 Fluidproject的UI选项为用户提供了辅助功能选项,以供用户修改页面的字体大小,行高,字体样式,对比度和链接样式。使用cookie保留更改。 高对比度 (测试版) 最新版本: 8.x-1.0-beta1 提供一种快速的解决方案,允许用户在活动主题和高对比度版本之间进行切换。 htmLawed 最新版本: 8.x-3.2 htmLawed模块使用htmLawed PHP库来限制和净化HTML,以符合站点管理员策略和标准以及安全性。htmLawed库的使用允许对HTML标记进行高度可定制的控制。 HTML净化器 最新版本: 8.x-1.0-rc1 HTML Purifier是符合标准的HTML筛选器库。HTML Purifier不仅会通过经过彻底审核,安全且允许的白名单删除所有恶意代码(更名为XSS),还将确保您的文档符合标准,这只有在全面了解W3C规范的情况下才能实现。 Siteimprove 最新版本: 8.x-1.0、8.x-1.x-dev Siteimprove插件弥合了Drupal和Siteimprove Intelligence Platform之间的鸿沟。 由于无缝集成,您现在可以在内容创建和编辑过程中将Siteimprove结果用于最有价值的地方。 样式切换器 最新版本: 8.x-2.0-alpha1、8.x-2.x-dev 该模块避免了创建主题或使用备用样式表构建站点的麻烦。Themer可以为主题提供其他样式表。网站建设者可以在管理部分中添加其他替代样式表。并且此模块将所有这些样式显示为带有链接的块。因此,任何站点用户都可以选择他/她喜欢的站点样式。 文字大小调整 最新版本: 8.x-1.1、8.x-1.x-dev “文本大小调整”模块为最终用户提供了一个块,可用于快速更改Drupal网站上文本的字体大小。该块包含两个按钮,可以增加和减少页面上的打印文本。该模块主要致力于通过帮助视障用户调整文本大小以使其视觉最舒适来增加页面的可访问性。 评论
由 hrs, 22 九月, 2019 Drupal 8辅助功能 标签 drupal 更多语义 Drupal 8中有许多实例,我们能够提供更多语义HTML5元素,辅助技术将能够利用这些元素。我们通过添加WAI-ARIA地标,活动区域,角色和属性进一步扩展了此范围。 声音警报 Drupal.announce()现在是Drupal 8 Core的一部分,具有core / misc / announce.js,因此用户可以放心地向听觉用户提供及时的消息。现在,在JavaScript中,我们可以向屏幕阅读器用户提供说明,使其以有主见或有礼貌的方式被读出: Drupal.announce('Hello world.'); 您还可以使用以下代码传递翻译后的字符串并更改消息的优先级: Drupal.announce(Drupal.t('This is important!'), 'assertive'); 受控制表符顺序 该TabbingManager是一个伟大的新机制,引导这两个非可视化用户和非鼠标用户访问页面上的突出元素的逻辑顺序。这允许对导航复杂用户界面的这种方式进行更多控制。 隐藏/隐形/定焦 我们一直在不断完善CSS展示的集中式替代方案:并决定标准化HTML 5 Boilerplate的命名约定。我们还解决了Firefox,Safari和iPhone上的问题。 字段集 目前,我们现在在Form API中将字段集用于单选和复选框。这是进一步增强Drupal形式的重要一步。现在,它也用于高级搜索中。 jQuery UI jQuery UI现在正在提供Drupal的自动完成功能。现在,我们还在Views UI和其他地方使用了它们的模式对话框。通过与jQuery UI社区合作,我们能够改善两个项目的可访问性。 替代文字 现在默认情况下需要备用文本。可以在“ CKEditor”和“图像”字段中均覆盖此设置,但是默认值假定内容创建者将希望使其内容可访问。 Bartik Bartik现在正在为链接添加下划线,以便人们在页面上标识链接更加容易。 可访问的内联表单错误 通过添加可访问的内联表单错误作为可选的实验性Core模块,Drupal表单已变得更加易于访问。现在,每个人都可以更轻松地确定他们在填写Web表单时可能犯的错误。 评论
由 hrs, 22 九月, 2019 无障碍 标签 drupal Drupal 8中的辅助功能 Drupal 8辅助功能 Drupal 8提供了高级辅助功能,以帮助不同的用户组。 在Drupal 8中扩展可访问性的贡献模块 Drupal 8中具有可访问性优点的模块列表 外部无障碍资源 其他网站,工具和其他可访问性资源的列表。 正确隐藏内容 此页面介绍了为所有用户和使用屏幕阅读器的用户隐藏内容的主要技术。 隐藏内容摘要 有关如何在Drupal 8中隐藏内容的说明 如何进行无障碍审查? 本文档提供了逐步的过程,以复查模块主题或网站的可访问性。 评论
由 hrs, 22 九月, 2019 Drupal多站点的用例 标签 drupal 虽然在决定是否使用Drupal的多站点功能时应考虑各种因素,但以下是站点构建者选择它的一些常见原因: 用户使用多站点为他人创建“副本”站点。(所有一个代码库都具有相同的特性和功能,只是主题因站点而异。) 他们使用多站点来托管多个相关站点,例如,一所大学拥有数十个部门,几乎全部*都需要相同的功能,但是某些部门具有特殊的功能(共享的核心,共享的模块“配置文件”,不同的站点具有不同的自定义模块) 有时,他们仅在自己的一个站点上升级模块以“测试升级”,以使一个站点的模块版本比其他站点新。 有时他们共享数据库表。[从历史上讲,共享托管只提供1个数据库] 针对一个不会更新数据库的安全问题,更新一个Drupal模块对于多站点而言要比对多个独立站点要简单得多(仅适用于模块,而不适用于核心) 基于简单测试和功能性基于PHPUnit的测试都利用多站点功能来运行测试。 有时,他们使用多站点来节省每个代码库的托管费用,既可以通过预先支付提供商费用,也可以在内部配置和管理托管方面遇到困难。 用户使用多站点来减少资源使用:运行共享一个操作码缓存的多个站点可提高内存效率 在开发过程中使用多站点。迅速启动一个新的子站点来处理特定问题是非常快的。 对于主机名配置文件的支持。 评论
评论