网页设计常见表现手法

版权申明：本文原创作者祝小贱，感谢祝小贱的原创经验分享！

……表示有人要我年底发点东西，没神马好货可以吐……抽时间拿某次内部分享凑凑数吧……要干的活太多，偷了偷懒，就没整成适合阅读的尺寸了，有阅读不方便之处，还望大家谅解……

其实这些理论很多大神都有分享过，只不过我是新瓶装旧酒，多包装了一下，加入了一些新的案例和自己的见解而已。水平有限，不代表就是真理。有什么不妥地方，也可以指出多探讨。

设计的理论有很多，这只是其中个人觉得基础中的基础，最有代表性的四条而已，并未有以偏概全的意思，设计之域，岂可寥寥概括。未来，有机会我再进行补充与延展。

  一，设计常见手法之对比

木有对比就木有伤害，木见过大海，不知海之阔，未见过苍穹，不知空之广。没见过其他人做得好的，不知道自己做得有多龊……
对比作为设计最常见的手法，（本PPT也有用到）其实用性是很强的。
因为篇幅有限，（PS：飞来一脚把我踹飞：明明是你懒编不下去好么）暂且只描述下字体。
以下啪啦啪啦省略五千字……看图就好
好了，我们继续下个……

什么！内谁说的只看图看不懂的……
一定要我解释么。。。
其实字体粗细对比太常见了。设计就是规则中加入一点变化，无非就只注意的一点是，若是要某段话有粗细对比，最恰当的手法还是使用同一种字体的粗细效果，但一般中文字体较少，英文的Amsipro，nexa（ps：我会告诉你这个就是ppt用的英文字体么），Zona Pro，Gotham就拥有2种或以上的不同效果。大标题我们为了显眼通常都是加粗使用，小部分描述才使用纤细的。
这样即保持字体上的统一，减少多余元素，又让字体不至于太平淡缺乏变化。这样看起来才更像是相亲相爱的一家人……
另外，也不仅仅是只有字体才有大小对比，网页上各个元素之间，也存在大小的对比，对比越夸张越强烈。其效果……嗯，这又是一个另外的故事了。

关于字型对比，其实这个也没什么好说的，主要是在于不同场合怎么去使用这些不同的字体。
偏文艺范的画面（明信片，摄影集排版组合）用手写体， 各类电子产品（包含手机）适合标题用纤细字体，若是化妆品，婚纱影楼，女性用品一类的就是衬线体，中国风的，游戏专题，要做出气势的就是毛笔字体，婴童少儿相关的才用到圆角字体（因为小孩子容易受伤神马的，所以一切玩具和小孩子用的东西大多都是塑料的，圆圆钝钝的，所以引申到设计表现形式上，也是相应的感觉）

关于字体的疏密，其实是最不好拿捏的一环了， 大品牌官方banner上常有，如果没有拉开距离有留白，整张图都失去尿性。
但其实大众能接受并且看得更多的还是相对紧密点的字体。为什么？很简单，因为通常非高端品牌，给过来的slogan就没有一个不是文字多且密集的。
在这种情况下。。。你拉开个毛线的距离……你以为人人都有这文采能想出简短干练，而又让人印象深刻的广告语啊！
说的就是你，来自25世纪颠覆人类思想升华人类灵魂堪称千年难得一现道德楷模精神品质规范并且技巧已入臻境的伟大设计师某某。

关于色彩，其实还是秉承设计的原理就是简洁而不简单，要和整体更加和谐搭配，同时显简洁的同时，还能让人感觉有细节。你可以看到我选取的这个例子中，标题的颜色，装饰的彩带，页面的logo和某个文字都是同样的色系。增加了画面色彩不单调的同时，其又统一简练。

关于方向，在设计过程中，你要做这个效果不仅仅是因为看到其他人的作品里用过这样的竖排形式觉得好看才使用，更多是为了让你的构图更加和谐恰当，可以看到左侧就是一个竖长的衣架效果。在这种情况下，设计师才想到用竖排的效果去填补右侧的空间。
当有一天，你能为你任意某一处细节的设计都找到一个合理的解释的时候，你的设计才算真正入门。

二，设计常见手法之重复

高手是怎么来的？把一件事情重复一万遍就好了。
一口气吃不成一个胖子，黄裳就算发明练成九阴神功，等到天下无敌也要在山洞里修炼个几十年不是？ 
重复不仅仅是一个手法更多是一种精神。反复去推敲，反复去打磨，反反复复去调整直至更好一点点。下图你看人家手法是很简单，看一眼就懂个大概，一个形式左边右边重复去使用，一个在左边一个在右边。但是要把细节做到这样的程度。其实更多是在电脑屏幕面前反复修改的效果。 
我们看到的很多成套系的广告，也大部分都是一个idea换一个不同人物或者场景或文案去进行合成不同画面 。

其中最经典的也是点线面的重复（形状版式的重复之前有讲述过，这次就不复述了）

点的重复常见于自然界当中，在设计手法中，除了下图的制作成背景，也有作为页面上一些风沙，雨雪，飘飞，火花去增加画面中的细节和质感。很多抽丝的效果也是可以通过在图案里设置小点而制作出来，这也是很多点重复的效果。

线在设计中大部分是以图案底纹而存在，VI整套设计当中，一个有逼格的由几条线组成的图形+背景色，就足以撑起整个设计的气场。