網頁設計的清晰定義
來(lai)自(zi)世(shi)界各地的(de)設(she)(she)(she)計師在看(kan)到(dao)一個網(wang)頁設(she)(she)(she)計時大吃(chi)一驚，并(bing)稱贊“它既漂亮又干(gan)凈！”。 有無數專門針對“干(gan)凈”設(she)(she)(she)計的(de)網(wang)站設(she)(she)(she)計評論，并(bing)且該術語通常在網(wang)站設(she)(she)(she)計社(she)區中使用(yong)。 可(ke)以(yi)輕松(song)找到(dao)干(gan)凈設(she)(she)(she)計的(de)一個很好的(de)例(li)子(zi)，因(yin)為(wei)它可(ke)以(yi)提(ti)高一定的(de)**素養和質(zhi)量(liang)。 但是經常討(tao)論構成這些“干(gan)凈”外觀的(de)基本(ben)原(yuan)理和因(yin)素，而這正是打(da)算(suan)在此問題上做的(de)。
網站上應(ying)(ying)使用(yong)簡潔的設(she)計(ji)，以便使網站的目的顯而易(yi)見。 但是(shi)(shi)(shi)在(zai)設(she)計(ji)“干凈”的場(chang)所時(shi)，必須考(kao)慮(lv)純粹的美學元(yuan)素(su)和創造力。 您應(ying)(ying)該(gai)問(wen)如何改進它(ta)，而不(bu)是(shi)(shi)(shi)詢問(wen)可以刪除什么（在(zai)極簡設(she)計(ji)的情況下）。 如果我(wo)只用(yong)一(yi)個詞來定(ding)義“干凈”的設(she)計(ji)，那將是(shi)(shi)(shi)完美的。 每個單獨的元(yuan)素(su)都應(ying)(ying)該(gai)屬于它(ta)，并(bing)且(qie)應(ying)(ying)該(gai)從總(zong)體設(she)計(ji)中受益并(bing)對其進行補充。 需要平(ping)衡總(zong)體設(she)計(ji)，以使信息流和易(yi)于使用(yong)。 在(zai)最終設(she)計(ji)之(zhi)前，需要仔(zi)細檢(jian)查每個元(yuan)素(su)。 設(she)計(ji)人員(yuan)應(ying)(ying)該(gai)花一(yi)點(dian)時(shi)間考(kao)慮(lv)每個元(yuan)素(su)的目的，并(bing)確定(ding)它(ta)是(shi)(shi)(shi)否可能是(shi)(shi)(shi)最好(hao)的，以及是(shi)(shi)(shi)否可以使其更清晰。
1.像素完美的細節
注意細(xi)(xi)節對于(yu)產生干(gan)凈的(de)(de)(de)網頁(ye)設(she)計(ji)(ji)(ji)(ji)至(zhi)關重要。 真正出色，干(gan)凈的(de)(de)(de)設(she)計(ji)(ji)(ji)(ji)依(yi)賴(lai)于(yu)許多精(jing)致設(she)計(ji)(ji)(ji)(ji)元(yuan)素(su)的(de)(de)(de)像(xiang)(xiang)素(su)的(de)(de)(de)完美執行(xing)(xing)。 看起來(lai)像(xiang)(xiang)邊(bian)(bian)框，高光，陰影(ying)，紋理(li)和許多其他細(xi)(xi)節的(de)(de)(de)細(xi)(xi)微(wei)細(xi)(xi)節都需要仔細(xi)(xi)考慮。 在(zai)某(mou)些(xie)主題設(she)計(ji)(ji)(ji)(ji)可(ke)(ke)能只實(shi)現大膽的(de)(de)(de)圖(tu)像(xiang)(xiang)滑塊的(de)(de)(de)地方(fang)，Studeo的(de)(de)(de)功能區是精(jing)美設(she)計(ji)(ji)(ji)(ji)細(xi)(xi)節的(de)(de)(de)天堂(tang)。 注意覆蓋圖(tu)像(xiang)(xiang)的(de)(de)(de)細(xi)(xi)微(wei)紋理(li)，一個(ge)像(xiang)(xiang)素(su)的(de)(de)(de)高光和底(di)部幾乎(hu)(hu)看不見的(de)(de)(de)淺灰(hui)色邊(bian)(bian)框。 所有這些(xie)細(xi)(xi)節似乎(hu)(hu)微(wei)不足道(dao)，甚至(zhi)可(ke)(ke)能不會(hui)被某(mou)些(xie)人忽(hu)視(shi)，但是它們共同(tong)創(chuang)造(zao)了品質和精(jing)致感。 選擇(ze)此(ci)設(she)計(ji)(ji)(ji)(ji)時(shi)，準(zhun)確性是關鍵(jian)。 可(ke)(ke)能會(hui)破壞干(gan)凈場地設(she)計(ji)(ji)(ji)(ji)的(de)(de)(de)一件事是可(ke)(ke)怕的(de)(de)(de)半像(xiang)(xiang)素(su)。 當形(xing)(xing)狀(zhuang)的(de)(de)(de)線(xian)條和邊(bian)(bian)緣(yuan)未在(zai)像(xiang)(xiang)素(su)上精(jing)確對齊(qi)時(shi)，半像(xiang)(xiang)素(su)可(ke)(ke)能會(hui)出現在(zai)Photoshop中。 發生這種(zhong)(zhong)(zhong)情況(kuang)(kuang)時(shi)，形(xing)(xing)狀(zhuang)的(de)(de)(de)邊(bian)(bian)緣(yuan)會(hui)變(bian)得(de)模(mo)糊(hu)。 您可(ke)(ke)以(yi)在(zai)下面的(de)(de)(de)圖(tu)像(xiang)(xiang)中看到右側的(de)(de)(de)正方(fang)形(xing)(xing)稍微(wei)模(mo)糊(hu)了。 在(zai)Photoshop中進行(xing)(xing)設(she)計(ji)(ji)(ji)(ji)時(shi)防止這種(zhong)(zhong)(zhong)情況(kuang)(kuang)的(de)(de)(de)一種(zhong)(zhong)(zhong)方(fang)法是選擇(ze)“對齊(qi)像(xiang)(xiang)素(su)”選項(xiang)。 無論何時(shi)選擇(ze)此(ci)選項(xiang)，所有形(xing)(xing)狀(zhuang)的(de)(de)(de)邊(bian)(bian)緣(yuan)都將變(bian)得(de)清晰整潔。
2.間距
不(bu)用(yong)說，干凈的(de)(de)(de)設(she)計(ji)不(bu)會以任何方(fang)(fang)式顯得(de)凌亂。 但是，許多局促在一起(qi)的(de)(de)(de)元素(su)(su)會使網站(zhan)看(kan)(kan)起(qi)來(lai)凌亂。 不(bu)是我們(men)想要(yao)的(de)(de)(de)。 這(zhe)是間(jian)隔的(de)(de)(de)來(lai)源。 空白，邊距(ju)，填充(chong)和行高在實現(xian)干凈的(de)(de)(de)網站(zhan)設(she)計(ji)中都起(qi)著(zhu)至(zhi)關重要(yao)的(de)(de)(de)作用(yong)。 為網站(zhan)的(de)(de)(de)元素(su)(su)提(ti)供適當的(de)(de)(de)間(jian)距(ju)可(ke)以確保它們(men)看(kan)(kan)起(qi)來(lai)和適合(he)整體設(she)計(ji)。 足夠的(de)(de)(de)間(jian)距(ju)還將使網站(zhan)具有透明和優雅的(de)(de)(de)感覺。 除(chu)了確保元素(su)(su)間(jian)距(ju)合(he)理外，還必須與確定的(de)(de)(de)值保持一致。 盡可(ke)能在合(he)理的(de)(de)(de)地方(fang)(fang)重復邊距(ju)和填充(chong)值。
3.對齊
網格(ge)系統是(shi)可以(yi)(yi)用來幫助(zhu)您(nin)創(chuang)建(jian)“干凈”網站設(she)計的(de)最佳工具之(zhi)一(yi)。 我們(men)已(yi)經討(tao)論過它們(men)在(zai)間(jian)距方面(mian)(mian)如何非(fei)常(chang)有(you)用，但是(shi)它們(men)對(dui)(dui)(dui)于(yu)確保(bao)(bao)對(dui)(dui)(dui)齊(qi)(qi)也非(fei)常(chang)有(you)價值。 就像(xiang)間(jian)距一(yi)樣，對(dui)(dui)(dui)齊(qi)(qi)方式可能會對(dui)(dui)(dui)網站的(de)外觀(guan)產生(sheng)重大(da)影響。 正確且連(lian)續的(de)對(dui)(dui)(dui)齊(qi)(qi)可以(yi)(yi)使整(zheng)(zheng)個生(sheng)產線(xian)(xian)(xian)貫穿您(nin)場地(di)設(she)計的(de)整(zheng)(zheng)個長度和寬度。 線(xian)(xian)(xian)條(tiao)流(liu)暢流(liu)暢，視覺上令人(ren)愉悅，并且可以(yi)(yi)將(jiang)(jiang)視線(xian)(xian)(xian)引導(dao)到頁面(mian)(mian)底部。 眼睛對(dui)(dui)(dui)對(dui)(dui)(dui)準(zhun)的(de)變化非(fei)常(chang)敏感，可以(yi)(yi)檢測到微小的(de)變化和不(bu)一(yi)致(zhi)性。 因此，重要的(de)是(shi)，不(bu)僅要在(zai)創(chuang)建(jian)設(she)計模(mo)型時實現(xian)像(xiang)素的(de)完美(mei)，而且在(zai)隨后的(de)開發階段也不(bu)要失去這種準(zhun)確性。 理想情(qing)況下(xia)(xia)，在(zai)大(da)多數情(qing)況下(xia)(xia)，大(da)部分(fen)文(wen)本應保(bao)(bao)持(chi)對(dui)(dui)(dui)齊(qi)(qi)。 左對(dui)(dui)(dui)齊(qi)(qi)的(de)文(wen)本會產生(sheng)實線(xian)(xian)(xian)，并創(chuang)建(jian)易于(yu)區(qu)分(fen)的(de)信(xin)息列。 另一(yi)方面(mian)(mian)，居中對(dui)(dui)(dui)齊(qi)(qi)的(de)文(wen)本將(jiang)(jiang)在(zai)兩(liang)側形成不(bu)平(ping)坦的(de)邊緣，并且可能難以(yi)(yi)在(zai)大(da)列中閱(yue)讀。 保(bao)(bao)存中心對(dui)(dui)(dui)齊(qi)(qi)以(yi)(yi)縮短文(wen)本行(xing)。
蘇公網安備32030302000492號
