首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

做了七年前端开发,我最近才意识到可访问性的必要......

可访问的图标按钮 —— 至少使用带有适当标签的 焦点指示器 —— 除非有替代方案,否则不要禁用默认的焦点样式 尽可能提供视觉标签 描述性信息图——屏幕阅读器提供回退文本描述 1 HTML 语义...我们考虑下面的场景: 假设我们有一个博客,在文章的列表页上,一篇文章如下所示: 它有一个缩略图、一个标题、一个描述和一个“阅读更多”的按钮,这是几乎所有博客文章的通用模板。...那么,我们是如何链接到详情页呢? 我们将缩略图做成一个链接 (link 1),接着是标题 (link 2),然后是“阅读更多”按钮 (link 3),这 3 个链接都指向同一个页面。...标题是否用于适当的结构,而不是强调大小? 是否用 tabindex=-1 删除了不需要的链接? 所有按钮是否都可以访问? 他们有合适的名称或标签吗?...信息图表应该有一个文字说明的回退,如果使用 SVG,则应带有回退描述。 应使用 tabindex= -1 禁用屏幕外链接,不然用户将被卡住,而不知道发生了什么。

1.7K30
您找到你想要的搜索结果了吗?
是的
没有找到

hexo主题next 7.X版本配置美化

设置中文语言 设置博主文字描述 设置博客文章连接year/month/day/title.html格式 Menu增加关于、标签、分类、互动、搜索菜单 禁用关于、标签、分类菜单评论功能 添加添加RSS...默认禁用,可以在themes/nexT/source/css/_custom/custon.styl文件中启用 设置Canvas_nest动态背景 图片快速加载设置 微信支付宝打赏功能 点击出现桃心效果...默认禁用,可以在themes/nexT/_config.yml文件github_banner键中启用 添加添加RSS 修改文章内链接文本样式 修改文章底部标签样式 在文章末尾添加“文章结束”标记 设置头像...(需要自己注册获取ID) 去掉底部重复字数统计 修改字体大小 添加DaoVoice在线联系。...---- 版权属于:青阳のBlog 本文链接:https://www.hipyt.cn/6.html 作品采用:《署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)》许可协议授权

81931

【ElasticSearch面试】10道不得不会的ElasticSearch面试题

客户端在和集群连接时,如何选择特定的节点执行请求的? 9. 详细描述一下 Elasticsearch 更新和删除文档的过程。 10....Elasticsearch 对于大数据量(上亿量级)的聚合如何实现? 11. 在并发情况下,Elasticsearch 如果保证读写一致? 12. 介绍一下你们的个性化搜索方案? 推荐阅读: 1....协调节点默认使用文档 ID 参与计算(也支持通过 routing),以便路由提供合适的分片。...flush 触发的时机是定时触发(默认 30 分钟)或者 translog 变得太大(默认为 512M)时; 1. translog 可以理解就是一个文件,一直追加。 2....对于读操作,可以设置 replication sync(默认),这使得操作在主分片和副本分片都完成后才会返回;如果设置 replication async 时,也可以通过设置搜索请求参数_preference

47020

Tomcat 调优的技巧 | 必学必知

一、描述 最近,在补充自己的短板,刚好整理到 Tomcat 调优这块,基本上面试必问,于是就花了点时间去搜集一下 Tomcat 调优都调了些什么,先记录一下调优手段,更多详细的原理和实现以后用到时候再来补充记录...minSpareThreads:线程池中允许空闲的线程数量(多余的线程都杀死); maxIdLeTime:一个线程空闲多久算是一个空闲线程; 其他的配置其实阅读官方文档是最好的「见参考链接」。...NIO Tomcat8 以上版本,默认使用的就是NIO模式「非阻塞式 IO」。...APR 全称 Apache Portable Runtime,是Tomcat生产环境运行的首选方式,如果操作系统未安装 APR 或者 APR 路径未指到 Tomcat 默认可识别的路径,则 APR 模式无法启动...5、禁用 AJP 连接器 AJP的全称 Apache JServer Protocol,使用 Nginx+Tomca t的架构,所以用不着 AJP 协议,所以把AJP连接器禁用。 ?

