移動(dòng)端網(wǎng)頁(yè)界面設計標準規范技巧
我們知道網(wǎng)頁(yè)的外觀(guān)設計得好、好用和能使用在各種設備是今天看上去最重要的事情。響應式網(wǎng)頁(yè)成功的關(guān)鍵是能適配各種用戶(hù)設備。本篇文章不僅僅適用于移動(dòng)端的網(wǎng)頁(yè),也同樣適用于移動(dòng)APP上的字體設計。 移動(dòng)網(wǎng)站界面設計+字體相關(guān)的技巧鄭州清新教育的老師今天總結了7條法則如下:
1. 讓他可讀性高
無(wú)論如何你的網(wǎng)站上的文本必須使人容易閱讀。如果一個(gè)網(wǎng)站的文字閱讀起來(lái)很有挑戰,用戶(hù)很顯然不會(huì )去看它,這意味著(zhù)你將失去潛在的客戶(hù)。在移動(dòng)端屏幕變小,還有各種反光和倒影會(huì )讓文字更難讀。移動(dòng)端文字有它固有的標準(如:一般在2×的設計稿中文字最小可讀是24PX),文字不能過(guò)于單薄也不能有太多色彩,所有的“手段”都必需使文字更加容易閱讀。
2. 建立視覺(jué)層次
訪(fǎng)問(wèn)者一般用快速掃描的方式查看你的網(wǎng)站。在視覺(jué)設計上用一些技巧告訴用戶(hù)那些文本是最重要的,他們應該集中注意力看。
你可以突出你的網(wǎng)站優(yōu)勢,因而讓用戶(hù)去關(guān)注你希望他們關(guān)注的內容上。那怕是在移動(dòng)端,用戶(hù)再如何快速的掃描信息,也不致于忽略關(guān)鍵內容,一旦產(chǎn)生興趣,他們就能成為潛在客戶(hù),產(chǎn)生購買(mǎi)、成為會(huì )員、或者你會(huì )收獲更多。
3. 考慮用戶(hù)
想想用戶(hù)使用網(wǎng)站的場(chǎng)景,您的網(wǎng)頁(yè)設計元素應該讓他們感到溫馨。
如果他們習慣了網(wǎng)站上使用那些現代而精致的字體,如果突然出現其他字體,他們會(huì )覺(jué)得蹩腳或不知所措。
你的網(wǎng)站的字體選擇應該有一個(gè)基調,讓訪(fǎng)問(wèn)者舒適,并熟悉。
4. 對比的創(chuàng )意
在平面設計中 玩對比已經(jīng)是一種常見(jiàn)的方式。您必需使用對比色,來(lái)增加可讀性。如果文字的色彩很重,那么配色淺色的背景會(huì )更加易讀,背景和字體色彩過(guò)于相似會(huì )難以閱讀,或者背景過(guò)于花哨也會(huì )顯得閱讀困難和檔次低。
也可以在排版中用文字玩對比(如粗細對比、大小對比和疏密對比等),如果所有的文字都很相似,你的作品將失去視覺(jué)層次,并顯得很平庸。
5. 使用同一套風(fēng)格的字體去設計
網(wǎng)頁(yè)設計中字體的選擇是一件困難的事情,那么多的字體可選,會(huì )讓人困惑。
最好的組合方式是使用同一個(gè)系列的字體,或者是由同一個(gè)設計師設計的字體。
在一些情況下,字體并沒(méi)有粗體和多個(gè)字體樣式供我們使用,這個(gè)時(shí)候你可以找找同一個(gè)設計師做的字體,它們可能擁有相似的特性,讓你的設計顯得更加“和諧”。
6. 限制字體的種類(lèi)
不管你如何使用字體設計和排版,有一條不變的法則,不要使用太多字體,專(zhuān)家建議使用2到3種適宜。
雖然這條建議非常好,但是也不是絕對,一些情況下,多種字體也能做出特殊效果。但是大多數情況下,過(guò)多的字體意味著(zhù)缺乏設計和亂。
讓網(wǎng)站調用系統字體不僅僅影響網(wǎng)站的視覺(jué)外觀(guān)而且會(huì )對WEB頁(yè)面的性能有巨大影響,英文最好使用woff (Web Open Font Format),可惜中文由于字體數量大導致文件體積過(guò)大,不適合做woff。
字體太多 = 較慢的加載時(shí)間,一個(gè)網(wǎng)站加載時(shí)間過(guò)長(cháng)則意味著(zhù)用戶(hù)的流逝。
7. 不要忘記測試體驗一下
如果你不去實(shí)踐,任何的規則和理論都是沒(méi)有意義的。
用各種移動(dòng)設備去試試你的網(wǎng)頁(yè),看看文本閱讀是否流程,在小屏幕可讀性還是否OK。什么樣的設計概念都是用來(lái)打破的,一旦你運用到實(shí)踐中,可能你就需要有調整,以便于獲取最佳效果。
<< 上一篇:網(wǎng)站頁(yè)面如何設計實(shí)現良好布局? | >> 下一篇:網(wǎng)頁(yè)設計中如何打造線(xiàn)上品牌 |
- 2019-08-13網(wǎng)頁(yè)設計中要怎么做好內頁(yè)布局設計
- 2019-07-10網(wǎng)頁(yè)設計的工作是如何進(jìn)行的
- 2019-07-04日系風(fēng)格海報設計的常用技巧
- 2019-06-29網(wǎng)頁(yè)設計在網(wǎng)站建設中的重要性
- 2019-06-24平面設計作品提升質(zhì)感的圖文排版技巧
- 2019-06-20網(wǎng)頁(yè)設計師如何設計好看的banner
- 2019-06-18網(wǎng)頁(yè)設計中平面構成如何排版
- 2019-06-09網(wǎng)頁(yè)設計中的美觀(guān)性具體體現
- 2019-05-22網(wǎng)頁(yè)設計規范制作的技巧有哪些
- 2019-05-18高逼格的海報設計小技巧總結
- 2019-05-17平面設計中讓作品更精致的方法技巧
- 2019-05-09網(wǎng)頁(yè)專(zhuān)題頁(yè)面設計的基本方法
- 2019-05-06網(wǎng)頁(yè)設計的常用技巧有哪些
- 2019-04-30網(wǎng)頁(yè)設計運營(yíng)如何優(yōu)化用戶(hù)體驗
- 2019-04-26平面版式設計中文字的排版實(shí)用技巧
- 1 室內設計培訓課程 人咨詢(xún)中 19
- 2 平面設計培訓課程 人咨詢(xún)中 18
- 3 網(wǎng)頁(yè)設計培訓課程 人咨詢(xún)中 18
- 4 淘寶開(kāi)店培訓課程 人咨詢(xún)中 15
- 5 動(dòng)漫設計培訓課程 人咨詢(xún)中 12
- 6 淘寶美工培訓課程 人咨詢(xún)中 17
- 7 電腦辦公培訓課程 人咨詢(xún)中 15
- 8 網(wǎng)絡(luò )營(yíng)銷(xiāo)培訓課程 人咨詢(xún)中 13
- 9 模具設計培訓課程 人咨詢(xún)中 10
- 10 網(wǎng)站開(kāi)發(fā)培訓課程 人咨詢(xún)中 16