text.html

 
 <p class="zw">在几乎每一个项目的开始，我们都会问客户是如何看待他们自己的品牌的。我们称之为品牌个性采访,我们会这样问我们的客户：</p> 
 <p class="zw"><span style="font-family: Times New Roman,楷体_GB2312">“假设你的品牌是一个人。这个人可以是今天真实存在的，也可以是一个历史人物，还可以是某本书或某部电影中的虚构角色。事实上,他不一定是一个真实存在的人。”</span></p> 
 <p class="zw">这不是开玩笑，每次我都会拿摩根•弗里曼举例子。接下来我们问：</p> 
 <p class="zw"><span style="font-family: Times New Roman,楷体_GB2312">“你觉得品牌的哪个部分吸引你，以及这些特征和你想要如何表达你的品牌。”</span></p> 
 <p class="zw">人们常说，摩根•弗里曼迷人的地方在于他的可靠而且值得信赖。最后，我们要求人们描述出最能体现品牌的六个特征。与此同时，我们也会询问客户不想让品牌呈现出哪些特征。下面有一些特征是我们在访谈中使用的例子。</p> 
 <ul> 
  <li class="第2级无序列表">有趣但不搞笑</li> 
  <li class="第2级无序列表">机智但不滑头</li> 
  <li class="第2级无序列表">严肃但不沉闷</li> 
  <li class="第2级无序列表">专业但不刻板</li> 
  <li class="第2级无序列表">友好但不客套</li> 
  <li class="第2级无序列表">时尚但不浮夸</li> 
 </ul> 
 <p class="zw">我们使用这些问题的答案来在图片库中寻求合适的颜色。当我们第一次与别人合作时，可以通过安排研讨会来解决这些品牌个性的问题。如果是为一个小团队（六人）服务，我们会与每个人讨论上述问题；对于更大的团队，最好让他们分成三人或四人小组分别讨论，在会议结束时，我们把大家聚在一起对比大家的想法。</p> 
</blockquote> 
<h3 class="sigil_not_in_toc" id="nav_point_87">确定色调</h3> 
<p class="zw">2004年5月，我在博客上的第一篇文章里描述了一项技术——从一组核心颜色着手，创建拥有更多颜色的调色板。也就是我在前一节中介绍的，如主要色、次要色、中性色和强调色。</p> 
<p class="zw">自2004年以来发生了很多变化，令人难以置信，但我仍然在使用这项技术，几乎在每一个项目中都会用到。它非常简单。</p> 
<ul> 
 <li class="第1级无序列表">创建五个方块，并用你选择的其中一个颜色去填充它们。</li> 
 <li class="第1级无序列表">调整方块的透明度来稀释颜色强度。我用90%、75%、50%、25%和10%。</li> 
 <li class="第1级无序列表">用你选择的颜色创建灰暗的色调，并把这五个方块放在一致的黑色底部上。</li> 
 <li class="第1级无序列表">重复上面的动作，但是这次创建亮色调，并放置在白色方块的底部。</li> 
 <li class="第1级无序列表">重复每个颜色设置，创建你需要的所有色调。</li> 
</ul> 
<p class="图"><img alt="0613.tif" src="http://csdn-ebook-resources.oss-cn-beijing.aliyuncs.com/images/c4eeb42b07f54b42a9fd1568b8ec4b98/42.jpg"></p> 
<p class="zw">在STEM Learning公司的品牌设计规范中，四种颜色分别代表科学（Science）、技术（Technology）、工程（Engineering）和数学（Math）。在品牌设计规范下，我们设计了新网站，并提炼出了一个很酷的调色板，中性色和鲜艳色形成了很美的对比。</p> 
<p class="图"><img alt="0614.tif" src="http://csdn-ebook-resources.oss-cn-beijing.aliyuncs.com/images/c4eeb42b07f54b42a9fd1568b8ec4b98/43.jpg"></p> 
<p class="zw">STEM Learning品牌设计规范中的四个生动的颜色不能满足我们的需要，所以我们使用可靠的技术来丰富调色板，增加更多微妙的颜色。这种技术可能比较老旧，但事实证明，我们创造的调色板恰到好处。</p> 
<p class="图"><img alt="0615.tif" src="http://csdn-ebook-resources.oss-cn-beijing.aliyuncs.com/images/c4eeb42b07f54b42a9fd1568b8ec4b98/44.jpg"></p> 
<h3 class="sigil_not_in_toc" id="nav_point_88">测试颜色的可访问性</h3> 
<p class="zw">事实上，许多设计师直到项目的后期才做颜色对比和可访问性测试， 这让我很为难。对我来说，色彩对比和可访问性不应该是测试工作，而是设计任务。所以我们需要在设计过程中关注它们。使用Web设计风格指南最大的好处是，我们更早地关注可访问性，然后花更多时间纠正潜在的问题。</p> 
<p class="zw">当测试颜色的可访问性时，需要确保元素的背景色有足够的对比，并且里面有一些文本。我们可以改变对比度或选择互补颜色作为背景色和前景色。</p> 
<p class="zw">在国王学院医院项目的早期，背景色和前景色的对比度不足。</p> 
<p class="图"><img alt="0616.tif" src="http://csdn-ebook-resources.oss-cn-beijing.aliyuncs.com/images/c4eeb42b07f54b42a9fd1568b8ec4b98/45.jpg"></p> 
<p class="zw">幸运的是，我们在把颜色调色板交给客户之前，就测试了对比度，并调整了设计。</p> 
<p class="图"><img alt="0617.tif" src="http://csdn-ebook-resources.oss-cn-beijing.aliyuncs.com/images/c4eeb42b07f54b42a9fd1568b8ec4b98/46.jpg"></p> 
<p class="图题">我觉得在灰度下进行设计对于测试颜色的可访问性非常有效。这不仅让我们把注意力放在对比度上，还能让我们在排版布局时避免被干扰。</p> 
<p class="zw">有一些很棒的工具可以帮助我们检查颜色组合的对比度，我个人最喜欢的是Lea Verou对比度检查器。这款工具简单便捷，适合所有人使用。</p> 
<p class="图"><img alt="0618.tif" src="http://csdn-ebook-resources.oss-cn-beijing.aliyuncs.com/images/c4eeb42b07f54b42a9fd1568b8ec4b98/47.jpg"></p>