50710

Mirages主题帮助文档

阅读更多按钮 目前主题首页及其他文章列表中使用带格式的文章输出,而不是将正文文本去格式后截断。 如果你只想输出部分文章,那么你可以在需要截断的地方使用``标签截断文章。...基本语法:[名称](链接)+(头像链接) 头像大小建议400*400 Links 可以分组,在两个链接之间加入可见字符即可。...site=weixin&url={{%LINK}} 或者前往:最新可用的二维码生成 api - 不死鸟 查看更多 如何设置网站图标/favicon 默认情况下,取网站根目录的 favicon.ico文件...[名称](链接)+(头像链接) 头像图片必须正方形(差一个像素都不可以),大小建议400*400 Links 可以分组,在两个链接之间加入可见字符即可。...如果英文博客,则请将此选项设置英语,否则请保持默认

10K20

网站建设中十个常见的网页设计错误

1.关于我们:每个网站都应该提供非常清晰和直观的信息,包括简短的夸张描述,或者在主页上提供突出和明显的链接到“关于我们”页面,并描述你的网站及其提供的价值。...而且,这不仅给网站的访问者带来了方便,也对你有所帮助:如果读者发现你所说的和在别处看到的不一致是由于信息的更新造成的,他们会增加你网站的声誉,成为回头客,愿意经常访问您的网站以获取更多信息。...虽然常识告诉我们要提供尽可能多的信息,但极端的事情会适得其反,更多的好事可能会产生副作用。如果提供的信息太多,读者在阅读时容易疲劳,然后开始略读,最后干脆不读。...在加载充满缩略图的网页时,如果仅通过标记语言和样式表更改缩略图的大小,浏览器仍将消耗大量的处理器时间和系统内存资源;这可能导致浏览器崩溃和其他问题,至少加载时间较长。...如果你找不到一篇文章,你的客户就会放弃在你的网站上搜索而去其他地方。更糟糕的是,来自其他网站的链接可能会显著提高你在搜索引擎中的排名。如果禁用这些重定向链接,你是反对其他人的链接到你的网站。

94820

Bootstrap支持分页,Bootstrap 像处理其他界面元素一样处理分页

#">4 5 » 结果如下所示: 翻页(Pager) 如果您想要创建一个简单的分页链接用户提供导航...与分页链接一样,翻页也是无序列表。默认情况下,链接是居中显示。下表列出了 Bootstrap 处理翻页的 class。 Class 描述 示例代码 .pager 添加该 class 来获得翻页链接。...类 描述 实例 .pager 一个简单的分页链接链接居中对齐。...尝试一下 .previous .pager 中上一页的按钮样式,左对齐 尝试一下 .next .pager 中下一页的按钮样式,右对齐 尝试一下 .disabled 禁用链接 尝试一下 .pagination...分页链接 尝试一下 .pagination-lg 更大尺寸的分页链接 尝试一下 .pagination-sm 更小尺寸的分页链接 尝试一下 .disabled 禁用链接 尝试一下 .active 当前访问页面链接样式

1.3K20

kafka集群硬件与操作系统部署建议

注意: mmap() 函数添加了对与文件描述符 fildes 关联的文件的额外引用,该文件描述符上的后续 close() 不会删除该文件。 当没有更多映射到文件时,将删除此引用。...我们建议使用完全禁用应用程序 fsync 的默认刷新设置。 这意味着依赖操作系统完成的后台刷新和 Kafka 自己的后台刷新。...您可以通过执行查看操作系统内存使用的当前状态 > cat /proc/meminfo Copy 这些值的含义在上面的链接中有描述。...Kafka 根本不依赖 atime 属性,因此禁用它是安全的。 XFS文件系统建议 XFS 文件系统具有大量的自动调整功能,因此它不需要在默认设置中进行任何更改,无论是在文件系统创建时还是在安装时。...本文从大数据到人工智能博主「xiaozhch5」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。

