phpgd斜体技巧_超周全无障碍设计指南

文章目录 [+]

你知道吗？视力、听力和行动能力完备康健的人，可以轻松地读写，可以有效实行多任务，并且始终可以正常事情的人约占总人口的50％？别的的人都是戴着眼镜或有色盲，手腕或耳朵受伤，生活在喧华的环境中或网络旗子暗记质量差，劳碌或劳碌中，阅读障碍或有把稳力障碍等。

这意味着大约一半的用户可能很难利用我们的产品或浏览我们的网站。
因此，我们可能错过了提高用户满意度并扩大受众范围的机会。

phpgd斜体技巧_超周全无障碍设计指南

不过在设计阶段履行一些大略的原则就可以改进交互和整体用户体验，极限设计可以为所有人带来代价，我们称之为“原谅性设计”。

（图片来自网络侵删）

一、什么是原谅性设计？

原谅性设计考虑了尽可能多的人的需求和能力，而不仅仅是针对残疾人。
它认识到我们的需求会随着韶光和环境的变革而变革，因此它会预测缺点，挣扎和不同的交互办法。
它的目的是在问题发生之前办理问题，提高标准并改变良好产品设计的标准。

原谅的用户界面是善解人意，故意识且可访问的。
年事、性别、教诲程度，财富和能力平分歧特色，在不同环境中生活或事情，得到技能水平不同的不同人群可以舒适地利用它。
我们将利用POUR作为在用户与界面之间创建大略、轻松、快速交互的参考。

POUR代表可以理解：数字内容可以轻松地以不同办法进行阐明或处理吗？可操作：数字产品能否轻松自若地进行功能和掌握？可以理解：用户可以理解界面的功能和内部信息吗？健壮性：数字产品是否与不同的赞助技能和设备兼容？

二、设计师如何供应帮助

作为设计师，我们当然不能掌握以上所有哀求都能做到。
但是我们该当承认，人们碰着的许多可访问性问题是由设计阶段未做过的决定引起的。

因此，设计师有很多机会可以有所作为。
仅通过做出更明智的设计决策，我们就可以影响（改进或帮忙）四种履历。

视觉体验：这包括形状、颜色、比拟、文本样式-产品界面的所有图形元素。
听觉体验：这是指与产品互动时产生的声音、音量和清晰度。
认知履历：这描述了用户花费在阐明界面上的韶光，以及利用界面须要多少把稳力和精力。
运动体验：这包括实行任务或与产品交互所需的所有动作和动作。

常日，可访问性被认为是对创造力的寻衅；但是，如果我们认为这是一个创造性的寻衅，那么我们会开辟全新的可能性领域。
真恰好的可访问性的诀窍不是在功能或功能上进行折衷，也不是在美学上取舍，而是使功能和创意体验也可以访问。

1. 改进视觉体验

1）颜色

① 比拟度

比拟度是亮度或颜色的差异，使物体从周围环境中脱颖而出，并可能对清晰度产生显著影响。
高比拟度使视觉元素从背景中脱颖而出，更加引人瞩目。

专家提示：纯粹的＃000000黑白色会给眼睛带来强烈的比拟度，乃至会影响阅读障碍者。
这便是为什么我们方向于避免利用它，而是选择深灰色的缘故原由。

② 亮度

亮度描述从光源发出的照明水平或从表面反射的光量。
通亮的颜色反射更多的光芒，并会滋扰我们阅读和处理信息的能力。

避免在背景或较大表面上利用鲜艳的颜色。
请勿在文本上或文本附近利用鲜艳的颜色，以免滋扰文本。

如果品牌哀求特定的高亮度颜色，请考试测验建议利用饱和或较深的颜色。
如果你绝对必须利用通亮的颜色，则应将其用于突出显示动作的方法最小化，并将其与较深的色相搭配以达到平衡和高比拟度。

专家提示：任何含有超过50％黄色的颜色都会自然反射更多的光。
这意味着黄色，橙色，绿色和蓝绿色是高风险颜色，应谨慎利用。

③ 色盲

色盲是无法区分特定颜色（常日是赤色和绿色，偶尔是蓝色）的一种，它比你想象的要常见。

专家提示：不要仅仅依赖颜色；颜色不应该是传达主要信息的唯一方法。
您可以实行以下操作：

利用下划线表示链接和斜体，或利用粗体突出显示文本；将图标与文本一起利用可传达成功或失落败的信息；利用纹理或图案作为图表；为按钮或明显的关照利用清晰的视觉样式，针对焦点或活动状态利用不同的字体样式。

