大多數(shù)網(wǎng)頁設(shè)計師在其職業(yè)生涯的早期就了解KISS。那你怎么辦呢?創(chuàng)建一個簡單的設(shè)計要比你想象的要復(fù)雜一些。這里有七個設(shè)計規(guī)則,可幫助你消除所有混亂并創(chuàng)建一個精美簡單的帳戶。接下來專業(yè)網(wǎng)站設(shè)計公司Angle就帶大家去看一下吧。
1.每頁設(shè)定一個目標(biāo)
簡單設(shè)計的開始從項目目標(biāo)和網(wǎng)站每一頁的特定目標(biāo)開始。每個頁面應(yīng)引導(dǎo)用戶執(zhí)行一項操作,但導(dǎo)航和頁腳除外。這可以是任何事情,例如單擊鏈接,以表格形式輸入信息,觀看視頻或玩游戲。但是每個頁面都應(yīng)專注于單個用戶操作或轉(zhuǎn)換。太多的事情會使用戶不知所措。他們可能會忽略應(yīng)該完成哪些操作,并可能做出較不理想的選擇。計劃網(wǎng)站設(shè)計,以便每個頁面將用戶引導(dǎo)到一個目標(biāo)。同一頁面上的滾動條上方和滾動條下方的每個可操作按鈕都應(yīng)執(zhí)行相同的操作。這種一致性可以幫助用戶了解他們?yōu)槭裁丛谀愕木W(wǎng)站上以及應(yīng)該做什么;這些選擇的簡單性使設(shè)計變得輕松而引人入勝。
2.堅持兩種類型字體
有太多的設(shè)計指南為項目推薦了三種字體。你可以使用兩個健壯的類型族來進(jìn)一步簡化該過程。尋找一個包含多個權(quán)重的類型族,在常規(guī)和粗體或黑色選項之間要有足夠的對比度。要獲得更出色的顯示效果,請選擇一種顯示選項,其中包括一些可以在超大標(biāo)題中使用的備用字符。然后,你所需要做的就是將主體字體和顯示字體進(jìn)行混合和匹配,以使整個設(shè)計中的字體得到很好的組合。就像你為特定的粗細(xì)或樣式選擇更多具有特定用途的選項一樣,使用兩個類型族。你會發(fā)現(xiàn)這可以幫助您創(chuàng)建易于管理且具有視覺一致性的高度可讀且易于使用的排版調(diào)色板。
3.使用一致的對齊方式
左中至右,無論你喜歡哪種對齊方式,在整個設(shè)計過程中都要堅持下去。這包括對齊類似的項目,例如文本框和元素,它們彼此不同但可以組合在一起。更重要的是,這種一致的對齊方式會與其他標(biāo)題和CTA對保持一致。對齊方式與滑塊的流量匹配,滑塊的流量也沿互補方向移動。對于文本元素,左對齊和居中對齊是最常見的選項,因為它們最易讀。對于較長的文本,左對齊是首選。
4.建立層次結(jié)構(gòu)
用戶不必考慮要看什么或如何在設(shè)計中移動。即使是最簡單的視覺作品也應(yīng)具有獨特的層次結(jié)構(gòu)。它始于主導(dǎo)視覺。它可以是圖像,視頻或文本顯示,也可以是第一印象的任何其他內(nèi)容。然后應(yīng)該有某種文本告訴用戶設(shè)計和網(wǎng)站正在嘗試交流的內(nèi)容。這通常是以與主要視覺效果兼容的簡單標(biāo)題的形式。第三是用戶要完成的第二部分文字或操作。最終的視覺元素是導(dǎo)航菜單。用戶期望找到所有這些元素,并且訓(xùn)練眼睛基本按此順序在元素之間移動。通過這種方式進(jìn)行設(shè)計,使它們變得容易。
5.給元素足夠的空間
如果你現(xiàn)在還不知道,請將其提交到內(nèi)存:空白是你的朋友。給網(wǎng)站設(shè)計中的每個元素留出足夠的空間??臻g將有助于吸引人們對單個元素的關(guān)注,占用“空間”,這樣你就不會試圖將畫布弄得亂七八糟,并有助于創(chuàng)建具有焦點的整體設(shè)計。充分利用空間的訣竅是一致性。為圍繞單個元素或在文本行之間適合的空間量設(shè)置規(guī)則。如果設(shè)計最終看起來過于貧瘠,則可能需要稍微縮短間距。當(dāng)你重新打開設(shè)計并轉(zhuǎn)到你要用戶首先看到的地方時,你會知道間距是正確的。(不確定它們是什么?回到第4點-建立層次結(jié)構(gòu)。)
6.放大對比
高對比度的設(shè)計元素-從顏色選擇到元素的大小,即使在最小的框架下,也可以為項目提供所需數(shù)量的視覺效果。對于時髦的選項,請嘗試使用鮮明對比的調(diào)色板來吸引用戶的注意力。與黑白選項相比,大膽的顏色會使簡單的設(shè)計更復(fù)雜,更有趣。為了充分利用對比色,請從色輪上相反的位置選擇具有相似飽和度的色相。如果你不喜歡該選項,請嘗試其他基于色輪的對。(你甚至可能會發(fā)現(xiàn)一個意外的新喜歡項,例如上面的紫色和藍(lán)綠色組合。)
7.使用一致的圖標(biāo)和元素
設(shè)計的一致性是殺手級設(shè)計中最好的(也是最壞的)秘密之一。這是因為設(shè)計項目中雜亂無章的多種按鈕樣式或社交媒體圖標(biāo)而與網(wǎng)站的其他圖標(biāo)不匹配的情況下,人們經(jīng)常忘記這些事情之一。用戶界面元素不應(yīng)該是事后的想法。重要的是創(chuàng)建圖標(biāo)和用戶界面元素集以及規(guī)則,并以相同的方式在整個項目中使用它們。(如果你不想從頭開始創(chuàng)建圖標(biāo)字體或用戶界面元素套件,甚至可以購買或下載。)為元素選擇一種顏色,對每個元素使用相同的懸停動作或效果(一種用于可單擊的元素,另一種用于不可單擊的元素),并根據(jù)使用情況調(diào)整大小。(對于圖形更多的元素,既有圖標(biāo)大小又有超大尺寸選項是可以接受的。)
一個簡單的網(wǎng)站設(shè)計不必完全最小化,也不必缺少有趣的元素或用戶界面。一個簡單的設(shè)計就是高度可用和直觀的設(shè)計,使用戶可以毫無疑問或復(fù)雜的指令參與。盡管可以放置更復(fù)雜的網(wǎng)站或與用戶互動,但大多數(shù)網(wǎng)站設(shè)計都可以從KISS方法中受益。不要想太多,用戶也不必這樣做。本期專業(yè)網(wǎng)站設(shè)計公司Angle就給大家分享到這里。
2020-12-02
2021-07-07
2021-09-23
2024-05-13
2020-06-29
2020-09-26
2020-05-11
2020-04-21
2020-03-06
2021-01-19
2020-11-05
2020-11-12
2020-04-09
2020-12-12
2020-12-02
2020-12-15
2021-10-15
2021-01-13
2024-06-15
2020-10-27