張經(jīng)理 / 18665606093
Email / service@2000new.com
掃一掃添加顧問
在過去的幾年里,廣州許多新興的網(wǎng)頁(yè)設(shè)計(jì)趨勢(shì)正在逐漸成為主流,引領(lǐng)我們走向未來。其中,極簡(jiǎn)網(wǎng)頁(yè)設(shè)計(jì)正式成為其中之一。極簡(jiǎn)設(shè)計(jì)風(fēng)格不會(huì)隨著時(shí)間而褪色。自現(xiàn)代主義運(yùn)動(dòng)以來,它一直活躍在各種設(shè)計(jì)相關(guān)領(lǐng)域。現(xiàn)在,為什么不能成為網(wǎng)頁(yè)設(shè)計(jì)的潮流?
極簡(jiǎn)設(shè)計(jì)除了看起來美觀,還能提升用戶體驗(yàn)。多年來,用戶一直抱怨網(wǎng)站導(dǎo)航復(fù)雜,網(wǎng)站布局復(fù)雜。太多內(nèi)容被擠在同一個(gè)頁(yè)面,使得整個(gè)用戶體驗(yàn)直線下降。在設(shè)計(jì)領(lǐng)域,“少即是多”常常被用來形容極簡(jiǎn)風(fēng)格。時(shí)至今日,這句話依然適用,尤其是對(duì)于進(jìn)入21世紀(jì)的網(wǎng)頁(yè)設(shè)計(jì)而言。
1.擁抱平面設(shè)計(jì)
眾所周知,平面設(shè)計(jì)風(fēng)格正在逐漸取代以蘋果的skeuomorphism為代表的寫實(shí)風(fēng)格,蘋果本身也在打造自己的平面設(shè)計(jì)風(fēng)格,用大膽明亮的色彩來吸引用戶的注意力。
獲取新技能!設(shè)計(jì)完美極簡(jiǎn)網(wǎng)站的六個(gè)步驟
另一個(gè)積極擁抱平面設(shè)計(jì)時(shí)尚的先鋒是微軟。微軟的windows phone和windows 8系列操作系統(tǒng)就是扁平化設(shè)計(jì)風(fēng)格的典型例子,現(xiàn)在微軟官網(wǎng)已經(jīng)實(shí)施了扁平化設(shè)計(jì)到底。這意味著微軟一直在整個(gè)平臺(tái)上實(shí)施扁平化設(shè)計(jì)。
所以微軟網(wǎng)站上感覺不到陰影和漸變,一切都在2D平面上。標(biāo)題和正文的字體沒有紋理點(diǎn)綴,頁(yè)面布局干凈清爽。圖標(biāo)和按鈕充滿了扁平化設(shè)計(jì),甚至windows 8 start界面背景中的元素也是扁平化設(shè)計(jì)。
2.留空
無論你習(xí)慣稱之為負(fù)空間還是空白空間,引導(dǎo)你關(guān)注網(wǎng)頁(yè)的重要內(nèi)容都是非常巧妙的,也是極簡(jiǎn)風(fēng)格的典型特征。越來越多的網(wǎng)站開始使用這種設(shè)計(jì),設(shè)計(jì)師逐漸意識(shí)到這種設(shè)計(jì)有多有用。
最簡(jiǎn)單的案例就是常用的搜索引擎:谷歌和百度。它們是空白空間的例子,所有無關(guān)緊要的元素都被移除,搜索框吸引了所有用戶的注意力。留白或負(fù)空間的存在是極簡(jiǎn)主義最明顯的特征。他們的存在并不意味著那些地方?jīng)]有內(nèi)容。它們與它們所引發(fā)的主要元素相互依存。
3.選擇有限
對(duì)于任何一個(gè)電子商務(wù)或者B2B網(wǎng)站,網(wǎng)站設(shè)計(jì)的主要目的之一就是提高網(wǎng)站轉(zhuǎn)化率,降低網(wǎng)站用戶選擇的難度。當(dāng)你把不必要的選擇從網(wǎng)站上去掉,用戶受無效信息的干擾就少了,就更容易達(dá)到目的,轉(zhuǎn)化率自然也就提高了。所以,選擇有限也是極簡(jiǎn)網(wǎng)站的一大特色。獲取新技能!設(shè)計(jì)完美極簡(jiǎn)網(wǎng)站的六個(gè)步驟
極簡(jiǎn)網(wǎng)站的登陸頁(yè)面是最適合展示“有限選擇”魅力的地方。庚子就是這樣的情況。作為專業(yè)的字幕翻譯公司,更高的登錄頁(yè)面只有一個(gè)輸入框和一個(gè)翻譯按鈕I,用戶根本不需要做選擇。他們只能輸入內(nèi)容然后翻譯(當(dāng)然要收費(fèi))。當(dāng)然,對(duì)于那些狂熱的極簡(jiǎn)主義者來說,更高可能不夠純粹,因?yàn)轫敳康膶?dǎo)航條還是有干擾用戶視覺的可能性。
4.專注排版
如果你真的想了解更多極簡(jiǎn)設(shè)計(jì)的精髓,請(qǐng)登陸布萊恩丹納赫的網(wǎng)站。布萊恩是一名設(shè)計(jì)師、插畫師和藝術(shù)總監(jiān)。如你所見,它的網(wǎng)站主要依靠?jī)煞N主要的設(shè)計(jì)方法:粗體字體和你永遠(yuǎn)不會(huì)錯(cuò)過的單列布局。就這么簡(jiǎn)單!雖然這看起來有點(diǎn)簡(jiǎn)單粗暴,但布萊恩的設(shè)計(jì)達(dá)到了兩個(gè)關(guān)鍵目標(biāo):
獲取新技能!設(shè)計(jì)完美極簡(jiǎn)網(wǎng)站的六個(gè)步驟
1.導(dǎo)航欄以單列的形式設(shè)計(jì)。主要信息清晰直觀地展現(xiàn)在用戶面前。布賴恩是誰(shuí),他做什么,他的作品是什么,如何聯(lián)系他,這些都清晰地顯示在屏幕上。
2.布萊恩成功地利用對(duì)比(字體與背景的顏色對(duì)比,字體與大小對(duì)比)向用戶呈現(xiàn)感興趣的內(nèi)容。
5.簡(jiǎn)化導(dǎo)航欄
我們?cè)谟懻摌O簡(jiǎn)網(wǎng)站時(shí),往往忽略了導(dǎo)航欄菜單的設(shè)計(jì)??梢宰龅煤艽?,以增強(qiáng)網(wǎng)站的視覺感,也可以整合到網(wǎng)站的背景中,以無聲、不受干擾的方式呈現(xiàn)。
獲取新技能!設(shè)計(jì)完美極簡(jiǎn)網(wǎng)站的六個(gè)步驟
看看攝影師兼設(shè)計(jì)師克里斯蒂安奧登內(nèi)茲(Cristian Ordonez)是如何設(shè)計(jì)網(wǎng)站的。在他的網(wǎng)站上,導(dǎo)航條并不像其他網(wǎng)站那樣橫跨網(wǎng)站頂部,導(dǎo)航條的項(xiàng)目只是靜靜的放在右上角。由于不再有下拉菜單,因此不再有圖層。菜單的顏色也巧妙地融入了背景。
6.使用色標(biāo)
網(wǎng)站設(shè)計(jì)中合理使用小色塊可以讓用戶更容易注意到頁(yè)面的重要部分。960網(wǎng)格系統(tǒng)網(wǎng)站就是一個(gè)例子。960網(wǎng)格系統(tǒng)希望簡(jiǎn)化網(wǎng)站的開發(fā)過程,所以965網(wǎng)格系統(tǒng)網(wǎng)站本身就靈活使用網(wǎng)格系統(tǒng),分塊顯示不同的內(nèi)容。黃色的“查看演示”在黑底白字的網(wǎng)站上非常明顯,左上角的Twitter圖標(biāo)直接鏈接到網(wǎng)站主設(shè)計(jì)師納森史密斯的Twitter上。