2）版式

① 字体选择

通信是每个数字产品的紧张目标，可以借助印刷术及其精确运用来实现。
内容应清晰易读，这意味着易于识别和解释，轻松阅读和处理。

简洁明了对付快速阅读和解释至关主要，请避免利用繁芜的字体，由于它们只会增加视觉滋扰。
选择精确的字体家族，针对那些具有清晰定义和独特形状的字符，由于视力障碍或阅读障碍的人可能会因某些字符或其组合而感到困惑。

② 字体样式

字体样式还会影响弱视或阅读障碍者的阅读性能。
我们该当把稳并谨慎利用字体样式（如斜体，下划线和大写）的频率和位置。

根据“英国阅读障碍协会”的规定，应避免利用斜体，特殊是对付较大的副本块或较小的字体。
这是由于它们使字母倾斜，显得更加尖锐，因此更难以阅读。

正文也应避免利用带下划线的字体样式。
给长的段落加下划线会增加视觉噪音，从而降落阅读性能，而给短的句子或单词加下划线会与活动链接干系联，并可能引起混乱。
粗体是添加比拟度和强调的更好选择。

只管没有确切的研究，但有一些证据支持也应避免紧张针对正文利用大写字母。
彷佛所有大写字母的统一外不雅观会降落单词形状的比拟度，从而使扫描变得不那么随意马虎。
此外，大写看起来有点紧张，可能觉得彷佛有人在向您大喊大叫。

专家提示：平衡是关键。
谨慎利用每个样式并授予其含义乃至可以提高可读性。

③ 字体大小

您知道绝大多数人戴眼镜或隐形眼镜吗？实际上，十分之六以上！
此外，约有62％的人通过手机访问互联网，这还不包括运用程序的利用情形。
当视力不佳的人在旅途中在小屏幕上利用技能时，可能会出什么问题？

利用较大的字体。
常日，16px被认为是最具有原谅性的，但是请把稳，字体可以以不同的比例站立，并且字体的大小可以相差很大。
切勿低于14px，事实上，大多数当代网站的正文都利用18px字体，而标签，标题或工具提示仅利用14px或16px。

专家提示：此外，避免利用薄而轻的字体，由于对付较小的字体或在通亮的光芒下可能难以阅读。

④ 段落格式

帮助人们轻松浏览内容该当是我们的紧张目标，由于只有20％的人可以阅读内容，个中55％的人可以快速浏览内容。
我们的事情是通过利用舒适的段落格式来尽可能地支持人们。

研究表明，用于支持可读性的均匀在线行长（包括空格）约为70个字符。
标题，字幕和项目符号点将有助于扫描，而左段对齐将使文本更易于阅读。

较长的笔墨墙使人们参与的机会大大减少。
成功的段落长度不超过5到6个句子。

空格将帮助患有认知和把稳力障碍的人，保持阅读重点。
对付别的的内容，它只会使阅读更加愉快和流畅。
根据WCAG，最佳做法是将行高（行之间的间距）设置为相对付该类型大小的1.5相对值。
段落之间的间距也至少应比行间距大1.5倍，因此必须明确定义。

提示：行距不应超过2.0，由于它可能产生相反的效果并分散读者把稳力。

⑤ 复制版面

作为设计师，我们常常陷入过度设计布局的陷阱，以使它们看起来引人瞩目或独特，从而将可用性放在一边。
这便是为什么我们看到诸如文本的一部分之类的趋势在彩色或带纹理的背景上重叠图像或文本的趋势。
只要我们知道如何以及何时利用它们，我们仍旧可以享受个中的一些趋势。

当在彩色或带纹理的背景上利用文本时，我们须要确保它们之间的色彩比拟度足够高，同时在全体重叠区域都保持同等-意味着在副本下没有较浅和较暗的区域，也没有过多的细节滋扰。
较大的字体大小和较重的字体粗细也会提高比拟度。

专家提示：一如既往地“理解您的用户”。
时髦的布局并不适宜所有人。

2. 改进听觉体验

您可能在想，视觉设计如何影响听觉体验？因此，想象一下您正在与一个俱乐部的朋友交谈。
我敢打赌，您只能听见她说的话的一半，但是您可以通过看着她的嘴唇移动，肢体措辞和面部表情来保持对话的进行。

