手把手教你學網站設計

admin

對付頁面来说，色采也是相當首要的一環。每一個頁面都應當有怪异的氣質，而表达氣質的是氣概，氣概也就是调性，做設計先定调性，這是第一步，也是最關頭的一步。色采可以给人的视觉以第一感官，视觉转达的精華也在于“首轮效應”，就是视觉打击力，也叫视觉表示力，這類表示力的强弱，直接决议了案牍的表示力。若是學计谋看《定位》，學設計看《视觉锤》，那末，正如《视觉锤》中所说，说话是钉子，视觉就是锤子，好的钉子要想打到用户心中，就要用视觉的锤子，經由過程客户的眼睛，敲進客户的内心，讓案牍深深的锁定客户的心智。固然听起来蛮狠的，可是在利用的時辰，却没那末轻易。

咱们都有網购的履历，當看到京东、苏宁、天猫等電商的促销頁面時，第一感受是否是影响你是不是往下看？色生髮液，采，是否是吸引你的一個很大的缘由呢？谜底時必定的。當人看到一個頁面時，起首眼睛會遭到刺激，刺激眼睛的就是色采。那末，色采该若何利用，在網頁設計中，應當若何選擇色采呢？

色采，本没有黑白，只有适不合适，搭配是不是合适美的法例，合适美的法例。在這咱们先回首一下曩昔大學學過的根本常識，情势美法例。情势美法例是人類在缔造美的情势、美的進程中對美的情势纪律的履历总结和抽象归纳综合。重要包含，對称平衡、纯真齐1、和谐比拟、比例、节拍韵律和多样同一。咱们學過三大组成，平面组成、色采组成和立體组成，此中，平面组成和色采组成，可以應用在咱们的頁面設計當中。

若何選擇符合的色采呢？起首，看所設計的行業属性，其次，看所表达情感的调性，最後，公道的搭配，谨严地利用你的色采。固然設計師必要斗胆的想象，但也要“带着脚铐舞蹈”，也就是说，設計必要合适設計的“科學法例”，必要合适“情势美法例”。看似横七竖八的設計，若是你感觉都雅，固然你说不出来，但请注重，你所看的這個頁面，合适“情势美法例”。

好，咱们接着说若何配色的問題。選定了行業，選定了调性，接下来，選定一套配色。這套配色不建议太花梢，而是必要以一個主色為根本，搭配其他辅助配色為粉饰，并制订出本頁面的“設計法例”。好比，底色用甚麼色彩，頁面分為甚麼布局，是一種底色仍是切分為多块底色，是不是必要在文字下方再衬一块底色，這块底色是不是必要有一個特别的外形。

再说一下主画面的配色問題，主画面的配色，必要综合斟酌字體和圖片的搭配，出格要留心的是，主題打字必定要夺目，要與布景色有明線的區别，简略说，就是要“跳出来”。為甚麼要“跳出来”，是由于這块内容是用户打開網頁的第一屏，直接影响到用户是不是看下去的举措，同時，第一屏的主題也直接反响出本頁面所表达的勾當主題思惟，以是建议，主題字區域要好好的精心設計，重要斟酌的是，主題字與主題圖的瓜葛問題。

在用色方面，分歧行業也有一套分歧的尺度，好比，電商促销用甚麼色彩最佳，赤色、黄色，為甚麼，由于赤色黄色给人感動感，豪情感，讓人發生轻易感動消费的心境。再好比，金融類網站用甚麼色彩最佳，蓝色、橙色，由于蓝色给人相信感，橙色给人亲和感，固然，必要搭配总體主題去設計。

适才说的是色相（就是甚麼色彩），實在色采另有此外两個指标，明度（俗话阐明亮度）和纯度（也叫饱和度）。在明度上，越豁亮的色采，给人越飞腾的心境，在纯度上，约纯的色采，给人越刺激的心境。在色相上，分為冷色和暖色，冷色就是蓝色、绿色、紫色類，暖色就是赤色、橙色、黄色類，冷色给人專業、高冷的感觉，暖色给人感動、亲和的感觉。暗示色采可以經由過程一個色環来看，色環上表示了所有的色相。

临近色，就是在色带上相临近的色彩，比方绿色和蓝色，赤色和黄色就互為临近色。三原色中，任何一種色彩便是其他两種原色等量夹杂的补色。在色相環中，处于直径位置的两色互為补色。在色相環中每個色彩對面(180度對角)的色彩，称為“比拟色(互补色)”。把比拟色放在一块儿，會给人强烈的排挤感，若夹杂在一块儿，會调出混浊的色彩，如，红與绿，蓝與橙，黄與紫互為比拟色。在色轮上，90度角内相毗邻的色统称為雷同色，以是在利用色采的時辰，必要斟酌到這些根本常識的應用。

這些色采常識，是作為一個設計師必需烂熟于心的道理，看似轻松的設計用色，都是要靠美學道理支持，設計就靠這些道理来引导，用色和排版，都必要有来由，不要说凭感受這類话。

7.第七，設計字體

