<?xml version="1.0" encoding="UTF-8"?> <rss
version="2.0"
xmlns:content="http://purl.org/rss/1.0/modules/content/"
xmlns:wfw="http://wellformedweb.org/CommentAPI/"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:atom="http://www.w3.org/2005/Atom"
xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
> <channel><title>笨活儿 &#187; 交互和UE</title> <atom:link href="http://blog.benhuoer.com/category/web-technology/interactive-and-ue/feed" rel="self" type="application/rss+xml" /><link>http://blog.benhuoer.com</link> <description>请用力生活</description> <lastBuildDate>Mon, 02 Jan 2012 16:05:26 +0000</lastBuildDate> <language>en</language> <sy:updatePeriod>hourly</sy:updatePeriod> <sy:updateFrequency>1</sy:updateFrequency> <generator>http://wordpress.org/?v=3.3.1</generator> <xhtml:meta xmlns:xhtml="http://www.w3.org/1999/xhtml" name="robots" content="noindex" /> <item><title>网页设计中的包容原则[ALA]</title><link>http://blog.benhuoer.com/posts/inclusion-principle-ala.html</link> <comments>http://blog.benhuoer.com/posts/inclusion-principle-ala.html#comments</comments> <pubDate>Mon, 27 Jul 2009 02:23:03 +0000</pubDate> <dc:creator>慵云</dc:creator> <category><![CDATA[交互和UE]]></category> <category><![CDATA[A List Apart]]></category> <category><![CDATA[Web标准]]></category> <category><![CDATA[可访问性]]></category> <category><![CDATA[用户体验]]></category> <guid
isPermaLink="false">http://blog.benhuoer.com/posts/inclusion-principle-ala.html</guid> <description><![CDATA[设计师的工作一直与“可视性（affordance）”有着密切的利害关系。这个词自唐纳德·诺曼（Donald Norman）的名著《设计心理学》[注1]后便声名鹊起，之后更是被阿兰·库伯（Alan Cooper）的《交互设计精髓》[注2]一书带入用户界面设计社区。 注1:&#160; The Design of Everyday Things, 直译为“日常用品的设计” 。“可视性”一词即沿用的本书中文版的翻译。 注2:&#160; About Face，交互设计名著，目前已出到第三版。 可视性允许我们一见到某事物就直截了当地知道如何与其交互。例如，当我们看到一扇门旁边的小按钮时，我们会马上意识到这是要用指头来按的；常识又告诉我们，一旦按下去就有声响发出，然后房间里的人就会知道“有人正站在门外呢”。把这一概念移植到视觉设计领域：当我们在网页上看到一个有3D样式的按钮时，我们立马就能明白这是一个可以用鼠标来“按”的东西。 可视性仅仅是成功的一半 设想这样一种情景：人们虽然能轻松懂得如何使用某件物品，但是却缺乏执行操作的能力。绝大部分坐轮椅的人都知道楼梯应该怎么用，但楼梯的“可视性”无助于他们爬上楼梯。这时，问题便出现了。 相反，便利店的宽大自动门对于有或没有特别通过需求的人都具可视性，并且能被二者轻松使用。我们把这种可视性和广泛亲和性[注3]（all-embracing accessibility）的结合称为“通用设计（universal design）”。在通用设计中，自觉的可视性——也就是对如何与物品进行交互产生的隐式理解——实则与用户执行操作的能力相辅相成。因此，通用设计天生具有亲和性（inherently accessible）。 注3:&#160; Accessibility，表示用户获取所需内容（结果）的容易程度。根据语境，可翻译成“可访问性”、“亲和性”、“可及性”，等等。下面译文中出现的这三个词都表示英语中的“Accessibility”。Accessible 又表示“无障碍的”、“可访问的”。 有些设计师觉得通用设计限制了他们的创新。他们争辩说，要满足通用性，就必须从“最底层的用户（neediest-user）”出发进行设计。要设计一部对老年人和青少年都方便使用的电话，那我们就必须先考虑老年人的需求：大的数字按键，大的显示屏等等；然而一旦我们这么做了，那些年轻的消费者，那些“潮人”们，可能就对这电话没有购买欲了。如此，设计的最终结果就是一件只对某特定社群有用的产品——我们达到了无障碍设计（accessible design）的要求，但不能算是通用设计。设计的可及性非常重要，却无法通过一种方式就满足所有人。因此，明智的做法是，在任何时候都尽量争取可行的通用设计，而只在必要的时候专注于无障碍设计。 无障碍设计的困境 这种差别在Web设计中意味着什么？“通用设计”和“无障碍设计”在什么情况下会被广泛认为是对等的？无障碍设计元素包括视频的说明字幕（caption）和音频文件的文字副本（text transcription）。它们被用作原始内容必需的替代品。另一方面，结构化标记（structural markup）则是一个实现通用设计的有力技巧。使用h1和h2这样的实义标签来按照逻辑关系组织内容，有助于形成可访问性，因为读者总是习惯在阅读文字前先扫描标题。设计师能创建独特的标题样式，却是由用户个人来决定要不要接受设计师的想法。他们大可以关闭图片显示或者在运行过程中替换掉你的样式。 话说至此，对很多设计师来说，因通用设计产生的交互过程的不可预见性会带来很多麻烦。他们怨声载道——“我完全不知道屏幕阅读器是如何工作的”，诸如此类。作为设计师，我们始终没能完全了解可访问性或者通用性究竟意味着什么。要改变局面，就必须先改变我们看待任务的方式。 不得要领 网页设计师通常喜欢在页面底部加一些文字和一个到第508条[注4]的小超链接来宣告其网页的可访问性。当然，这也是一项符合法律精神的实践。他们的说明大概都是这样写的：“我们尽力让本站能无障碍访问。我们会持续测试和修改站点的可访问性。如果您在访问任何内容时遇到困难，请尽管联系我们。”但只要稍微做点可访问性测试就会发现，很多站点拥有者和开发者都只是想靠声明的后半部分来轻松逃脱入狱的危险[注5]。 注4:&#160; Section 508，美国推行的保障残障人士能够有效使用电子和信息产品的法律。台湾也有类似的法案，请参看维基百科网页亲和力条目。 注5:&#160; 没有达到无障碍访问要求的站点会受到法律制裁，作者在此讽刺部分开发者对可访问性不够重视。 网站开发者们有时候以为，采用基于标准的开发原则，利用外部CSS和基于DOM的浏览器脚本技巧分离表现层和行为层，再为图片加上alt属性，就算达到第508条要求了。除非遇到问题的访客找上门来，他们是不会想在网站的可访问性上多花精力的。这里的逻辑似乎很公平：好的商业实践总是将各种需求按照项目约束条件和预期投资回报率（ROI）进行优先级排序。尽管规范的编码有助于达到无障碍要求，也必须有正确的施行意图才会产生效用。 以alt属性为例。所有正规的HTML编辑器和验证工具都会指出缺少alt替换文本的错误。大部分开发者也会纠正这个错误——不管是出于通过验证的目的还是为了获得可访问性。不过，通过验证并不等同于获得了可访问性。W3C的HTML5规范(草案) 明确指出了这一点，并详细示范了如何撰写基于功能和上下文的替换文本。你也许要反驳说大部分开发者都了解这一区别，但很多网站的表现恰好说明事实并非如此。 可访问性：分寸之末 就在不久前，一个流行的Web开发论坛上的一篇帖子引起了我的注意。帖子题目是“在&#60;img&#62;标签里使用alt和使用title的对比，Firefox里的alt不起作用”。一些回复让我震惊了，比如下面这条（不是因为他蹩脚的语法）： Alt被要求去验证，但是除非是政府网站，并没必要使用alt标签。除非信息实在重要，并且相等的信息发挥了作用，这作用到底是什么也不重要了…… Alt attributes are required to validate, but unless it is some [...]<div
class="related-post"> <strong>你应该也会喜欢：</strong><ol><li><a
href="http://blog.benhuoer.com/posts/taking-the-guesswork-out-of-design-ala.html" rel="bookmark">拒绝臆想，让我们脚踏实地做设计！[ALA]</a></li></ol></div> ]]></description> <content:encoded><![CDATA[<p><img
style="display: block; float: none; margin-left: auto; margin-right: auto" alt="The Inclusion Principle" src="http://www.alistapart.com/d/the-inclusion-principle/inclusion.jpg" /></p><p>设计师的工作一直与“可视性（<a
href="http://en.wikipedia.org/wiki/Affordance" target="benhuoer-new">affordance</a>）”有着密切的利害关系。这个词自唐纳德·诺曼（<a
href="http://en.wikipedia.org/wiki/Donald_Norman" target="benhuoer-new">Donald Norman</a>）的名著《<cite><a
href="http://www.douban.com/subject/1288844/" target="benhuoer-new">设计心理学</a></cite>》<sup>[注1]</sup>后便声名鹊起，之后更是被阿兰·库伯（<a
href="http://en.wikipedia.org/wiki/Alan_Cooper" target="benhuoer-new">Alan Cooper</a>）的《<cite><a
href="http://www.douban.com/subject/3279105/" target="benhuoer-new">交互设计精髓</a></cite>》<sup>[注2]</sup>一书带入用户界面设计社区。</p><p
class="no-indent"><em><strong>注1:</strong>&#160;<cite>The Design of Everyday Things</cite>, 直译为“日常用品的设计” 。“可视性”一词即沿用的<a
href="http://www.douban.com/subject/1288844/" target="benhuoer-new">本书中文版</a>的翻译。 <br
/><strong>注2:</strong>&#160;<cite>About Face</cite>，交互设计名著，目前已出到第三版。</em></p><p>可视性允许我们一见到某事物就直截了当地知道如何与其交互。例如，当我们看到一扇门旁边的小按钮时，我们会马上意识到这是要用指头来按的；常识又告诉我们，一旦按下去就有声响发出，然后房间里的人就会知道“有人正站在门外呢”。把这一概念移植到视觉设计领域：当我们在网页上看到一个有3D样式的按钮时，我们立马就能明白这是一个可以用鼠标来“按”的东西。</p><p> <span
id="more-1749"></span><br
/><h3>可视性仅仅是成功的一半</h3><p>设想这样一种情景：人们虽然能轻松懂得如何使用某件物品，但是却缺乏执行操作的能力。绝大部分坐轮椅的人都知道楼梯应该怎么用，但楼梯的“可视性”无助于他们爬上楼梯。这时，问题便出现了。</p><p>相反，便利店的宽大自动门对于有或没有特别通过需求的人都具可视性，并且能被二者轻松使用。我们把这种可视性和广泛亲和性<sup>[注3]</sup>（all-embracing accessibility）的结合称为“<a
href="http://zh.wikipedia.org/wiki/%E9%80%9A%E7%94%A8%E8%A8%AD%E8%A8%88" target="benhuoer-new">通用设计</a>（<a
href="http://en.wikipedia.org/wiki/Universal_design" target="benhuoer-new">universal design</a>）”。在通用设计中，自觉的可视性——也就是对如何与物品进行交互产生的隐式理解——实则与用户执行操作的能力相辅相成。因此，通用设计天生具有亲和性（inherently accessible）。</p><p
class="no-indent"><em><strong>注3:</strong>&#160; Accessibility，表示用户获取所需内容（结果）的容易程度。根据语境，可翻译成“可访问性”、“亲和性”、“可及性”，等等。下面译文中出现的这三个词都表示英语中的“Accessibility”。Accessible 又表示“无障碍的”、“可访问的”。</em></p><p>有些设计师觉得通用设计限制了他们的创新。他们争辩说，要满足通用性，就必须从“最底层的用户（neediest-user）”出发进行设计。要设计一部对老年人和青少年都方便使用的电话，那我们就必须先考虑老年人的需求：大的数字按键，大的显示屏等等；然而一旦我们这么做了，那些年轻的消费者，那些“潮人”们，可能就对这电话没有购买欲了。如此，设计的最终结果就是一件只对某特定社群有用的产品——我们达到了无障碍设计（accessible design）的要求，但不能算是通用设计。设计的可及性非常重要，却无法通过一种方式就满足所有人。因此，明智的做法是，在任何时候都尽量争取可行的通用设计，而只在必要的时候专注于无障碍设计。</p><h3>无障碍设计的困境</h3><p>这种差别在Web设计中意味着什么？“通用设计”和“无障碍设计”在什么情况下会被广泛认为是对等的？无障碍设计元素包括视频的说明字幕（caption）和音频文件的文字副本（text transcription）。它们被用作原始内容必需的替代品。另一方面，结构化标记（structural markup）则是一个实现<strong>通用设计</strong>的有力技巧。使用<code>h1</code>和<code>h2</code>这样的实义标签来按照逻辑关系组织内容，有助于形成可访问性，因为读者总是习惯在阅读文字前先扫描标题。设计师能创建独特的标题样式，却是由用户个人来决定要不要接受设计师的想法。他们大可以关闭图片显示或者在运行过程中替换掉你的样式。</p><p>话说至此，对很多设计师来说，因通用设计产生的交互过程的不可预见性会带来很多麻烦。他们怨声载道——“我完全不知道屏幕阅读器是如何工作的”，诸如此类。作为设计师，我们始终没能完全了解可访问性或者通用性究竟意味着什么。要改变局面，就必须先改变我们看待任务的方式。</p><h3>不得要领</h3><p>网页设计师通常喜欢在页面底部加一些文字和一个到<a
href="http://www.1sight.cn/index.php/archives/432" target="benhuoer-new">第508条</a><sup>[注4]</sup>的小超链接来宣告其网页的可访问性。当然，这也是一项符合法律精神的实践。他们的说明大概都是这样写的：“我们尽力让本站能无障碍访问。我们会持续测试和修改站点的可访问性。如果您在访问任何内容时遇到困难，请尽管联系我们。”但只要稍微做点可访问性测试就会发现，很多站点拥有者和开发者都只是想靠声明的后半部分来轻松逃脱入狱的危险<sup>[注5]</sup>。</p><p
class="no-indent"><em><strong>注4:</strong>&#160; <a
href="http://section508.gov/" target="benhuoer-new">Section 508</a>，美国推行的保障残障人士能够有效使用电子和信息产品的法律。台湾也有类似的法案，请参看维基百科<a
href="http://zh.wikipedia.org/wiki/%E7%B6%B2%E9%A0%81%E8%A6%AA%E5%92%8C%E5%8A%9B" target="benhuoer-new">网页亲和力</a>条目。 <br
/></em><em><strong>注5:</strong>&#160; <a
href="http://section508.gov/" target="benhuoer-new"></a>没有达到无障碍访问要求的站点会受到法律制裁，作者在此讽刺部分开发者对可访问性不够重视。</em></p><p>网站开发者们有时候以为，采用基于标准的开发原则，利用外部CSS和基于DOM的浏览器脚本技巧分离表现层和行为层，再为图片加上<code>alt</code>属性，就算达到第508条要求了。除非遇到问题的访客找上门来，他们是不会想在网站的可访问性上多花精力的。这里的逻辑似乎很公平：好的商业实践总是将各种需求按照项目约束条件和预期投资回报率（ROI）进行优先级排序。尽管规范的编码有助于达到无障碍要求，也必须有正确的施行意图才会产生效用。</p><p>以<code>alt</code>属性为例。所有正规的HTML编辑器和验证工具都会指出缺少alt替换文本的错误。大部分开发者也会纠正这个错误——不管是出于通过验证的目的还是为了获得可访问性。不过，通过验证并不等同于获得了可访问性。<a
href="http://www.w3.org/TR/html5/embedded-content-0.html#alt" target="benhuoer-new">W3C的HTML5规范(草案)</a> 明确指出了这一点，并详细示范了如何撰写基于功能和上下文的替换文本。你也许要反驳说大部分开发者都了解这一区别，但很多网站的表现恰好说明事实并非如此。</p><h3>可访问性：分寸之末</h3><p>就在不久前，一个流行的Web开发论坛上的一篇帖子引起了我的注意。帖子题目是“在&lt;img&gt;标签里使用alt和使用title的对比，Firefox里的alt不起作用”。一些回复让我震惊了，比如下面这条（不是因为他蹩脚的语法）：</p><blockquote><p>Alt被要求去验证，但是除非是政府网站，并没必要使用alt标签。除非信息实在重要，并且相等的信息发挥了作用，这作用到底是什么也不重要了……</p><p>Alt attributes are required to validate, but unless it is some sort of gov’t website they are not required to use alt tags unless the information is vital and the equal information act, or whatever that act is called.</p><p>（囧，确实蹩脚，根本不知道他到底想说个啥……）</p></blockquote><p>就我在论坛上的回复，我提到了国家盲人联合会（National Federation of the Blind, abbr. <abbr>NFB</abbr>）对Target公司的<a
href="http://www.nfbtargetlawsuit.com/">集体诉讼</a><sup>[注6]</sup>。最终，Target支付了大量金钱，并且同意对他们的网页开发者进行昂贵的关于可访问性的强化培训。</p><p
class="no-indent"><em><strong>注6:</strong>&#160; Target是一家零售企业，在美国各地都有连锁店。NFB控告他们的网站不方便盲人获取信息，并且让盲人无法实现线上购物。关于alt和title的问题，另外推荐Rexsong的<cite><a
href="http://blog.rexsong.com/?p=6024" target="benhuoer-new">使用Alt提升可访问性</a></cite>一文。</em></p><p>如果一家《财富》500强企业都不能正确处理网页可访问性，我们就能想象小公司要达到无障碍需求是多么的困难。由于下列原因，网页的可访问性总是获得较低的优先级：</p><ol><li>我们也想实现无障碍访问，但是我们只是一个很小的团队。</li><li>话说回来，也没人真的抱怨过访问障碍。</li><li>无障碍网页缺少审美上的乐趣，限制了我们的设计选择。</li><li>我们真的不知道该怎样让我们的网站/Web应用变得对残障人士无障碍。</li><li>我们的目标用户不包括残障人士。</li></ol><p>就上面的几点，只有第四条才算是一个网站或Web应用出现可访问性问题的正当理由。而这一问题亦是可以解决的——给网页设计师和开发者少量的循序渐进的可访问性培训，然后持续关注这一问题。至于其他几点…… 只需一点思维上的转变即可。这一转变很小，却将意义重大。</p><h3>运用包容原则，提升可访问性的地位</h3><p>让我们来探索<em> 包容原则 </em>的奥妙。它允许我们忘记在社交行为中根深蒂固的那种“他们”和“我们”之间的对立。聚焦于包容能够将无障碍/通用设计的争论从上述利益冲突中解放出来，让我们拥抱一种更宽阔、更接近自然的设计哲学。最重要的一点，聚焦包容也帮助我们了解到，我们不仅是为了别人才重视可访问性，也是为我们自己好。</p><p>来看一下来自包容性研究机构（<a
href="http://www.instituteforinclusion.org/" target="benhuoer-new">Institute for Inclusion</a>）的定义：</p><blockquote><p>包容行为是指平衡且尊重众人不同才能、信仰和生活方式之独特性的实践和行为。[…] 当某人被定义为某个社群的一员，人们即被他们对这个特定群体的理解和念想所限制。而包容则是在个人层次和群体层次均接受相互之间的类似点和不同点，以达到众人齐心协力之目的。</p><p>Inclusive behaviors are those practices and behaviors that leverage and honor the uniqueness of people’s different talents, beliefs, and ways of living. [...] When one is defined by the concept of a group, people can be limited by their knowledge or beliefs about that particular group. Instead, inclusion embraces similarities and differences at the individual and group levels for the attainment of the common endeavor.</p></blockquote><p>此研究机构亦对包容的核心意义（key elements）做如下探讨：</p><blockquote><p>通过在个人、群体和组织机构层面创建与维续条件来蕴育平等、自主赋权、自我知觉和胜任感，从而认知与支撑全人类的内在价值。</p><p>Recognizing and supporting the intrinsic value of all human beings by creating and sustaining conditions that foster equity, empowerment, awareness and competence at the personal, group and organizational levels.</p></blockquote><p>只要我们敞开胸怀拥抱包容原则，我们就很难再把他人看作是一个特定群体（比如“视觉障碍用户”），于是也不再排斥他们。如果我们肯放弃传统的“我/他”思想，我们就不会再为逃避可访问性找任何借口。他人的需求变成了我们自己的需求。有了包含原则，我们将不再忽视网页可访问性的要求。在我们眼中，可访问性成了一个通过接受彼此异同实现自主赋权的机会（a chance to create empowerment by embracing our similarities and differences）。</p><h3>现实世界的一应包容</h3><p>这样的讨论似乎并无必要——对可访问性的理论解剖。你可能会说注重包容性并不会立即解决你平常遇到的网页设计问题。不过别忘了：重视通用设计能让我们利用好相似性，实现无障碍设计能让我们处理好相斥性。一些“通用的”技巧和要素如下：</p><ul><li>为图像添加恰当的<code>alt</code>属性。<cite><a
href="http://www.w3.org/TR/WCAG-TECHS/H37.html" target="benhuoer-new">W3C的WCAG 2.0技术规范</a></cite> 清楚明确地解释了这一点。</li><li>使用多级标题（<code>h1</code>, <code>h2</code>,等等）结构化页面内容。</li><li>如《<cite>WCAG 2.0技术规范</cite>》示范的那样正确使用<a
href="http://www.w3.org/TR/WCAG20-TECHS/H51.html" target="benhuoer-new">简单数据表</a>， <a
href="http://www.w3.org/TR/WCAG20-TECHS/H43.html" target="benhuoer-new">复杂数据表</a>，以及<code>th</code>元素。</li><li>为表单的输入域创建文本标记（label）。这在<cite><a
href="http://www.webaim.org/techniques/forms/controls.php" target="benhuoer-new">WebAIM: Creating Accessible Forms</a></cite>（创建无障碍表单）一文中已有描述。</li></ul><p>当我们学会普遍运用这些技巧时，它们就成为了我们的“第二天性”（second nature），我们架设网站时的思维模型（mental model）。最终，我们不会觉得这是所谓的可访问性技巧，而开始把它们当做固有的、普遍的Web技巧（innate, universal web techniques）。我们将会经历从运用范例到一应设计（inclusive design）<sup>[注4]</sup>的转变。</p><p
class="no-indent"><em><strong>注4:</strong>&#160; inclusive design，也被翻译为“和合设计”、“包容性设计”。“一应”是指所有一切，一应设计即包含一切的设计。</em></p><p>这样做既能减少用户的麻烦，也能减轻开发者的负担，因为剩下的可访问性任务已经被更好地独立出来。这就为实现完全无障碍的网页打好了坚实的基础，开发者也能更加客观地掂量如何提供额外的亲和效果（provide a more objective estimate for additional accessibility efforts）。</p><p>如果说无障碍设计和通用设计更多地是以结果为导向的，那么这一新的<strong>一应设计</strong>的模型就显然是以过程为导向的。有一点至关重要：设计师必须认同（indentify with）项目的可访问性需求。没有认同，就没有热情；没有热情，我们就又走回老路——将可访问性任务视为分寸之末。</p><h3>让我们大踏步向前</h3><p>现在来看看如何将包容性原理融入实践。试试看将其应用到那个针对可访问性的反对意见列表中：</p><ol
class="big-list"><li><em>我们也想实现无障碍访问，但是我们只是一个很小的团队。</em> <br
/>要踏上无障碍设计之路并不需要多大付出。WebAIM.org 提供了一份很好的<a
href="http://webaim.org/resources/quickref/" target="benhuoer-new">快速参考</a>（英文）。如果你已经知道一些基本的东西，请与团队分享你的可访问性知识。例如，听到其他开发者在讨论Ajax时，告诉他们关于无障碍Ajax的信息。利用诸如Word或PDF的非HTML格式，与团队成员分享核对清单（checklists），你会发现它们将带来很大帮助。（<a
href="http://www.hhs.gov/web/508/index.html" target="benhuoer-new">美国卫生及服务部</a>网站上有很好的资源。[可惜没有中文版的]）</li><li><em>话说回来，也没人真的抱怨过访问障碍。</em> <br
/>有人在抱怨的——只是没当着你的面罢了。上一次你遇到一件很难用的产品却没有写信骚扰厂家是什么时候？如果你的网站有可访问性问题，不满和抱怨无疑是与设计共生共存的。抓住机遇，投身变革！</li><li><em>无障碍网页缺少审美上的乐趣，限制了我们的设计选择。</em> <br
/>恕我不敢苟同：比如尼克·戴（Nick Day），英国聚焦无障碍（<a
href="http://www.accessibilityinfocus.co.uk/" target="benhuoer-new">Accessibility in Focus</a>）奖的获得者，他的网站<a
href="http://www.english-in-chester.co.uk/" target="benhuoer-new">English in Chester</a>的外观设计就非常出彩。多看看别人怎么做的吧，互联网不就是用来帮助我们学习别人的么。</li><li><em>我们真的不知道该怎样让我们的网站/Web应用变得对残障人士无障碍。</em> <br
/>可访问性对于复杂的网站或者富互联网应用（rich internet application , abbr. RIA）来说会比较难以实现。但如果你真的拿到一个复杂的、运用了多媒体的丰富应用（multimedia-rich application），那就拿出一点创意来。在附近找一个特殊教育学校，请一名残障学生志愿者为你演示他们是如何与电脑交互的；调查研究其他为影片添加注释的方式，比方说<a
href="http://dotsub.com/" target="benhuoer-new">dotSUB</a>（一个基于wiki概念的影音翻译网站）。</li><li><em>我们的目标用户不包括残障人士。</em> <br
/>如果事实果真如此，那就专注于你的目标客户群。你自己是否亦算其一？想想看：你可一直都是你项目的利害关系人（stakeholder）。那么，认真考虑你的需求，为了自己，加点猛料。猜猜看，然后结果会怎样？</li></ol><h3>倾听你自己</h3><p>要如何才能快速入门包容原则？把你的电脑屏幕想象成《2001太空漫游》中的大黑石<sup>[注7]</sup>，然后开始你的冒险：在脑海里构建你的站点。接下来，更进一步，想象你正用耳朵听你的站点，而不是盯着它看。这有助于你暂时放弃把你的网站当成一本书来对待。有时候大家都遗忘了一点，网站其实是一种形象而生动的媒体（colloquial medium），其表现力与其外显形式是不可分割的（its narrative is not inseparable from its form）。</p><p>你的网站听起来如何？禁用掉样式表，看一下你面前是什么。突然之间，你就变得和使用屏幕阅读器的人一模一样了——你们有着同样的需求。获取最高等级的可访问性是很有必要的，并且应该成为你日常设计活动的一部分，因为这样你就不再需要为自己找辩护的理由。拥抱包容原则，你的网站将成为下一个可访问性的典范。</p><p
class="no-indent"><em><strong>注7:</strong>&#160;<cite>2001: A Space Odyssey</cite>，一部1968年拍摄的科幻电影。讲述2001年人们寻找黑石根源的故事。黑石在片中的概念相当于激发人们智慧的神秘物。</em></p><p
align="right"><em>插图绘制： </em><a
href="http://www.alistapart.com/authors/c/kevincornell" target="benhuoer-new">Kevin Cornell</a><em></em></p><h4>关于作者</h4><p
class="no-indent"><img
style="margin: 0px 10px 0px 0px; display: inline" alt="Margit Link-Rodrigue" align="left" src="http://www.alistapart.com/pix/authors/uploads/avatar_124101.jpg" /> 德国出生的 <strong>Margit Link-Rodrigue</strong> 是一名用户界面设计师，在她自选的Web前哨战Red Stick工作和生活，这地方另一个更著名的名字是巴吞鲁日（Baton Rouge，路易斯安那州首府）。她的格言“浏览器是你的第一个用户”保证了她的工作根基牢靠。她在她的网站<a
href="http://www.vanillacloud.com" target="benhuoer-new">vanillacloud.com</a>上几经艰辛，体会到原来要写好博客也不是件容易的事。</p><h4>© 版权声明</h4><blockquote><p>Source:&#160; <a
href="http://www.alistapart.com/articles/the-inclusion-principle/">The Inclusion Principle</a> by <a
href="http://www.alistapart.com/authors/l/mrodrigue">Margit Link-Rodrigue</a></p><p>Translated with the permission of <a
href="http://www.alistapart.com/">A List Apart Magazine</a> and the author.</p><p>Translator: <a
href="http://blog.benhuoer.com/">Benhuoer</a>.</p><p>译文原文：<a
href="http://blog.benhuoer.com/posts/inclusion-principle-ala.html">网页设计中的包容原则</a></p></blockquote><p><strong>任何网站或个人</strong>转载本文均需依原样保留本声明。</p><h4>笨活儿译后感</h4><p>这篇文章的翻译用了我三天时间（当然，期间也有干其他事啦）。太专业了，术语很多。翻译完，我整理的生词有30多个，有些句子也特别不好理解，逻辑太跳跃，译成中文后感觉不够连贯，希望能有高手忙我<a
href="http://www.yeeyan.com/articles/view/benhuoer/51871/dz">眉批找茬</a>一下。</p><p>其实作者的主要观点无外乎“把你自己也当做用户”。考虑网页可访问性时，要胸怀用户，尤其是残障用户（包括视觉障碍和听觉障碍）。中国的网页无障碍设计发展得很差（看一下<a
href="http://www.mikkolee.com/207">百度盲道</a>就知道了），《<a
href="http://www.gov.cn/banshi/2005-08/04/content_20235.htm" target="_blank">残疾人保障法</a>》也已经近20年没有修订过了。想来残障人士访问互联网应该是很恼火的一件事。其实本来就像作者说的那样，只要“胸怀天下”，可访问性基本上是举手之劳。</p><div
class="related-post"> <strong>你应该也会喜欢：</strong><ol><li><a
href="http://blog.benhuoer.com/posts/taking-the-guesswork-out-of-design-ala.html" rel="bookmark">拒绝臆想，让我们脚踏实地做设计！[ALA]</a></li></ol></div><div
style="border-top:dashed 1px #ccc;  border-bottom:dashed 1px #ccc;padding:0.3em 0;">分类于：<a
href="http://blog.benhuoer.com/category/web-technology/interactive-and-ue" title="查看 交互和UE 中的全部文章" rel="category tag">交互和UE</a>        标签: <a
href="http://blog.benhuoer.com/tag/a-list-apart" rel="tag">A List Apart</a>, <a
href="http://blog.benhuoer.com/tag/web%e6%a0%87%e5%87%86" rel="tag">Web标准</a>, <a
href="http://blog.benhuoer.com/tag/%e5%8f%af%e8%ae%bf%e9%97%ae%e6%80%a7" rel="tag">可访问性</a>, <a
href="http://blog.benhuoer.com/tag/%e7%94%a8%e6%88%b7%e4%bd%93%e9%aa%8c" rel="tag">用户体验</a></div><p><small>©2009 <a
href="http://blog.benhuoer.com" target="_blank">笨活儿</a> | <a
href="http://blog.benhuoer.com/posts/inclusion-principle-ala.html" target="_blank">永久链接</a> | <a
href="http://blog.benhuoer.com/posts/inclusion-principle-ala.html#comments" target="_blank">已经有12条评论了</a> | <a
href="http://9.douban.com/recommend/?url=http://blog.benhuoer.com/posts/inclusion-principle-ala.html&title=网页设计中的包容原则[ALA]&v=1&n=1" target="_blank">推荐到豆瓣</a> <br/> </small></p>]]></content:encoded> <wfw:commentRss>http://blog.benhuoer.com/posts/inclusion-principle-ala.html/feed</wfw:commentRss> <slash:comments>12</slash:comments> </item> <item><title>拒绝臆想，让我们脚踏实地做设计！[ALA]</title><link>http://blog.benhuoer.com/posts/taking-the-guesswork-out-of-design-ala.html</link> <comments>http://blog.benhuoer.com/posts/taking-the-guesswork-out-of-design-ala.html#comments</comments> <pubDate>Tue, 16 Jun 2009 10:28:29 +0000</pubDate> <dc:creator>慵云</dc:creator> <category><![CDATA[交互和UE]]></category> <category><![CDATA[网页设计]]></category> <category><![CDATA[A List Apart]]></category> <category><![CDATA[用户体验]]></category> <guid
isPermaLink="false">http://blog.benhuoer.com/?p=1498</guid> <description><![CDATA[好的创意为成功的网站带来生命力。不过，有时候那些有创意的点子或解决方案更像是单凭臆想完成的工作——而臆想又往往是件很危险的事。那么，设计师该如何告诉客户，其实自己用的是脚踏实地的策略，并且目标效果也最为恰当呢？下面的练习将助你了解如何探讨和记录设计的方方面面，以帮助客户消除对你创意的疑虑，鼓励他们也参与到设计过程中来。 确定明晰目标 有些人总认为自己很了解建某个站点的目的是什么，却拒绝建立起直接的、可量化的目标。模棱两可的目标叙述迫使客户自行推断，而客户一般都会把事情往好的方向想，过高的期待又往往带来失望——结果，你们之间好不容易建立起来的信任就毁掉了。像“卖更多东西”、“提高曝光率”这种目标还是少来为妙，它们太模糊了，几乎没有指导意义。 改进的验收准则练习（modified acceptance criteria exercise）是我发现用于建立清晰有力目标的最简单有效的工具。精明的开发者利用验收准则来说明为什么要执行某项任务，以及他们该如何融入大图景之中。只需做一点小优化，你就能完美地捕捉到设计目标。 样例需求: 我们想要重新设计我们的网站，因为我们需要更多流量和一个新形象，希望我们成为行业里更受尊敬的企业。 样例目标模板: 我们希望 __________ 因为____________ 然后 ___________. 样例目标: 我们希望把访问量提高20%，因为我们想有更高曝光率，然后我们就能每个月新建立八条客户渠道。 我们希望改变现在的形象，因为我们想让客户觉得更亲切，然后我们才敢把服务费提高10%。 我们希望每个月能写四篇行业相关的文章，因为我们想为这个行业做贡献，然后我们就能每个月找到两个合作伙伴。 请思考，区分开“手段”、“原因”、“结果”的过程是如何让项目持有者的目标变得明晰的，而且这一过程还能解释他们为什么有这些目标，又打算怎样达到目标。为设计确立验收准则是挖掘出更深层次的可能还不为所知的需求的极佳方式。它帮助设计师和项目持有者做出更好的决定，以免将来设计执行过程中遭遇“不速之情景”。请修正目标，直至项目相关各方都同意并理解这些目标。 额外提醒：多建立几个目标，以方便你自己捕获二级甚至三级目标，不过千万不要让事情失去控制——所有网站都只需要一小撮高水平目标就够了。 组织页面 人们一般都只热爱那些不用他们多做思考就能成事儿的站点。用户的精力是用来解决他们自己的问题的，而不应该浪费在搞清楚网站怎么用上面。 卡片分类是安排网站内容的好方法。要利用卡片分类，列出你网站的所有页面，把它们写在一些索引卡上。然后，把所有卡片铺到桌子上，移动卡片位置，直至所有的目录和子目录归档方式都最为有理有据。 如果你没法亲自做卡片分类，或者你们团队没有时间做这件事，那你们还可以试试利用数据表在线商讨。以下是使用一些虚拟数据在Google Docs里创建的一家新西兰投资公司网站的示例。 如果你的项目是针对某网站的再设计，那你应该先看看该站点的访问统计数据，找出哪些页面获得的流量更多，哪些更少。这么做的好处是能推断出设计的内容在哪部分还不够，在哪部分又太过了。然后，紧缩或合并类似页面，简化复杂页面。 即使已经过了正式的设计过程，好的卡片分类实践也能大大提高一个网站的可用性和内容传递效率。这是一种让网站保持关联性和实效性的聪明训练。要了解更多关于这方面的信息，请参见 用框线图 实现卡片分类（英文）， Usability.gov上的卡片分类介绍（英文），或者阅读这本关于卡片分类的专著（英文）。 额外提醒：让不熟悉公司业务的人来帮忙进行卡片分类，有助于发现大众成见，获得意想不到的反馈 铺展页面 接下来，我们需要深入理解设计的视觉优先顺序。这里我们采用注意力地图(Attention Map)并且做一点算术。 注意力地图就是为页面指定一系列目标，并且为每个目标分配一个吸引力指数。总点数不要太多，足够分配就好，这样点数之间才能更容易对比和互相参考；但也不要太少，以免分配出太多过于接近的点数。这么做的目的是让你深入理解各个目标之间的联系，从而确立稳妥的内容层次。 样例点数分配： 四个目标，一共分配15点 样例结果： 服务介绍：7点 带来的益处：4点 行业文章：2点 相关新闻：2点 比起简单的优先级列表，注意力地图更为高效，因为它还直观反映了各个目标在页面中占据多少空间。由于“服务介绍”的点数比“益处”所占点数要高3点（几乎是两倍了），所有你能肯定“服务介绍”需要吸引大量更多注意力。 用草图表达满足目标、适合内容组织、符合注意力地图的设计选项时，应当简明直率，且富有战略。说不定这样你就能少很多搜索枯肠的烦恼。 额外提醒: 完成之后，试试反转草图，或者从镜子里面看它，看看还是否能用。为你自己的草图挑刺儿（包括那奇怪的镜像草图），能帮你想出一系列新点子。 开发个性 强健的原型(archetype)能建立起一条直接而充满力量的情感纽带。所谓原型是指一系列性格特征和行为特点，常见于一群说共同语言或有着共同历史的族群。每一原型都有其强势、弱点、天赋和畏惧。当你无所顾忌地运用这人性特征的方方面面时，人们将从内心深处对你的设计产生共鸣。这有助于强化记忆和建立信任。 Margaret Mark 和 Carol S. Pearson [...]<div
class="related-post"> <strong>你应该也会喜欢：</strong><ol><li><a
href="http://blog.benhuoer.com/posts/inclusion-principle-ala.html" rel="bookmark">网页设计中的包容原则[ALA]</a></li><li><a
href="http://blog.benhuoer.com/posts/fixed-fluid-elastic-css-layout-comparement.html" rel="bookmark">固定 vs. 流动 vs. 弹性：哪种布局更适合你？[SM]</a></li></ol></div> ]]></description> <content:encoded><![CDATA[<p>好的创意为成功的网站带来生命力。不过，有时候那些有创意的点子或解决方案更像是单凭臆想完成的工作——而臆想又往往是件很危险的事。那么，设计师该如何告诉客户，其实自己用的是脚踏实地的策略，并且目标效果也最为恰当呢？下面的练习将助你了解如何探讨和记录设计的方方面面，以帮助客户消除对你创意的疑虑，鼓励他们也参与到设计过程中来。</p><p><span
id="more-1498"></span></p><p><img
style="float: right;" src="http://i27.photobucket.com/albums/c156/jyyjcc/benhuoer-blog/take-guesswork-out/guesswork.jpg" alt="让天马行空的猜想付诸设计实践" width="270" height="532" /></p><h2>确定明晰目标</h2><p>有些人总认为自己很了解建某个站点的目的是什么，却拒绝建立起直接的、可量化的目标。模棱两可的目标叙述迫使客户自行推断，而客户一般都会把事情往好的方向想，过高的期待又往往带来失望——结果，你们之间好不容易建立起来的<strong>信任</strong>就毁掉了。像“卖更多东西”、“提高曝光率”这种目标还是少来为妙，它们太模糊了，几乎没有指导意义。</p><p>改进的验收准则练习（modified acceptance criteria exercise）是我发现用于建立清晰有力目标的最简单有效的工具。精明的开发者利用验收准则来说明为什么要执行某项任务，以及他们该如何融入大图景之中。只需做一点小优化，你就能完美地捕捉到设计目标。</p><p>样例需求:</p><ul><li>我们想要重新设计我们的网站，因为我们需要更多流量和一个新形象，希望我们成为行业里更受尊敬的企业。</li></ul><p>样例目标模板:</p><ul><li>我们希望 __________ 因为____________ 然后 ___________.</li></ul><p>样例目标:</p><ul><li>我们希望把访问量提高20%，因为我们想有更高曝光率，然后我们就能每个月新建立八条客户渠道。</li><li>我们希望改变现在的形象，因为我们想让客户觉得更亲切，然后我们才敢把服务费提高10%。</li><li>我们希望每个月能写四篇行业相关的文章，因为我们想为这个行业做贡献，然后我们就能每个月找到两个合作伙伴。</li></ul><p>请思考，区分开“手段”、“原因”、“结果”的过程是如何让项目持有者的目标变得明晰的，而且这一过程还能解释他们为什么有这些目标，又打算怎样达到目标。为设计确立验收准则是挖掘出更深层次的可能还不为所知的需求的极佳方式。它帮助设计师和项目持有者做出更好的决定，以免将来设计执行过程中遭遇“不速之情景”。请修正目标，直至项目相关各方都同意并理解这些目标。</p><p><em><strong>额外提醒</strong>：多建立几个目标，以方便你自己捕获二级甚至三级目标，不过千万不要让事情失去控制——所有网站都只需要一小撮高水平目标就够了。</em></p><h2>组织页面</h2><p>人们一般都只热爱那些不用他们多做思考就能成事儿的站点。用户的精力是用来解决他们自己的问题的，而不应该浪费在搞清楚网站怎么用上面。</p><p>卡片分类是安排网站内容的好方法。要利用卡片分类，列出你网站的所有页面，把它们写在一些索引卡上。然后，把所有卡片铺到桌子上，移动卡片位置，直至所有的目录和子目录归档方式都最为有理有据。</p><p>如果你没法亲自做卡片分类，或者你们团队没有时间做这件事，那你们还可以试试利用数据表在线商讨。以下是使用一些虚拟数据在Google Docs里创建的一家新西兰投资公司网站的示例。</p><div
class="wp-caption aligncenter" style="width: 410px"><a
href="http://blog.benhuoer.com"><img
title="一张数据表" src="http://i27.photobucket.com/albums/c156/jyyjcc/benhuoer-blog/take-guesswork-out/guessing-spread.png" alt="一张数据表" width="400" height="272" /></a><p
class="wp-caption-text">利用数据表进行卡片分类的示例</p></div><p>如果你的项目是针对某网站的再设计，那你应该先看看该站点的访问统计数据，找出哪些页面获得的流量更多，哪些更少。这么做的好处是能推断出设计的内容在哪部分还不够，在哪部分又太过了。然后，紧缩或合并类似页面，简化复杂页面。</p><p>即使已经过了正式的设计过程，好的卡片分类实践也能大大提高一个网站的可用性和内容传递效率。这是一种让网站保持关联性和实效性的聪明训练。要了解更多关于这方面的信息，请参见 <a
href="http://www.boxesandarrows.com/view/card_sorting_a_definitive_guide"><cite>用框线图</cite> 实现卡片分类（英文）</a>， <a
href="http://www.usability.gov/design/cardsort.html">Usability.gov上的卡片分类介绍（英文）</a>，或者<a
href="http://www.rosenfeldmedia.com/books/cardsorting/">阅读这本关于卡片分类的专著（英文）</a>。</p><p><em><strong>额外提醒</strong>：让不熟悉公司业务的人来帮忙进行卡片分类，有助于发现大众成见，获得意想不到的反馈</em></p><h2>铺展页面</h2><p>接下来，我们需要深入理解设计的视觉优先顺序。这里我们采用注意力地图(Attention Map)并且做一点算术。</p><p>注意力地图就是为页面指定一系列目标，并且为每个目标分配一个吸引力指数。总点数不要太多，足够分配就好，这样点数之间才能更容易对比和互相参考；但也不要太少，以免分配出太多过于接近的点数。这么做的目的是让你深入理解各个目标之间的联系，从而确立稳妥的内容层次。</p><p>样例点数分配：</p><ul><li>四个目标，一共分配15点</li></ul><p>样例结果：</p><ul><li>服务介绍：7点</li><li>带来的益处：4点</li><li>行业文章：2点</li><li>相关新闻：2点</li></ul><p>比起简单的优先级列表，注意力地图更为高效，因为它还直观反映了各个目标在页面中占据多少空间。由于“服务介绍”的点数比“益处”所占点数要高3点（几乎是两倍了），所有你能肯定“服务介绍”需要吸引大量更多注意力。</p><div
class="wp-caption aligncenter" style="width: 550px"><a
href="http://blog.benhuoer.com"><img
title="布局分块吸引力指数" src="http://s27.photobucket.com/albums/c156/jyyjcc/benhuoer-blog/take-guesswork-out/guessing-layout.png" alt="使用注意力地图在网页上划分重要性的归类所在区域" width="540" height="270" /></a><p
class="wp-caption-text">使用注意力地图在网页上划分重要性区域</p></div><p>用草图表达满足目标、适合内容组织、符合注意力地图的设计选项时，应当简明直率，且富有战略。说不定这样你就能少很多搜索枯肠的烦恼。</p><p><em><strong>额外提醒</strong>: 完成之后，试试反转草图，或者从镜子里面看它，看看还是否能用。为你自己的草图挑刺儿（包括那奇怪的镜像草图），能帮你想出一系列新点子。</em></p><h2>开发个性</h2><p>强健的原型(archetype)能建立起一条直接而充满力量的情感纽带。所谓<a
href="http://cn.blurtit.com/q458251.html" target="_blank">原型</a>是指一系列性格特征和行为特点，常见于一群说共同语言或有着共同历史的族群。每一原型都有其强势、弱点、天赋和畏惧。当你无所顾忌地运用这人性特征的方方面面时，人们将从内心深处对你的设计产生共鸣。这有助于强化记忆和建立信任。</p><p>Margaret Mark 和 Carol S. Pearson 所著<cite><a
href="http://www.amazon.com/Hero-Outlaw-Building-Extraordinary-Archetypes/dp/0071364153">《英雄与歹徒(The Hero and the Outlaw)》</a></cite>一书，强有力地覆盖了人类文明几乎所有方面的12种原型。</p><p>这些原型包括：</p><ul><li>纯真 Innocent</li><li>探索者 Explorer</li><li>圣人 Sage</li><li>英雄 Hero</li><li>法外之徒 Outlaw</li><li>魔术师 Magician</li><li>普通人 Regular Guy/Gal</li><li>情人 Lover</li><li>弄臣 Jester</li><li>看护者 Caregiver</li><li>创造者 Creator</li><li>统治者 Ruler</li></ul><p>如果你选择了法外之徒（想一想 <a
href="http://images.google.com/images?q=Harley%20Davidson&amp;hl=zh-CN&amp;client=firefox-a&amp;rls=org.mozilla:zh-CN:official&amp;hs=K9T&amp;newwindow=1&amp;lr=lang_zh-CN|lang_zh-TW&amp;nxpt=20.3396804312541271739951&amp;um=1&amp;ie=UTF-8&amp;sa=N&amp;tab=wi">Harley Davidson</a> | <span
style="color: #999999;">译注：一个摩托车品牌</span>），那就开始批判你自己违背法外之徒特征的一切行为吧。说不定你会想起众多新奇有趣的想法，连你自己都要大吃一惊呢。</p><p>法外之徒的特征：</p><ul><li>渴望复仇和/或革命</li><li>想要摧毁一切没用的东西</li><li>痛恨自己无能为力或被轻视</li><li>尝试扰乱或震惊大众</li><li>希望给与人们绝对的自由</li><li>通常被误会为魔鬼</li><li>有犯罪倾向</li></ul><p>如果你能把这些“个性”持续融入不同的设计中，并且考虑如何将其用于与顾客发生交互的领域，之后再密切留意顾客的反应。那你就能建立起一个强大的品牌。</p><p><em><strong>额外提醒</strong>：人们经常把公司个性与他本人的个性混而为一。请明确项目持有者或者其他重要</em><em>相关</em><em>人物的个性，以把个人特性与公司个性区分开来。</em></p><h2>界定何为适度，完成</h2><p>对特征进行设计能直接支持和强化内容。不幸的是，要让所有受众都能连贯地正确理解付诸视觉风格的特征，并不是一件容易的事。列出反面特征制造违规界限，是一个不错的办法。这有助于你清楚认识某项设计的特定外观，并为你提供一个在评估设计时进行量化和批判的标准。</p><p>要完成这一步，一个很好的办法是，找出会显著影响设计效果的对立特征，把它们置于滑块标尺上，如下图：</p><p
style="text-align: center;"> </p><div
class="wp-caption aligncenter" style="width: 550px"><a
href="http://blog.benhuoer.com"><img
title="一张滑块标尺图" src="http://i27.photobucket.com/albums/c156/jyyjcc/benhuoer-blog/take-guesswork-out/guessing-traits.png" alt="一张滑块标尺图" width="540" height="180" /></a><p
class="wp-caption-text">用于定义反面设计特征的滑块标尺示例</p></div><p>有了特征尺度，设计师就能切实体会到网站内容究竟该向用户提供何种感受。如果设计师关于“活跃”的想法太强烈，有了“冷静vs活跃”的标尺，就能很容易地确定他的“强烈”程度，然后再做适度的调整。由是产生的批判，远比仅仅一句“太强烈了”更加有建设性。</p><p>根据需要添加、删除、修改特征标尺。但请记住批判必须是可量化、可讨论的。诸如“高科技”这样的特征过分依赖于设计师的个人品味和观点，一千个人眼里就有一千种不同的“高科技”。有时候，像“高科技”这样的特征，本质上其实是一系列其他特征的组合。“高科技”可以包括“现代”、“简约”、“正式”等 —— 这些才是能放在标尺上被即使没有设计背景的人界定和讨论的特征。</p><p><em><strong>额外提醒：项目完成后，评估哪一系列特征对项目的成败最至关重要，跟踪那些你后悔没有放进去的特征。</strong></em></p><h2>自信地设计</h2><p>可靠而全面地理解站点目标、内容组织、页面布局、个性开发、恰如其分地完成等内容，能为你建立起一种环境氛围。在这环境中，你和项目持有者进行着值得信赖的严谨讨论和对想法的准确记录。通过合作，你们将会犯更少的错误，遭遇更少的恼人意外，完成目标明确的探索，最终，创造出更好的设计。</p><p
style="text-align: right;">题图由 <a
href="http://www.alistapart.com/authors/c/kevincornell">Kevin Cornell</a> 绘制</p><h4>译后感：</h4><p>太囧了。这文章太高深了。译言上先前有人发过一篇译稿，比原文还难懂…… （译者莫生气哈…… 大家都是学习交流~ ）希望大家看我这个版本的时候还不算太迷糊。</p><p>欢迎留言讨论，这其实是一个很值得认真探讨的话题。别认为在中国我们就没法做这种“特别花精力”的所谓“高端”设计。很高端吗？都是一些与客户交流和安排自己工作的实际技巧而已。不是你能不能做高端，而是你自己到底想不想。就算做不出高端，“想做高端”也比“自甘堕落”要值得褒奖得多吧。</p><blockquote><p>Source:  <a
href="http://www.alistapart.com/articles/taking-the-guesswork-out-of-design/">Taking the Guesswork Out of Design</a> by <a
href="http://www.alistapart.com/authors/r/dritzenthaler">Daniel Ritzenthaler</a></p><p>Translated with the permission of <a
href="http://www.alistapart.com/">A List Apart Magazine</a> and the author[s].</p><p>Translator: <a
href="http://blog.benhuoer.com/">Benhuoer</a></p><p>若需转载，务必依原样保留本声明。</p></blockquote><div
class="related-post"> <strong>你应该也会喜欢：</strong><ol><li><a
href="http://blog.benhuoer.com/posts/inclusion-principle-ala.html" rel="bookmark">网页设计中的包容原则[ALA]</a></li><li><a
href="http://blog.benhuoer.com/posts/fixed-fluid-elastic-css-layout-comparement.html" rel="bookmark">固定 vs. 流动 vs. 弹性：哪种布局更适合你？[SM]</a></li></ol></div><div
style="border-top:dashed 1px #ccc;  border-bottom:dashed 1px #ccc;padding:0.3em 0;">分类于：<a
href="http://blog.benhuoer.com/category/web-technology/interactive-and-ue" title="查看 交互和UE 中的全部文章" rel="category tag">交互和UE</a>, <a
href="http://blog.benhuoer.com/category/web-technology/web-design" title="查看 网页设计 中的全部文章" rel="category tag">网页设计</a>        标签: <a
href="http://blog.benhuoer.com/tag/a-list-apart" rel="tag">A List Apart</a>, <a
href="http://blog.benhuoer.com/tag/%e7%94%a8%e6%88%b7%e4%bd%93%e9%aa%8c" rel="tag">用户体验</a></div><p><small>©2009 <a
href="http://blog.benhuoer.com" target="_blank">笨活儿</a> | <a
href="http://blog.benhuoer.com/posts/taking-the-guesswork-out-of-design-ala.html" target="_blank">永久链接</a> | <a
href="http://blog.benhuoer.com/posts/taking-the-guesswork-out-of-design-ala.html#comments" target="_blank">已经有7条评论了</a> | <a
href="http://9.douban.com/recommend/?url=http://blog.benhuoer.com/posts/taking-the-guesswork-out-of-design-ala.html&title=拒绝臆想，让我们脚踏实地做设计！[ALA]&v=1&n=1" target="_blank">推荐到豆瓣</a> <br/> </small></p>]]></content:encoded> <wfw:commentRss>http://blog.benhuoer.com/posts/taking-the-guesswork-out-of-design-ala.html/feed</wfw:commentRss> <slash:comments>7</slash:comments> </item> </channel> </rss>
