<p class="zw">在我从事Web工作之前，我曾在使用广角摄像机方面受过专业的训练，这些电影摄像机的特点是利用摇摆和倾斜运动，在图像中创造一个清晰的画面。</p> <p class="zw">在摄影中，即使是最好的镜头也不能把光线聚在一个点上。取而代之的是，镜片将光线聚于一个点或者圆上。尽管这些圆很小，但它们仍有尺寸，这就是“弥散圆”。</p> <p class="zw">弥散圆越大，照出来的照片会越不清晰，反之亦然。这些是高级摄影技术的基础，没有照片有完美的聚光，也无法做到真正的锐利，相反，照片只能是尽可能清晰。</p> <h3 class="sigil_not_in_toc" id="nav_point_47">尽可能清晰</h3> <p class="zw">虽然模块化和原子化设计被很多人采用，有时候客户还是希望我们能用Photoshop来演示如何完成网站或者应用程序的外观设计。</p> <p class="zw">这些图像将包括每一个设计元素：品牌、颜色、各种形式的排版、背景图、边框和渐变。我们可以认为这就是高保真、清晰的设计。</p> <p class="zw">但这些元素对设计完整性有多重要？一个特殊的字体对于一个品牌的用户体验是否至关重要？背景混合有多重要？列是真的需要吗？</p> <p class="zw">这些决定将确定元素应该怎样跨浏览器和设备，具备不同的功能。我们致力于在他们之间达成一致，为了帮助做出这些决定，我们可以从弥散圆的原则中学习。</p> <p class="图"><img alt="0405.tif" src="http://csdn-ebook-resources.oss-cn-beijing.aliyuncs.com/images/c4eeb42b07f54b42a9fd1568b8ec4b98/17.jpg"></p> <p class="图题">字体的选择对于设计的完整性有多重要？左侧使用是具有设计特色的Web字体，右侧使用的是系统字体。</p> <h3 class="sigil_not_in_toc" id="nav_point_48">有意义的讨论环境</h3> <p class="zw">用三个同心圆来表示比较直观。</p> <ul> <li class="第1级无序列表">最里面的环应该包含设计元素，这是最核心的。如果布局和排版必须保持一致，将它们放在这个圆中。</li> <li class="第1级无序列表">在中间的圆中，放置重要的元素，但不是至关重要的，这是个人的设计经验之谈。举个文本的例子，文本被放置在CSS创建的列中，对于支持多列布局的浏览器，浏览器自动渲染列，对于不支持的浏览器，我们需要调整字体来适应没有列这种情况。</li> <li class="第1级无序列表">最外层的元素是允许优雅降级的。如果没必要在所有的浏览器中实现背景混合或滤镜，就使用JavaScript来节省时间。</li> </ul> <p class="zw">我已经发现，弥散圆原则在解释浏览器之间的自然差异方面是个很有用的技术。它设置了更现实的期望和更有意义的讨论环境。最重要的是，它使大家都能够在设计的优先权方面做出更好的决定。</p>