如今有不少字體設計師設計的很是棒，但也有不少茫無頭绪的初學者。實在，字體設計，也是一門大學通馬桶神器,课程，科班身世的設計职員應當有印象。在字體設計中，必要注重的問題，是字體的“性情”。對，不但色采有“性情”，字體也是有“性情”的。字體分為几種類型，别离是衬線體、無衬線體、书法體、装潢體。固然文字有欧洲文字、亚洲文字，和阿拉伯文字三種语系，但一样美白牙膏推薦,按照字體的造型道理，将字體區别。為了好理解，我打個例如，衬線體是宋體（也就是带钩的），無衬線體就是黑體（不带钩的），书法體就是羊毫钢笔写出的字體，装潢字體（也叫告白體，是颠末設計過的再造字體）。

在網頁設計中，出格是主題着陆頁的設計中，咱们用的是装潢字體占多数，由于這類字體最具表示力，并且字不要太细。同時，選擇字體後，要對字體举行再造型，如切割、归并、變形、扭曲、歪斜等等，以到达咱们想表示的主題氣質，或刚猛、或亲和，随頁面策動和案牍来定。

8.第八，設計插圖

在當前互联網期間，卡通造型已愈来愈遭到企業主的接待。一方面，卡通造型没有相片那種放大就模胡的错误谬误，二方面，不存在利用了别人拍摄的圖片而造成侵权的危害，三方面，想找一张符合的位圖真的很难。以是，最佳的法子就是，本身绘制一幅場景和一系列品牌的卡通吉利物，或下载一些現成的矢量場景素材，讓你事半功倍。

要注重的是，選擇的插圖，必定不要有违和感，必定要连结與頁面氣概的同一性，画風要一致，配色要调和，位置要得當。

另有一種着陆頁，不是主題勾當頁，而是静态展現頁，相對于来讲比力理性的那種，這類頁面@右%riGl8%邊或左%281qz%邊@或上部或下方，可能會放一些告白位。而告白位的設計，色采一样是很關頭的，要注重告白與告白之間的色采差别，還要注重色采的明度、纯度，要同一，不要有违和感。在告白的設計中，設計伎俩也要连结一致，告白中的字體和版式也要连结氣概的同一。

9.第九，設計按钮

按钮，實际上是一语道破之笔。為甚麼這麼说呢，一個画面，當用户看完，假想，若是没有按钮，用户就不會找到品牌的主頁，從而没有贩卖转化的结果，那這個着陆頁就落空了感化，没有了意义，以是，在頁面當中，必定要有按钮的存在。

按钮應當利用甚麼色采、甚麼情势、甚麼字呢？是如许的，按钮凡是是一张PNG圖片，嵌入到頁面中的，你可以設置它有殊效，也能够没有，字體方面，要用好認的字體，最佳能粗大一點，目标是好認，好點，方針较着。色采方面，分行業，分目标来讲。若是是電商，首選赤色、黄色，若是是金融投資類，首選橙色。為甚麼這麼说呢？赤色给人感動消费的感觉，是最刺激的色彩，橙色给人亲和的感觉，但橙色比赤色更易讓人不反感，更友爱。

按钮的位置也要注重，要末再頁面最底部的最中心，要末就在頁面中部。至于到底在哪，要看頁面上放甚麼内容。若是最底部是勾當细则，你可以把按钮放在细则顶部，缘由就是，按钮是用户决议的一個触發點，當用户看的時候越久，可能就越不會點，也有可能底子找不到按钮，以是，設計者必要在得當的火候，安排按钮，讓客户點击。

10.第十，出圖質量

最後一步就是脱稿出圖。那末出圖一样也是很首要的，設計者必要包管圖片的清楚度的同時，還要分身圖片的質量，也就是几多KB。咱们都晓得，頁面的質量越大，打開速率就越慢，以是，依照知識来说，頁面的巨细要节制在500K之内，而且設置在72dpi，RGB模式，這一點很是首要。要做到這一點，跟頁面逻辑、頁面长度、頁面配色、頁面元素数目有關。在電脑端如斯，在手機端和微站短一样如斯，不要疏忽PC之外其他尺寸装备的阅读體验。

总體来说，設計網頁就像打一場战斗，必要计谋、战術的完善共同，必要案牍、設計的完善演绎，必要對品牌、對主題的深入理解。但愿以上10點對列位同業，出格是刚入行的同志中人有帮忙，哪怕是一點點。此外，由于本人程度有限，才疏學浅，很少写設計技能，履历不足，若是有表述不妥@的%4348L%地%4348L%方或忽%K482k%略@，還望大師汐止抽化糞池,多批判斧正，不惜見教，给我留言，一块儿交换履历，一块儿前進吧。

分享一句設計秘笈给大師，信赖必定對大師的設計之路有效。

現代主义活動前驱，德國工業設計家，迪特.拉姆斯说過，好的設計象征着尽量少的設計，简略胜于繁杂，安静胜于嘈杂，谦善胜于声张，小胜于大，轻胜于重，平平胜于卖弄，调和胜于分手，均衡胜于声张，联贯胜于互换，少少胜于极多，中庸胜于過激，大白胜于多元素，體系胜于单個元素。

最後，以巴菲特的一句话作為對大師的針砭箴规，记着一個原则：简略胜繁杂。