网页设计的常规办法

　　生动有趣的网页设计总是能吸引到更多的用户驻足停留。千篇一律的网页设计已经无法满足如今“挑剔”的用户了，想要抓住他们的眼球，必须尽可能的打开他们的好奇心，并且在细节上取胜，让他们在细节中感受到设计师的用心。接下来先知创意网小编就为大家介绍一下网页设计的常规办法。

　　网页设计的背景生存法则

　　清晰的图像

　　使用逼真、清晰的图像从来不会过时，但是流行与否则取决于使用的方法。越来越多的此类图像现在是直接作为背景，而不是作为其它背景之上的照片。插图也日渐流行。同样，色彩是非常重要的，因为它决定了插图的品质。

　　模糊或者虚幻的头像

　　使用虚化或模糊图的情况会有些复杂。它只有在图片本身品质很好的情况下才会带来好的效果，如果为了掩饰图片质量的低劣而去虚化，效果会适得其反。一般我们需要要很清楚为什么要把一张图虚化。有时候非常明显的模糊会有很好的效果(像 Humaan 网站中柔化的山峰)，而有时候只需要轻微的虚化就足够了。

　　色块

　　明亮的颜色正在开始流行并越来越引起注意。大量设计师选择利用颜色来创造出深度和对比。

　　黑或者白

　　黑和白是经典的背景色，用起来也简单。你可以很容易为字体产生对比效果(即使是很小的字)，并且永不过时。如果加上一些细微的空间处理，黑色或是白色背景便会看起来更时尚。Foundry Co. 用到了线条来起强化的作用，而 Designing Monsters 在黑暗色调上用了大面积的对比色(黑白反差)。

　　图案或者纹理

　　不要担心采用浓烈的图案背景。大块的、重复拼接的图案现在随处可见。细腻的纹理可以给设计增加真实感。此类流行设计的关键在于恰当的反差对比。

　　网页设计中的无意识设计

　　无意识设计就是“将无意识的行动转化为可见之物”。为了便于理解，我们可以举一个身边的例子进行分析：经常做饭的人一般都知道，煮米饭时放一些辅料可以使做出的米饭达到意想不到的口味，比如放醋可以使煮出的米饭更加松软、香嫩，即使大部分人知道这个常识，但是因为一时疏忽仍会有忘 记添加辅料的时候。因此我们需要做一种设计，就是在煮米饭时的一个无意识动作中自动添加相应辅料，而这种设计就称为“无意识设计”。

　　“无意识”并不是真的没有意识去参与，而是我们知道自己需要某些东西，但还没意识到自己到底想要什么，而深泽关注的，正是我们所忽略的有关“无意识”的种种生活细节。深泽用一个简单的道理向我们阐释了他设计的思想根源：在发短信的时候，一般人会选择沿着给盲人专用的道路走，他可以不用眼睛看而不走错。也就是说，这条黄色的、平时提供给盲人使用的路，又体现了它的新价值。而人走路并不仅仅是儿时学会的一种行为，而是你在走路的时候要看你的脚往哪儿 踩，也就是在寻找你的脚踩的一种价值。所以，上述发短信时循着盲道而行，就是一种寻找价值的连续的行为，而当人、物与环境达到和谐的时候，我们说这种行为就找到了一种无意识的有价值的行为。

　　无意识的设计是一种已存在的感觉，它不会凭空出现，需要我们用丰富的经验和对细节情感的关注来产生。所以无论从产品设计、平面设计，还是到网页设计，都应该从问题的根源着手寻求解决的方法。比如扁平化设计可以说是去繁从简的设计美学。不要以为扁平化只是把立体的设计效果压扁，事实上，扁平化设计更是功能上的建简化于与重组。比如，有些天气方面的应用会使用温度计的形式来展示气温，或者 计算应用仍用计算器的二维形态表现。在应用软件当中，温度计的形象则纯粹是装饰性的，而计算器的计算方式也并不是更简单直接的。相比于拟物化而言，扁平风格的一个优势就在于它可以更加简单直接准确的将信息和事物的工作方式展示出来，减少认知障碍。再比如响应式设计。由于现在越来越多用户都拥有了多种终端，台式机、笔记本、手机、平板，能够适应不同尺寸显示屏的网页变成了当下设计的趋势。这也是通过对于产品和环境的观察发现的，通过网页信息要素的重组使其无论在垂直的平板电脑还是智能手机上都能达到更好的视觉效果和信息呈现。

　　网页设计中的小技巧

　　1. 匹配品牌