由于视觉效果的支持增强了模棱两可的声音，因此您终极可以理解它们。
在用户界面中，声音对付不同的人可能意味着各种各样的事情。
它们也很随意马虎在喧华的背景中丢失，因此最好以视觉提示来支持它们。

我们的目标该当是供应听觉和视觉提示的反馈，支持缺点，关照以及与干系和临近图形元素的重大交互。
我们还必须确保视觉线索保持足够长的活动韶光，以使人们能够看到和阅读，同时又不隐蔽任何主要的内容。

一个好的做法-不限于支持声音赞助技能，是在UI元素中添加描述性标签，并在图像中添加标题，以便于在屏幕阅读器中轻松导航。
为视频利用字幕是改进听力体验的另一种方法，对非母语人士也有帮助。

末了，我们不应该忽略声音是问题的情形，这便是为什么我们须要视觉替代的缘故原由。
有些人可能对特定的声音敏感，或者处于声音可能引起滋扰的情形下。
然后，这是一个好习气，让人们可以选择关闭声音而不必调低扬声器音量，从而使此功能清晰可见。

专家提示：避免利用不必要的自动播放声音和音乐，由于它们会打扰乃至惊吓别人。

3. 改进认知体验

1）知觉

① 视觉清晰度

清晰度是用户界面中的第一个也是最主要的属性。
成功的用户界面利用户能够识别和解释他们所看到的内容，理解产品的代价和所要采纳的行动，预测利用产品时会发生什么以及与产品成功交互。

形式跟随功能是一项原则，指出工具应反响其预期的功能或目的。
为了在用户界面中实现此目的，我们利用了附加功能，附加到UI的视觉提示/属性，以显示用户与其交互的可能办法。

支付能力取决于用户的身体能力、目标、过去的履历，当然还取决于他们认为可能的情形。
按钮该当看起来像按钮，就像链接、菜单标签、表单等一样。
利用清晰的符号/功能可以帮助用户识别或阐明界面，并轻松进行交互。

在用户界面中利用熟习的和已建立的设计办理方案将帮助用户预测结果并自傲地采纳行动。
因此，利用设计模式来办理常见问题是一个好习气，该设计模式是经由测试、优化和可重用的办理方案。

设计模式建立在过去的履历和可能性的根本上，并附加到特定的目标上。
为避免面前的问题，选择精确的设计模式该当是我们避免稠浊或压力大的交互的第一要务。

建立同等的视觉措辞是得到更全面界面的关键。
具有相同功能和/或主要性的重复交互式UI组件应始终以相同的办法外不雅观和操作。
因此，导航、按钮、链接、标签、缺点等元素应在全体产品中具有同等的样式，颜色和动画。

值得把稳的是，同等的视觉措辞不仅可以通过附加含义和减少视觉噪音来帮助互动，而且还可以增强产品的个性，提升品牌有名度，建立情绪联系和信赖。

② 层次构造

视觉层次构造是指图形元素的视觉重量及其排列办法，利用户可以轻松地探索和创造内容。
通过为页面元素分配不同的视觉权重，我们可以对内容进行分组并影响人们感知信息和浏览产品的顺序。

颜色是第一大关注焦点。
彩色元素将脱颖而出，因此在层次构造中位于较高位置。
通亮的颜色会更加突出，因此，考虑到这一点，我们该当仔细安排和分配颜色，以将眼睛勾引至精确的位置。

视觉元素的大小（例如印刷、按钮、图标和图像）在确定主要性方面险些与颜色一样强大。
较大的图形吸引了用户的把稳，并且显得很主要。
对付排版，明显不同的尺寸缩放比例可以帮助建立内容层次构造，并使内容扫描变得轻松而轻松。

赞助视觉层次构造的另一种方法是通过设计同等性和例外。
同等对齐，外不雅观相似，重复或相邻的元素给人的印象是它们是干系且同等主要的，而偏离元素以及不屈常的形状和有趣的纹理或样式将更加显著。
太多的设计例外会引起人们的关注，并会增加繁芜性，因此，谨慎利用它们是一个好习气。

专家提示：研究格式塔事理及其在UI设计中的运用将有助于我们理解视觉感知和分组以改进视觉层次。

③ 色彩运用

颜色不应该是传达信息或增加意义的唯一方法，但它仍旧有用且很有影响力，因此不应将其视为装饰性元素。
颜色具有含义，只管没有硬性规定，但是太多的颜色会导致信息疲倦，并且不一致地利用颜色会导致混乱。