66720

BootStrap应用开发学习入门

-- 强调 HTML 的默认强调标签 (设置文本父文本大小的 85%)、(设置文本更粗的文本)、(设置文本斜体)。...接着dd 是dt 的描述。 .dl-horizontal 可以让 dl 内的短语及其描述排在一行。开始是像 dl 的默认样式堆叠在一起,随着导航条逐渐展开而排列在一行。...顾名思义该组件可以增加标题的大小,并为登陆页面内容添加更多的外边距(margin) .jumbotron #容器 除了更大的 ,字体粗细 font-weight 被减为 200。...偏移列 描述:偏移是一个用于更专业的布局的有用功能, 可用来给列腾出更多的空间; 为了在大屏幕显示器上使用偏移,请使用 .col-md-offset-*类,其中 * 范围是从 1 到 11。...#按钮组 .btn-group #用于形成基本的按钮组 .btn-group-lg|sm|xs #控制按钮组的大小,注意md默认大小所以不用专门去写 .btn-toolbar #有助于把几组 <div

14.5K30

BootStrap应用开发学习入门

-- 强调 HTML 的默认强调标签 (设置文本父文本大小的 85%)、(设置文本更粗的文本)、(设置文本斜体)。...接着dd 是dt 的描述。 .dl-horizontal 可以让 dl 内的短语及其描述排在一行。开始是像 dl 的默认样式堆叠在一起,随着导航条逐渐展开而排列在一行。...顾名思义该组件可以增加标题的大小,并为登陆页面内容添加更多的外边距(margin) .jumbotron #容器 除了更大的 ,字体粗细 font-weight 被减为 200。...偏移列 描述:偏移是一个用于更专业的布局的有用功能, 可用来给列腾出更多的空间; 为了在大屏幕显示器上使用偏移,请使用 .col-md-offset-*类,其中 * 范围是从 1 到 11。...#按钮组 .btn-group #用于形成基本的按钮组 .btn-group-lg|sm|xs #控制按钮组的大小,注意md默认大小所以不用专门去写 .btn-toolbar #有助于把几组 <div

17.5K20

如何提高 Web 可访问性,让残障人士拥有更好的体验?

如果你确实想包括这些内容,那么你应该设法询问对方他们会如何描述自己。 让文本可访问 语言 为了使文本易于理解,你应该使用简单明了的语言。在短句和文本块中使用简单的词语。...视力正常的读者平均阅读速度每秒 2-5 个单词(或 10-12 个音节),而屏幕阅读器用户的阅读速度每秒 35 个音节。...告诉我们更多关于 Viget 的信息。 示例:好的链接文本 查看 Viget 的服务清单。 要了解更多信息,请阅读“你的网站可访问吗?” 告诉我们更多关于 Viget 的信息。...AA 级标准要求所有常规大小的文本对比度不低于 4.5:1,大型体文本 3:1(正常字体至少 18pt 或 24px,粗体至少 14pt 或 18.5px)。...你需要花费时间和精力来理解这些准则以及如何实现它们。 希望你现在对提高可访问性需要做的一些事情有了更多的了解,因为使网站内容可访问不仅仅是 Web 开发人员的责任。

70620

Spark 3.0如何提高SQL工作负载的性能

Spark第一阶段确定适当的分区数量,但对于第二阶段,使用默认的幻数200。...优化及其缺失会产生连锁反应:如果在第二阶段之后继续进行处理,您可能会错过进行更多优化的潜在机会。...Spark UI更加难以阅读,因为Spark给定的应用程序创建了更多的作业,而这些作业不会占用您设置的Job组和描述。...要启用它,您需要将spark.sql.adaptive.enabled设置true ,该参数默认false 。启用AQE后,随机调整分区的数量将自动调整,不再是默认的200或手动设置的值。...这涉及两个属性: spark.sql.adaptive.skewJoin.skewedPartitionFactor是相对的:如果分区的大小大于此因子乘以中位数分区大小且也大于,则认为该分区是倾斜的 spark.sql.adaptive.skewedPartitionThresholdInBytes

