網站伴隨著互聯網的快速發展而快速興起，作為上網的主要依托，加上使用網絡的頻繁而變得非常的重要。企業需要通過網站呈現產品、服務、理念、文化，或向大眾提供某種功能服務。網頁設計必須首先明確設計站點的目的和用戶的需求，從而做出切實可行的設計方案。
jintianchoukonglaishuoshuodajiabijiaoguanxindewenti，jiushisuoweideshejiyuanze。henduorenbashejiyuanzedouxiangdehenfuza，haibieshuo，tazhendetingfuza，danshiduiwolaishuotajiushisidian：
清晰
流暢
統一
美觀
重要性也是按這個順序來排列，那麼下麵我們一點點來說說。
清晰
何為清晰?對任何產品而言，界麵“清晰”是(shi)最(zui)為(wei)重(zhong)要(yao)的(de)一(yi)點(dian)。人(ren)們(men)必(bi)須(xu)能(neng)夠(gou)辨(bian)別(bie)出(chu)它(ta)是(shi)什(shen)麼(me)，才(cai)能(neng)有(you)效(xiao)地(di)使(shi)用(yong)你(ni)設(she)計(ji)出(chu)來(lai)的(de)產(chan)品(pin)。而(er)在(zai)設(she)計(ji)的(de)過(guo)程(cheng)中(zhong)相(xiang)信(xin)大(da)家(jia)經(jing)常(chang)會(hui)被(bei)產(chan)品(pin)的(de)需(xu)求(qiu)搞(gao)得(de)蒙(meng)圈(quan)，最(zui)後(hou)出(chu)來(lai)一(yi)個(ge)亂(luan)得(de)連(lian)自(zi)己(ji)都(dou)會(hui)吐(tu)槽(cao)的(de)界(jie)麵(mian)。設(she)計(ji)師(shi)在(zai)設(she)計(ji)產(chan)品(pin)時(shi)，真(zhen)正(zheng)要(yao)做(zuo)的(de)應(ying)該(gai)是(shi)去(qu)關(guan)心(xin)用(yong)戶(hu)使(shi)用(yong)產(chan)品(pin)的(de)原(yuan)因(yin)，去(qu)預(yu)測(ce)並(bing)觀(guan)察(cha)用(yong)戶(hu)使(shi)用(yong)產(chan)品(pin)時(shi)的(de)行(xing)為(wei)然(ran)後(hou)快(kuai)速(su)做(zuo)出(chu)反(fan)饋(kui)。
產品在設計之初就應該定位清晰，明確自己的受眾群體，設計出符合目標用戶的產品。這樣才能留住用戶，讓用戶對產品更有期待。
但(dan)是(shi)每(mei)類(lei)應(ying)用(yong)的(de)需(xu)求(qiu)不(bu)同(tong)，受(shou)眾(zhong)群(qun)體(ti)也(ye)不(bu)同(tong)，所(suo)以(yi)每(mei)個(ge)設(she)計(ji)師(shi)在(zai)設(she)計(ji)產(chan)品(pin)時(shi)都(dou)會(hui)糾(jiu)結(jie)怎(zen)麼(me)把(ba)產(chan)品(pin)做(zuo)到(dao)清(qing)晰(xi)。比(bi)如(ru)攝(she)影(ying)產(chan)品(pin)，打(da)開(kai)就(jiu)是(shi)快(kuai)門(men)和(he)取(qu)景(jing)框(kuang)，相(xiang)信(xin)大(da)家(jia)都(dou)懂(dong)得(de)怎(zen)麼(me)用(yong)，這(zhe)類(lei)工(gong)具(ju)類(lei)應(ying)用(yong)很(hen)簡(jian)單(dan)的(de)就(jiu)能(neng)做(zuo)到(dao)清(qing)晰(xi)。再(zai)說(shuo)社(she)交(jiao)類(lei)應(ying)用(yong)，微(wei)信(xin)打(da)開(kai)界(jie)麵(mian)大(da)家(jia)都(dou)能(neng)知(zhi)道(dao)聊(liao)天(tian)框(kuang)和(he)標(biao)簽(qian)欄(lan)的(de)作(zuo)用(yong)，這(zhe)類(lei)產(chan)品(pin)說(shuo)難(nan)也(ye)不(bu)難(nan)，畢(bi)竟(jing)同(tong)類(lei)產(chan)品(pin)還(hai)是(shi)很(hen)多(duo)的(de)。其(qi)實(shi)最(zui)難(nan)做(zuo)好(hao)的(de)，還(hai)是(shi)購(gou)物(wu)類(lei)應(ying)用(yong)，不(bu)知(zhi)道(dao)為(wei)什(shen)麼(me)，這(zhe)類(lei)產(chan)品(pin)總(zong)是(shi)喜(xi)歡(huan)把(ba)界(jie)麵(mian)元(yuan)素(su)設(she)計(ji)得(de)又(you)多(duo)又(you)亂(luan)才(cai)肯(ken)罷(ba)休(xiu)，可(ke)能(neng)是(shi)我(wo)們(men)的(de)文(wen)化(hua)背(bei)景(jing)和(he)生(sheng)存(cun)環(huan)境(jing)導(dao)致(zhi)的(de)吧(ba)。但(dan)是(shi)話(hua)說(shuo)回(hui)來(lai)，這(zhe)麼(me)多(duo)類(lei)應(ying)用(yong)都(dou)要(yao)根(gen)據(ju)自(zi)己(ji)的(de)產(chan)品(pin)定(ding)位(wei)來(lai)設(she)計(ji)，每(mei)個(ge)產(chan)品(pin)定(ding)位(wei)的(de)清(qing)晰(xi)性(xing)都(dou)是(shi)不(bu)同(tong)的(de)。
所以要做到產品設計清晰，必須讓目標用戶在符合產品條件的基礎上，去正確的理解產品界麵。不需要思考就對界麵的設計有所了解;或者是讓用戶通過產品簡單的提示或幫助說明，就能夠理解產品界麵，並進行使用。
要yao做zuo到dao這zhe點dian就jiu要yao讓rang用yong戶hu知zhi道dao自zi己ji目mu前qian處chu於yu什shen麼me位wei置zhi，並bing知zhi道dao自zi己ji能neng幹gan什shen麼me或huo要yao幹gan什shen麼me。其qi實shi這zhe些xie說shuo起qi來lai很hen簡jian單dan，但dan是shi要yao做zuo到dao卻que並bing不bu容rong易yi，所suo以yi對dui用yong戶hu的de研yan究jiu必bi不bu可ke少shao，讓rang產chan品pin定ding位wei精jing準zhun，明ming確que目mu標biao用yong戶hu等deng等deng，都dou是shi非fei常chang重zhong要yao的de步bu驟zhou。這zhe也ye是shi為wei什shen麼me清qing晰xi是shi產chan品pin設she計ji原yuan則ze中zhong最zui重zhong要yao的de原yuan因yin。如ru果guo能neng做zuo到dao這zhe點dian，即ji使shi頁ye麵mian再zai多duo，也ye不bu會hui讓rang用yong戶hu覺jiao得de不bu知zhi所suo措cuo。(當然頁麵數量還是有點影響的)
流暢
zaibaozhenglechanpinjiemianqingxideqiantixia，jiemiandeliuchangxingkeyirangyonghuhechanpinzhijianchanshenglianghaodehudong。yigeyouxiudechanpin，zaiyonghushiyongdeguochengzhongbujinbuxuyaofuzadexuexijiunengshiyong，erqiehainenggaoxiaodeshiyong。
如何保證流暢性?很簡單，就是突出產品的核心。
womenshenghuozaiyigekuaisufazhandeshidai，zuorenheshiqingdourongyibeidarao，daozhiguochengzhongduan。suoyixiangyaoliuzhuyonghu，bixurangyonghumeiyoufudanqiebangzhuyonghukuaisuwanchengrenwu。zheyangcainengyingdeyonghudezunzhong。
想必所有人都在網上買過東西，不說遠的，就說說外賣。每當我們打開一款外賣App看到最多的永遠是商家吧?這些商家的排序是從距離最近的到距離最遠的，然後排除無法送達的。其實我想說：用戶會關心距離遠近麼?不要每次讓用戶打開你們的App時都是出現一樣的排序，記住用戶點餐時商家的記錄以及篩選出類似的商家排在前麵才是用戶關心的。這樣不至於每次打開App都要去重新搜索或翻半天記錄或者是找訂單。如果用戶記不住商家名稱呢?如果用戶不想點這家的但是想點同類的食物呢?
保持使用流暢的另一個說法就是高效。讓用戶快速的完成任務，才是App存在的理由。也不要以為用戶點了下單就不想刪減購物車的東西，留個路口讓用戶刪減多餘的商品而不是返回去重新操作。
流liu暢chang不bu是shi讓rang用yong戶hu別bie無wu選xuan擇ze的de去qu執zhi行xing你ni設she計ji的de任ren務wu，而er是shi引yin導dao用yong戶hu去qu做zuo正zheng確que的de選xuan擇ze。不bu要yao害hai怕pa讓rang用yong戶hu掌zhang握wo一yi切qie，也ye不bu要yao覺jiao得de你ni的de設she計ji就jiu是shi顯xian而er易yi見jian，這zhe世shi上shang從cong來lai沒mei有you顯xian而er易yi見jian的de事shi情qing存cun在zai。
統一
讓頁麵保持一致性。很多設計師在設計產品時，都會把統一性拋之腦後。統一性在設計過程中至少要做到:視覺、交互、結果統一。這樣不僅可以降低用戶學習成本，還能讓開發節省不少時間來做那些必要的東西。
jingchangyourenhuiwenyixieguanyujiemianshejidewenti。erfachulaidejiemianhenduoshihoudoushiqianhoubutongyi，shanggejiemiandexiayibuhaizaizuobian，daolexiageyemianjiudaoleyoubianle，wentayuanyinjiushuo：這個界麵的排版這樣放更好看點。其實這樣的回答很不專業。
在zai做zuo產chan品pin時shi，統tong一yi性xing是shi非fei常chang重zhong要yao的de，它ta是shi清qing晰xi和he流liu暢chang的de結jie果guo，要yao求qiu做zuo到dao自zi然ran而er然ran的de效xiao果guo。能neng夠gou通tong過guo巧qiao妙miao的de布bu局ju，來lai降jiang低di用yong戶hu的de認ren知zhi負fu擔dan。相xiang信xin大da家jia都dou聽ting過guo一yi句ju話hua：好的設計都是看不見的。這裏說的不是真的看不見(要真看不見還搞啥)，而(er)是(shi)說(shuo)讓(rang)用(yong)戶(hu)察(cha)覺(jiao)不(bu)到(dao)它(ta)的(de)存(cun)在(zai)是(shi)多(duo)餘(yu)的(de)。要(yao)做(zuo)到(dao)統(tong)一(yi)不(bu)僅(jin)要(yao)做(zuo)到(dao)均(jun)衡(heng)的(de)構(gou)圖(tu)，讓(rang)畫(hua)麵(mian)整(zheng)體(ti)具(ju)有(you)穩(wen)定(ding)性(xing)，還(hai)要(yao)透(tou)出(chu)空(kong)間(jian)感(gan)，不(bu)會(hui)使(shi)得(de)用(yong)戶(hu)覺(jiao)得(de)在(zai)使(shi)用(yong)的(de)過(guo)程(cheng)中(zhong)產(chan)生(sheng)擁(yong)擠(ji)的(de)念(nian)頭(tou)。而(er)創(chuang)新(xin)並(bing)給(gei)用(yong)戶(hu)帶(dai)來(lai)驚(jing)喜(xi)就(jiu)是(shi)後(hou)話(hua)了(le)。
美觀
其實美觀沒什麼好說的，因為每個人對它認知是不同的。新人覺得美觀是把一個界麵做到漂亮;而資深設計師就知道美觀是讓界麵的設計無瑕疵，整齊，細節完美。
簡單來說說美觀的幾個方麵:
文字：一個界麵要做到信息閱讀流暢，符合人們閱讀習慣。
顏色：不要為了突出設計感，就采用誇張的顏色來設計，有時候簡單的搭配反而更能體現出產品的功能。
圖標：大家都說一個交互設計師的功底是看交互設計文檔，那麼一個UI視覺設計師的功底看什麼呢?沒錯，就是圖標。
布局：youshihouyigejiemiandebujuhaohuaibunengwanquankanjiaohushejishi，zhelimianshijiaodeshejizhiguanzhongyao，jishizuodezailandebujudoushikeyitongguoshijiaoshejishilainizhuanqiankunde(不包括搗亂的那些孩子)。
再(zai)提(ti)一(yi)個(ge)點(dian)，動(dong)效(xiao)，當(dang)然(ran)動(dong)效(xiao)也(ye)屬(shu)於(yu)美(mei)觀(guan)中(zhong)的(de)一(yi)種(zhong)。近(jin)年(nian)非(fei)常(chang)流(liu)行(xing)動(dong)效(xiao)，很(hen)多(duo)設(she)計(ji)師(shi)沉(chen)迷(mi)其(qi)中(zhong)，然(ran)後(hou)在(zai)自(zi)己(ji)的(de)產(chan)品(pin)中(zhong)加(jia)入(ru)各(ge)式(shi)各(ge)樣(yang)的(de)動(dong)效(xiao)。其(qi)實(shi)，動(dong)效(xiao)是(shi)是(shi)一(yi)把(ba)雙(shuang)刃(ren)劍(jian)，這(zhe)裏(li)也(ye)不(bu)詳(xiang)說(shuo)了(le)，大(da)家(jia)有(you)需(xu)要(yao)我(wo)可(ke)以(yi)單(dan)獨(du)出(chu)一(yi)篇(pian)動(dong)效(xiao)的(de)文(wen)章(zhang)。隻(zhi)要(yao)在(zai)設(she)計(ji)的(de)過(guo)程(cheng)中(zhong)把(ba)控(kong)好(hao)度(du)，動(dong)效(xiao)是(shi)可(ke)以(yi)起(qi)到(dao)美(mei)化(hua)產(chan)品(pin)的(de)作(zuo)用(yong)的(de)。
總結
設計絕不是簡單的拚合，排列甚至編輯;設計是通過闡明，簡化、明確、xiushi，shizhizhuangyan，youshuofuxing，shenzhidaiyidianquweixing，laifuyuqijiazhijiyiyi。shuowanshangmianzhesigeyuanze，dajiakeyilianxizijidechanpinquxiangxiangshibushizhemehuishi。qingxi>流暢>統一>meiguan，yigehaodechanpinyidingshianzhaozhegeshunxulaishejichanpinde。zaizuoshejizhiqianyidingyaolijiexuqiuzaixiashou，ruguonidejiemianyijingmanzuxuqiu，jiubuyaozaijiaruqitayuansule，qianwanbuyaojiaodeyemiantaijiandandongxitaishao，wojiuyaojiaruqitadongxilaichongshi，zheyanghensha。
如果之前沒有考慮到這四個點來做設計，那從現在開始好好想想自己應該怎麼入手。
清晰，理解需求;流暢，明確用戶目標;統一，界麵元素保持一致;美觀，做到簡約而不簡單。