避免利用太多颜色。
常日，三种颜色足以描述页面的所有主要视觉元素。
60–30–10规则可以帮助我们建立完美的和谐。
个中60％的彩色项目由原色组成，以创建统一的产品主题，具有30％的赞助颜色增强含义和/或创建引人瞩目的效果，以及10％的强调色，以补充和赞助主颜色和赞助颜色。

此外，我们须要确保为利用精确的色调。
除了美学，颜色还可以创造情绪和无意识的联系。
特定阴影的含义会因我们所处的文化和环境而异，并且颜色常日具有不同的含义-在西方天下，缺点是赤色，成功是绿色，信息是蓝色等。

专家提示：可以将我们自己的含义分配给颜色，只要它们不与既定规范重叠，并且我们在全体产品中使它们保持同等。

④ 符号学

符号学是对符号/图标及其含义的研究。
它着重于人们如何形成和解释这些含义，这取决于人们所看到的高下文。
在用户界面中，图标是可视措辞的一部分，用于表示功能、功能或内容。
符号学可以帮助我们设计立即被识别和理解的图像。

只管这些年来，我们已经开拓出具有大多数人接管和理解的含义的图标。
用户还习气于利用特定于平台的图标，并且可以轻松地进行阐明。
在可能的情形下，最好遵照这些既定的办理方案，以得到熟习和流畅的体验。

当然，在某些情形下，我们须要设计具有特定功能的自定义产品特定图标。
这些图标必须尽可能大略明了，以确保清晰度。
它们还该当具有同等的视觉样式，以传达其功能或与其他非功能性元素区分开。

末了，我们不应该仅仅依赖视觉隐喻来传达含义，由于某些关联可能并不那么明显。
如果图标须要标题来描述其含义，则可能不得当。
如果不愿定，请与实际用户一起测试我们的设计会有所帮助。

专家提示：图标不仅易于阐明，而且还可以具有多种含义。
因此，将标记与功能图标结合利用是一种很好的做法。

2）互动

影象

许多生理学实验表明，康健个体的处理能力非常有限。
在我们的短期影象中，我们大多数人均匀可以保留7项，详细取决于个人。
我们的大脑并未针对数字产品所需的抽象思维和数据影象进行优化，因此良好的设计会有所作为。
减少页面上可用选项和信息的数量，以及利用清晰的标题，面包屑和“退却撤退”选项来访问以前的内容，将帮助用户记住或提醒自己他们在哪里，打算做什么或要做什么。

交互元素上或附近的清晰可见副本将帮助用户在全体交互过程中保持知情和自傲。
例如，表单标签应始终可见，动作不应隐蔽在悬停后面，按钮应供应目标位置的高下文，并且各节的标题应明确。

专家提示：通过称为“块”的过程可以增加我们的短期影象和处理能力。
这是我们在视觉年夜将项目分组以形成更随意马虎记住的较大项目的地方。

3. 改进运动体验

1）菲茨法

菲茨法则为人类的运动和互动供应了一个模型。
它指出，将指针（光标或手指）快速移动到目标区域所需的韶光是其距目标的间隔除以目标大小的函数。
意味着较小的目标会增加互动韶光。

根据Fitts法则，我们旨在减小用户与目标之间的间隔，同时增加其尺寸。
该法律紧张适用于导航和按钮。
菜单和子菜单元素应在附近，而按钮，链接和分页应在较大区域上单击，以实现更快更准确的交互。

专家提示：根据可用性最佳实践，按钮/链接的最小尺寸为42×42像素（重击尺寸）。

2）褒奖：提高绩效

到目前为止，我们已经建立了原谅性设计，旨在让尽可能多的人访问并实现他们的目标或办理他们的问题，只管他们有自己的情形。

我们可能很幸运，可以利用最前辈的设备或超高速互联网，但是当我们的旗子暗记不太好时，我们会感到挣扎。
对付大多数人来说，老式设备和糟糕的互联网已成为常态，因此，为得到最佳性能而设计是一件大事。

极简主义是关键。
如果我们打算创造一种可以被尽可能多的人利用的产品，那么我们就该当摆脱不必要的统统。
图形，图像或动画是有代价的，还是增加了视觉噪音和加载韶光？如果是的话，那就必须走了。

图像优化是帮助提高数字产品性能的另一个标准。
通过将图像调度为得当的大小，然后通过诸如ImageOptim和TinyPNG之类的工具运行它们，可以节省宝贵的千字节和实际的加载韶光。