　　按钮设计非常重要的一点就是与它的使用环境相匹配。这意味着你的按钮也许需要选择特定的色彩，形状或从目标品牌的设计理念及logo中汲取灵感。你需要以目标品牌为依据来决定按钮的形状，材质和风格。例如，如果目标品牌的logo是圆形的，你或许也可以在你的按钮中体现出这一点。

　　如果一个界面的色彩非常淡雅，那么在其中使用大而华丽的苹果风格的按钮或许就不是很合适。如果可能的话，按钮设计中可以尝试不同的图形，特效，颜色或其他元素，但一定要以彰显品牌为中心原则。

　　2. 匹配风格

　　这其实在上面已经说过了：在使用网上的“UI类PSD素材”之前更好先想一想。使用别人预设好的素材固然可以节省不少时间，但它们是否就适用于你的设计呢?按钮设计不仅应该与目标品牌匹配，还应该与它的界面环境在风格上保持一致，你的素材符合这个要求吗?还要注意，你使用的按钮是否太“按钮化”了?

　　在移动设备或移动应用程序当中，按钮做得显著一点是有必要的，但在网站设计中，按钮在外观上还可以有不同的选择。

　　3. 突出对比度

　　现在许多界面的设计，尤其是网上的UI素材都极力模仿苹果的OS风格，在这种情况下，按钮设计的重要性便被有意无意地忽视了，按钮的力量也因此而无法发挥。这就需要设计师利用色彩，形状，负空间，字体等不同元素，赋予按钮独特的视觉效果，使它们能与界面中的其他元素清晰地区别开来。

　　4. 使用圆形或不规则图形

　　前面也说过，如果一个界面中有很多圆形的UI元素，你也不妨在按钮设计中采用类似的设计，当然，也可以对形状做相应的调整。这样可以让按钮与界面形成一定的对比度，充分彰显按钮自身的独特性。

　　5. 削弱次要的UI元素

　　如果你使用的是模仿苹果OS风格的素材或网上预先设定好的PSD模板，那么其中的UI元素很可能都是角度圆滑的长方形。针对这种情况，你可以适当削弱这些元素的设计效果，让他们看起来不那么“按钮化”。

　　6. 色彩与描边/边缘保持一致

　　我们见到的大多数按钮都或多或少地使用了边缘/描边效果。一般说来，如果你设计的按钮比背景色更暗，那么应使用暗色的边缘效果，其色彩要与按钮的颜色一致。如果是相反的情形，那么应使用与背景色一致，但略微偏暗的色调作为按钮的边缘。如果你用更种处理方式来处理较暗的背景，那么按钮效果很可能给人一种“有点脏”的感觉。我觉得这条规律也适用于其他与描边/边缘相关的网页元素的设计。

　　7. 慎用模糊阴影特效

　　在这么多年的设计生涯中我始终坚持自己制定的“阴影法则”。这个“阴影法则”的内容是：当某个元素的色调比背景更淡时，使用阴影有更佳效果。相反，当某个元素的色调比背景色还要暗时，使用阴影效果就应该十分慎重。像我前面讲到的按钮与边缘色彩的匹配原则，我认为这一“阴影法则”也适用于其他UI元素的设计。

　　8. 小图标大不同

　　为了把按钮与其他形状接近的UI元素区分开来，像“指示箭头”这样简洁微小的图标往往发挥意想不到的作用。

　　例如，一个指向右边的箭头图标可能会让用户觉得，点击它会离开页面或打开一个新页面。而一个指向下方的箭头则可能会给用户这样的信息，就是点击它可以打开一个下拉菜单或查看隐藏的内容。

　　9. 让按钮主次分明

　　如果你设计的界面需要展示很多选项和功能，那么使用不同的视觉效果为按钮划分级别就显得尤为必要。

　　对更重要的按钮应使用更强烈，更鲜艳的色彩，对其他的按钮应按重要程度次第削弱色彩效果。在其它方面也一样，对于二级，三级按钮，应该在大小，负空间，字号和特效等方面做相应调整。

　　10. 欢迎反馈

　　这个似乎无需多说，但却是在按钮设计接近收尾阶段必须考虑的事项。一定要知道用户实际使用按钮的体验如何，这是按钮设计中非常核心的一点。在现实中，用户使用按钮的环境各不相同，但什么样的按钮才更易于被用户认可和接受，一定是有模式可循的。有时候，只是简单地在CSS中对阴影，边缘，色彩和其他元素做一下微调，就能为用户带来完全不同的体验!