○ 全球15%的人口有着不同程度的残疾，包括视力、听觉、行动及认知障碍。
○ 全球约4%的人口视力低下，0.6%的人口有视盲，这些用户日常上网可能需要借助屏幕阅读器/盲文阅读器。○ 全球约7-12%的男性以及不足1%的女性有不同形式的色觉缺陷(如色盲)，他们难以区分某些特定颜色组合。○ 低视力状况随着年龄的增长而增加，50岁以上的一般人有一定程度的低视力状况。○ 过了40岁，大多数人都需要戴老花镜才能看清小物体或文字。现实生活中，不乏部分用户仍在使用老旧、性能差的设备来访问网站；也有部分用户是需要在强烈光线、交通工具及昏暗环境中上网冲浪。因此，为了确保绝大部分用户都可以正常访问你的网站，将“无障碍”概念融入到网页设计中是一件非常有必要的事情！WCAG全称为Web Content Accessibility Guideline，中文翻译为网站内容无障碍指南，主要针对残障人士包括视力、听力、运动和智力等制定诸多方面的标准条例，确保残障人士能够访问并使用网站内容。
此外，WCAG并不是仅仅针对残障用户，还可以为其他用户带来不少好处，比如部分用户可能因为浏览技术、网络速度、访问环境等不良情况，而遭遇与残障人士类似的访问障碍。因此，网站如果遵循WCAG规范来设计，将大幅度提升网站整体用户体验。而该规范主要是围绕以下四个原则来进行：
? Perceivable（可感知）：界面组件和信息必须采取用户可以感知的方式来呈现。? Operable（可操作）：界面组件和导航操作必须保证用户能够正常操作和交互。? Understandable(可理解)：确保用户能够理解界面上所有信息及操作。? Robust（稳定耐用）：界面组件及信息必须具有足够强的适应性，可以兼用各种网络技术及访问设备。对视障用户来说，读屏软件就像是他们了解互联网世界的“眼睛”。也就是说，如果网站没有设置读屏功能，他们将难以获取界面信息，自然无法正常访问网站。在网站代码中添加无障碍标签，如针对Android系统的“contentDescription”；针对iOS系统的“accessibilityLabel”。
装饰性图标可设置隐藏标签来提升读屏效率，同时避免用户以为这里含有重要信息但无法读取而感到不安。
标签语义尽量精准简短，并尽可能使用动词。
必要时检查焦点顺序，确保用户不会被错误焦点顺序而误会页面的含义。
尽量保证页面图形能被准确读出其用途，如“检查”图标应避免被读成“magnifier”或“SearchBtn_123”。
众所周知，色彩既可以帮助用户区分信息数据的类别和维度，也可以帮助界面传达情绪等重要信息。然而，世界上却有不少色觉障碍（色盲）患者而无法正常访问网站，因此我们需要尽可能提升色彩对比效果，以确保信息有足够的辨识度和舒适度，比如：尽量避免选用明度相似的橙、黄、绿或红、绿配色，因为这会造成色盲用户的可读性问题。特别是对红绿色盲用户而言，红色并非是“明亮醒目”的颜色，反而在他们眼中红色越深越接近黑色，因此他们难以分辨内容中的深红色文字，从而遗漏关键信息。此外，临床医学研究证实，高饱和度色彩（比如黄色）可能令自闭症患者产生不安和不适；而老年群体随着年龄增长，眼球晶状体会逐渐变黄变混浊而选择性吸收蓝光，导致对蓝色的识别能力下降明显。换言之，如果网站的目标群体是老年用户，尽量避免将蓝色运用到重要元素中。虽然颜色是数据可视化中最常用的视觉变量之一，但是对于无法辨别颜色的用户来说，界面仅用颜色作为唯一的“提示”，可能会导致他们无法理解和辨别网站信息。这里就需要适当运用图标、纹理或文字等其他视觉变量，对界面中的重要元素加以标注。一般来说，控件的尺寸太小或间距太近，都可能导致用户因误点击而感到挫败，比如无法用手指尖精准定位的用户、因年龄而导致灵活性降低的老年用户等，都会难以点击过小或过近的控件。
因此，保证控件足够大、足够远，有助于方便用户识别并减少误触的可能性。在设计无障碍网站时，我们不仅需要保证文本字号足够大以提升界面易读性，还应该允许用户自定义设置字体、字号、行高或字间距等，以及避免出现内容溢出或排版错乱的情况，从而达到舒适的阅读水平。除了允许用户自定义设置文字属性外，增加文本和背景的色彩对比度同样与界面易读性和可读性息息相关。目前WCGA AA对文本对比的规范为4.5:1。当然，如果界面文本足够大，该标准可适当降至3:1。此外，还有一点需要注意的是，尽量不要在图片上叠加文字，除非图片背景单一且对比度足够高，或者在图片上添加一层蒙版来提高文本的可读性。但要注意避免使用与背景色对比度极高的文本颜色，否则部分视障用户会出现眩晕或模糊的情况。添加合适的动销设计的确给网站增添生命力，但滥用动效不仅会分散用户的注意力，严重还可能对如光敏性癫痫患者等用户造成生命威胁。此外，WCAG官方说明也提及到，部分用户会因为滚动页面的动效而触发大脑前庭疾病，产生头晕症状。
为了避免给这类用户造成困扰，网站如果出现以下情况，建议给用户提供相关的控件或选项来暂停、隐藏或更高动画效果及频率：
总的来说，无障碍设计并不是随便增加元素属性的对比效果就能达成，更多是需要我们不断尝试、不断研究，才能让网站变得更友好，让更多不同用户都可以平等地使用我们的网站！
优网科技，优秀企业首选的互联网供应服务商
优网科技秉承"专业团队、品质服务" 的经营理念，诚信务实的服务了近万家客户，成为众多世界500强、集团和上市公司的长期合作伙伴！
优网科技成立于2001年，擅长网站建设、网站与各类业务系统深度整合，致力于提供完善的企业互联网解决方案。优网科技提供PC端网站建设（品牌展示型、官方门户型、营销商务型、电子商务型、信息门户型、DIY体验、720全景展厅及3D虚拟仿真）、移动端应用（手机站、APP开发）、微信定制开发（微信官网、微信商城、企业微信）、微信小程序定制开发等一系列互联网应用服务。
公安局备案号：
专属顾问
