[網(wǎng)頁(yè)設(shè)計(jì)]這三件事網(wǎng)頁(yè)設(shè)計(jì)師該向印刷設(shè)計(jì)學(xué)習(xí)

2022-06-14    分類(lèi): 網(wǎng)站建設(shè)

創(chuàng)新互聯(lián)告訴您了解這3條經(jīng)典準(zhǔn)則,能協(xié)助你發(fā)明十分好、更易懂的頁(yè)面規(guī)劃:

很多經(jīng)典準(zhǔn)則,例如那些字體規(guī)劃準(zhǔn)則,在線上依然有用。為環(huán)視而規(guī)劃時(shí),有兩種形式需求思考。

首先是F形式。

F形式排版:Creative Bloq的主頁(yè)

F形式反映了用戶(hù)最一般的環(huán)視頁(yè)面的方法。他們的視野從上面開(kāi)端橫向移動(dòng),然后沿著左面筆直移動(dòng),尋覓杰出的文字。

一旦找到激起他們興趣的內(nèi)容,他們又會(huì)開(kāi)端橫向閱覽頁(yè)面。

還有Z形式:

Z形式規(guī)劃:MailChimp的主頁(yè)

Z形式也是一種自然的閱覽形式,一般用于報(bào)紙,頁(yè)面上也是如此。用戶(hù)在頁(yè)面頂部水平閱覽,然后向左下移動(dòng),在頁(yè)面的下一行再次進(jìn)行水平移動(dòng)搜索。

文字

和打印相同,頁(yè)面文字也應(yīng)當(dāng)有明晰的層次。選擇合適的字號(hào),有助于關(guān)鍵字在頁(yè)面上杰出,讓用戶(hù)更輕松的閱覽頁(yè)面。

明晰的文字層次:World Baking Day網(wǎng)站

咱們來(lái)看看文字層次中一些多見(jiàn)的層級(jí):

首要:頁(yè)面上最明顯的文字更大更閃爍,招引用戶(hù)的留意力。一般用于標(biāo)題與裝修。

非必須:介于中心的一切內(nèi)容。不像標(biāo)題那么明顯,但要在頁(yè)面的慣例文字中杰出顯現(xiàn)。

再次:首要內(nèi)容所選的文字。文字層次中的這一級(jí),有助于運(yùn)用戶(hù)沉浸在正文中。

其他:更小的一級(jí),運(yùn)用斜體、粗體、下劃線、不一樣顏色等等。

合作運(yùn)用,樹(shù)立文字的層次,能夠發(fā)明出次序,避免用戶(hù)迷失其間。

要測(cè)驗(yàn)?zāi)沩?yè)面的易讀性,能夠運(yùn)用“3秒準(zhǔn)則”:簡(jiǎn)略地閱覽頁(yè)面,然后看向別處。其間杰出的內(nèi)容有沒(méi)有反映出你規(guī)劃目的?假如是的,那你方向準(zhǔn)確,持續(xù)堅(jiān)持;假如不是,則需求打回從頭規(guī)劃——也許的確如此。

02. 樹(shù)立平衡感

不管平衡感來(lái)自于對(duì)稱(chēng)、非對(duì)稱(chēng)或是放射狀,都是為了讓規(guī)劃發(fā)明出安定與共同的感受。假如用戶(hù)在你的頁(yè)面上感到輕松,他們會(huì)更情愿停留。

圖像或文字不要過(guò)于密布:時(shí)間思考元素的空隙。排版傾向于簡(jiǎn)練——密布的規(guī)劃會(huì)阻礙用戶(hù)。雙眼難以承受凌亂,使人更難承受信息的流通。

思考運(yùn)用極簡(jiǎn)的規(guī)劃,經(jīng)過(guò)白色、黑色或十分深的布景和遠(yuǎn)景元素到達(dá)平衡。《為人眼進(jìn)行頁(yè)面UI規(guī)劃》里討論過(guò),負(fù)空間的運(yùn)用能夠引導(dǎo)用戶(hù)的留意力。

震懾的極簡(jiǎn)規(guī)劃事例:鞋類(lèi)品牌ETQ的網(wǎng)站

上面展示的ETQ網(wǎng)站,利用了負(fù)空間將視野引向所陳設(shè)的商品。頁(yè)面底部比照明顯的黑白色塊,讓用戶(hù)選擇尺度或檢查商品價(jià)格。

頁(yè)面上極少攪擾信息,發(fā)明了一種平靜與次序的感受——當(dāng)然,也期望有助于促進(jìn)用戶(hù)購(gòu)買(mǎi)。

03. 發(fā)明牢靠的規(guī)劃

讓你的規(guī)劃關(guān)于一切用戶(hù)都是牢靠的。不要運(yùn)用兩種以上的字體,保證一切年齡層的用戶(hù)都能閱覽。過(guò)于凌亂會(huì)打亂信息。

假如你發(fā)現(xiàn)自個(gè)在屏幕前不知所措,你的規(guī)劃也許就包含了太多的圖像。

選擇配色計(jì)劃時(shí)也要時(shí)間為用戶(hù)思考——假如是醫(yī)院網(wǎng)站,運(yùn)用鎮(zhèn)定柔和的顏色;假如受眾是青少年,則合適更明顯的顏色。

UC San Diego Health的網(wǎng)站選用的配色很符合它嚴(yán)厲的內(nèi)容

下面是一些書(shū)本規(guī)劃中常犯的過(guò)錯(cuò),相同適用于頁(yè)面:

未經(jīng)過(guò)滿(mǎn)足的測(cè)驗(yàn):一直要盡也許廣泛對(duì)規(guī)劃進(jìn)行測(cè)驗(yàn)。內(nèi)容也許會(huì)跨過(guò)多種前言(頁(yè)面、電子書(shū)、打印品),這會(huì)使得文字有新面貌。而且,有些字體轉(zhuǎn)換到新前言上也許會(huì)變得不易閱覽。找到適用于一切情境的字體十分重要。還要思考你的規(guī)劃在不一樣屏幕尺度、不一樣分辨率和不一樣閱覽器中怎么展示。

不恰當(dāng)?shù)恼Z(yǔ)調(diào):為每個(gè)頁(yè)面元素選擇準(zhǔn)確的語(yǔ)調(diào)。與字體相同,標(biāo)題應(yīng)當(dāng)招引讀者留意,副標(biāo)題作為標(biāo)題的說(shuō)明或彌補(bǔ),正文要像一段友愛(ài)的對(duì)話——溫暖親熱,讓讀者巴望了解更多信息。

不恰當(dāng)?shù)母袷剑鹤駨哪闼x的前言:不然,會(huì)一直浪費(fèi)時(shí)間修正文件,應(yīng)對(duì)CMYK用于打印、RGB用于網(wǎng)站這么的疑問(wèn)。

想要了解更多有用的UI與UX規(guī)劃竅門(mén),這可以協(xié)助你加速規(guī)劃流程設(shè)計(jì)。

新聞名稱(chēng):[網(wǎng)頁(yè)設(shè)計(jì)]這三件事網(wǎng)頁(yè)設(shè)計(jì)師該向印刷設(shè)計(jì)學(xué)習(xí)
鏈接地址:http://www.muchs.cn/news0/166950.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供靜態(tài)網(wǎng)站、網(wǎng)站維護(hù)、App設(shè)計(jì)小程序開(kāi)發(fā)、微信公眾號(hào)、標(biāo)簽優(yōu)化

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

外貿(mào)網(wǎng)站建設(shè)