1.5K20

可访问性测试(无障碍测试)

最终,一切都转化为“更好的业务-更多的钱”。 如何衡量网页可访问性? web的可访问性可以通过W3C创建的web内容可访问性准则(WCAG)来衡量。...# 3)领导: 每个人都应该了解这些原则,如果他们在访问网站时遇到任何问题,都必须告知。 #4)考虑访问: 我们需要遵循标准,与此同时,我们可以考虑特殊残疾人组织遵循的标准。...如果菜单提供了短键,那么您需要检查是否所有这些都工作正常。 如果选项卡之间的导航是一个简单的任务,需要检查选项卡。 申请是否遵循所有的原则和指导方针。 标题是否独特,是否能传达意思和结构。...如果链接文本写有内容描述,而不是产生歧义。 是否提供有意义的多媒体标题。 是否有明确的指示。 内容是否清晰、简洁、易懂。 以下是网站应满足的可访问性的关键点: 链接文本应该是描述性的。...视觉残疾用户访问网页通过点击键盘上的标签按钮和从链接链接移动。因此,正确定义链接描述是至关重要的。确保超链接可以使用tab键访问。 尽可能提供适当的图片。图画比语言更响亮。

63551

Visual Studio Code 1.75发布

VS Marketplace 签名 - 已发布的扩展现在默认进行代码签名。 辅助功能改进 - 终端屏幕阅读器模式、新的键盘快捷键。 更轻松地调整多视图大小 - 拖动布局角以一次调整多个视图的大小。...更好的终端链接检测 - 检测包含空格、括号、行和列格式的链接。 新的 Git 命令 - 在 VS Code 中暂存更改和删除远程标签。...此外,更改的行会被选中,以便屏幕阅读器可以阅读。...终端辅助功能帮助 与编辑器中的 Show Accessibility Help 命令类似,Terminal: Show Terminal Accessibility Help ( Alt+F1 ) 命令屏幕阅读器用户提供重要信息...命令禁用 某些 Git 操作可能需要很长时间才能完成,因此,在运行Checkout, Commit, Push,  Pull 等命令时,Git 命令行将暂时禁用

2.9K30

【译】W3C WAI-ARIA最佳实践 -- 布局

当前页面的链接的 aria-current 属性设置 page。如果呈现当前页面的元素不是个链接,aria-current 可选。...例如,当数据元素是更多信息的链接时,不是将它们呈现在静态表格中并在页面tab序列中包含所有链接,实现 grid 模式提供给用户更加直观和有效的键盘导航方式,同时缩短了页面的tab序列的长度。...如果网格具有一个说明或描述,在网格元素上设置 aria-describedby 属性,其值指向包含描述的元素。...如果网格提供内容编辑功能,并且包含在某些条件下禁用编辑功能的单元格,在编辑功能被禁用时,设置 aria-readonly true。...如果工具栏控件是垂直排列的,工具栏元素应该设置 aria-orientation vertical。其默认 horizontal。

6.1K50

Yarn管理放置规则

重要的它区分大小写,不会删除空格。 指定 将应用程序放入运行时指定的队列中。 将应用程序置于提交期间定义的队列中。 拒绝 拒绝申请。 拒绝提交。 默认队列 将应用程序放入默认队列。...如何阅读放置规则表 在队列管理器 UI 中,您可以在一页上查看所有放置规则。了解此页面可以帮助您根据需要管理放置规则。...默认情况下,该属性设置 false,这意味着该功能被禁用并且放置规则无法覆盖在作业提交时指定的目标队列。...最终结果 已禁用(设置 false) 是的 是的 作业被提交到提交者指定的队列。 已禁用(设置 false) 是的 不 作业被提交到提交者指定的队列。...已禁用(设置 false) 不 是的 放置规则指定目标队列。 已禁用(设置 false) 不 不 作业被提交到调度程序的默认队列 ( root.default)。

2.1K10
领券