郑州新像素教育
专注于UI设计培训
郑州新像素教育老师直接接听
400-029-09**
转 34077
微信扫码拨号
查看完整号码
扫码拨号
微信扫码拨号
- 主页
-
课程
- IT/互联网
- UI设计培训班 UI设计培训 UI广告设计培训班 UI界面设计培训 武汉UI设计培训 UI培训班 UI培训 UI交互设计培训 UI品牌设计培训 UI设计师培训班 学ui设计培训 广告ui设计培训 ui视觉设计培训 ui界面设计师培训 ui设计软件培训 ui设计学习培训 暑期设计培训 专业ui视觉设计培训 设计学习班 ui培训短期班 ui寒假培训班 学设计培训 ui美术培训 ui设计创业培训 ui设计培训小班 ui平面设计师培训 ue设计培训 平面设计ps培训 美工软件设计培训 短期设计培训班 平面设计班 ui设计师培训 面授ui设计培训 ui交互培训 ui设计培训 设计学习培训 设计ui培训 培训ui ui设计平面设计培训
- 老师
- 校区
- 简介
- 资讯
- 就业
- 问答(9)
更优秀的无障碍访问标准 — APCA
作者：新像素UI教育 来源：新像素UI教育 2023/4/14 9:02:27
先看视频，再看笔记。 今天给大家分享一个比WCAG更好用的无...
先看视频，再看笔记。 今天给大家分享一个比WCAG更好用的无障碍访问指南——APCA。它和WCAG是同一类工具，但是WCAG有一个致命的缺点，而这个APCA就完美地解决了WCAG解决不了的问题，对于我们UI设计来说，则是更好的兼容了暗模式。
首先，WCAG指的是两个颜色之间的对比度，准确来说是背景和背景上面的文字他们两个颜色之间的对比度，既然是对比度，肯定不能太亮，也不能太暗。所以WCAG就把对比度由高到低分成了三个类别：A、AA、AAA。
在以前，包括现在，我们做界面的时候判断文字跟背景的对比度行不行，就会参考一下WCAG，不过WCAG也有致命的问题。 下面两个按钮，左边的文字是白色，我们人眼看起来是没问题的，但是WCAG却给它判定为不合格，然后就有人把这个按钮发到推特上去投票，并且把对比度也去掉了，可以看到投左边按钮的占大多数，其实不管界面上用什么颜色，本质上是为了让我们人眼看着更舒服，这个例子就能反映出来WCAG并没有那么灵活。
我们来看这个，这个也做了一个投票，跟上面的投票差不多，不过这里就有一个问题，为什么白色文本更容易阅读？ 首先，白色是没有色调的，饱和度为零，但是亮度是拉满的，所以说白色已经是*强对比度了，而现在，它的背景又是一个橘黄色，这个颜色本身也是一个比较亮的颜色，所以，这两个比较亮的颜色放在一块，WCAG就认为它俩的对比度不够。
我们再看这个，按照WCAG的标准，这两个图都符合，左边是三个A，右边是两个A。但是他俩人眼看上去的对比度右边的反而更好一些，而左边黑色底蓝色字，我们看起来有点费劲。这样的话就能反映出来WCAG在做暗模式的时候就不太行了，基本上没有什么参考的价值。
这个时候我们用APCA的对比度标准来看一下，可以看到左边黑色卡片的对比度全部都是不合格，右边白色的是正常的，那现在我们加上APCA的调整效果，大家上下对比一下，很明显黑色卡片舒服多了。这个就是我说的浅色卡片跟黑色卡片我们人眼看到的对比度是一致的。
下面我来给大家简单介绍一下APCA，它的全称叫可访问的感知对比度算法，它也是根据文字和它的背景色去生成一个这两者的亮度对比值，而APCA不一样的是它的对比值会参考文字的属性、大小、还有上下文的环境综合得出来一个符合人类感官的亮度对比值。 这个跟WCAG就不一样了，WCAG有点像根据计算机算法算出来的，而APCA是更符合我们人类眼睛的亮度对比值。
另外它还有一个好处，对我们UI来说就很有用了，那就是无论这两个颜色有多亮或者多暗，APCA的对比度是一一对应的。 通过下面这张图可以看出，它们的对比度是统一的，白色卡片是45，而黑色卡片是-45，这个就很方便我们去做亮模式和暗模式之间的统一亮度。
由于APCA目前还是一个很新的工具，相关的插件我就发现了一个，大家可以在figma中搜索APCA，第*个插件就是。 打开插件之后，我们点击文字的时候，它会自动读取后面的背景，并且插件下面还定义了从15～90对比度的六个档位，通过档位可以帮助我们自动调整好颜色，但是它自动调整的未必是我们想要的。
以上就是今天要给大家介绍的APCA无障碍对比度，这里我要说的是，WCAG也好，APCA也好，他们对我们来说都是一个参考，不是一个规则，有时候我们颜色拿不准了，这个时候就可以用APCA看看好不好看。
相关资讯
“郑州新像素教育”是郑州新像素教育信息咨询服务有限公司在教育宝平台开设的店铺，若该店铺内信息涉嫌虚假或违法，请点击这里向教育宝反馈，我们将及时进行处理。
在线咨询
申请优惠
预约试听
返回顶部