漂亮而不空洞的極簡網(wǎng)站設(shè)計(jì)

2024-01-23    分類: 網(wǎng)站建設(shè)

作為設(shè)計(jì)師,我們都知道,一個(gè)極簡的設(shè)計(jì)可以實(shí)現(xiàn)漂亮的效果。

然而,很多設(shè)計(jì)師在實(shí)現(xiàn)上有些麻煩:要么是沒有時(shí)間讓使用如此少的元素制作的頁面看起來漂亮,要么就是最終的結(jié)果只是看起來“不完美”。

網(wǎng)上有很多關(guān)于極簡主義設(shè)計(jì)的文章,而本文的目的是幫你實(shí)現(xiàn)一個(gè)漂亮而不空洞的極簡網(wǎng)站設(shè)計(jì)

最重要的是,我們將展示一個(gè)小的極簡網(wǎng)站設(shè)計(jì)畫廊,這樣你就可以分析為什么一些設(shè)計(jì)可以而其它的則不可以。

什么是極簡主義設(shè)計(jì)

極簡主義設(shè)計(jì)已經(jīng)被描述為最基本的設(shè)計(jì),剔除了多余的元素、色彩、形狀和紋理。

它的目的是使內(nèi)容被突出出來并成為焦點(diǎn)。從一個(gè)視覺的角度來說,極簡主義設(shè)計(jì)意味著平靜和將思想帶回本真。

這個(gè)設(shè)計(jì)運(yùn)動始于瑞士,然后被用于多種媒體:圖形設(shè)計(jì)、建筑、音樂、文學(xué)、繪畫以及最近的網(wǎng)頁設(shè)計(jì)。(拓展閱讀維基百科:極簡主義)

盡管極簡主義已經(jīng)有幾十年了,早期的互聯(lián)網(wǎng)并沒有能夠展示它。即便除了旋轉(zhuǎn)的logo、滾動和鮮艷的色彩之外,網(wǎng)站設(shè)計(jì)依然常常是雜亂和咄咄逼人的。

我們將在本文中討論極簡網(wǎng)站設(shè)計(jì)的基本原理。但是即便你選擇不去追求極簡主義的審美,本文也能幫你簡化你的設(shè)計(jì),無論你是哪種風(fēng)格。

越簡單越豐富

正如提到的,極簡主義將最重要的內(nèi)容帶到最前面并為用戶避免分散注意力。如果一個(gè)頁面有太多的元素,瀏覽者將迷惑于去看哪里或誤解每個(gè)元素的優(yōu)先級。一個(gè)極簡主義設(shè)計(jì)將焦點(diǎn)正好放到正確的內(nèi)容上。

比如,在一個(gè)黑白設(shè)計(jì)上的任何色斑,都會引起用戶的注意力。色彩本身也將成為焦點(diǎn)。讓我們來看一個(gè)具體的例子:

之前你或許已經(jīng)見到此類設(shè)計(jì):純白背景,一個(gè)內(nèi)容塊和一個(gè)圖形元素。

圖形元素使用色彩、紋理和形狀。很明顯這是頁面中最重要的元素,而且它代表了設(shè)計(jì)師的品牌和個(gè)性。

因?yàn)檫@個(gè)特殊的圖形元素的復(fù)雜性,該頁面中的更多內(nèi)容會讓它不太醒目,顯得不太重要。保持內(nèi)容到最小,設(shè)計(jì)師就實(shí)現(xiàn)了完美的平衡。

如何簡化內(nèi)容

實(shí)現(xiàn)極簡設(shè)計(jì)或者簡化設(shè)計(jì)的第一步,不是簡單的去掉大部分圖片,而是要重新考慮內(nèi)容并將其簡化到無遮蓋的需求。只有那樣才能讓頁面中最重要的元素實(shí)現(xiàn)其預(yù)期的效果。

就像你策劃任何其它網(wǎng)站一樣,寫下你需要的內(nèi)容:logo、介紹、導(dǎo)航等等。去掉其它一切不需要的東東。盡可能的丟掉它們。

下面是一些你可能不需要的元素。請注意這僅僅是一個(gè)指導(dǎo)。你的確切的需求將依賴于你的具體設(shè)計(jì)。下面的一些元素對你的網(wǎng)站來說可能不是必須的。

社區(qū)媒體的圖標(biāo)或圖形,或者社區(qū)媒體部分 宣傳員和補(bǔ)充說明或介紹 “推薦,” “流行”和“最新”列表(包括Twitter和RSS訂閱列表) 多于3個(gè)主要部分的頁面(比如“介紹” “關(guān)于”和“服務(wù)”) 次級導(dǎo)航頁面 這里的關(guān)鍵并非讓網(wǎng)站有較少的功能,而是去掉不是必要的元素(從而強(qiáng)調(diào)必須的元素)或?qū)⒍鄠€(gè)部分整合到一個(gè)更簡單的布局(比如,通過合并你的社區(qū)媒體鏈接到“關(guān)于”或介紹性部分)。

你也可以分割內(nèi)容到獨(dú)立的頁面,給予內(nèi)容的每個(gè)部分更多關(guān)注。

如何簡化設(shè)計(jì)

現(xiàn)在輪到盡可能的簡化設(shè)計(jì)了。

簡約設(shè)計(jì)應(yīng)該有較少的紋理、色彩、形狀、線條、內(nèi)容或排版。然而,如果太直白,設(shè)計(jì)將會空洞。與其丟掉所有東西,不如通過給焦點(diǎn)添加一個(gè)重要的特征來給設(shè)計(jì)一些感染力。

選擇焦點(diǎn)可能的樣式,并在你的設(shè)計(jì)過程中注意一下下面提到的技巧。

使用一個(gè)很棒的線框

通過理論下面的展示,我們看到一些設(shè)計(jì)師通過微妙的色彩填充、獨(dú)特布局或有趣的圖形添加一些視覺趣味。然而,或許他們所依賴的最重要的元素,就是一個(gè)獨(dú)特的線框。

為這樣的網(wǎng)頁創(chuàng)建一個(gè)線框需要一些額外的注意事項(xiàng)。通過正確的線框,你可以實(shí)現(xiàn)正確的層級和組織以及創(chuàng)建正確的視覺趣味。

要啟動一個(gè)線框,請按照以下步驟:

確定你絕對需要的內(nèi)容 在一個(gè)列表里面,區(qū)分內(nèi)容的優(yōu)先級 給予你的列表繪制線框的草圖以實(shí)驗(yàn)最佳的視覺層級 當(dāng)作出了線框之后,考慮一下布置以及視覺上的處理方法。譬如,你的logo使用了一種在其它地方不再重用的顏色,你必須說明原因。

擴(kuò)展閱讀:從線框圖到最終設(shè)計(jì)

空白

空白實(shí)際上同義與極簡主義。

無論你的設(shè)計(jì)多么有創(chuàng)意,一個(gè)缺少大量空白的極簡主義設(shè)計(jì)不是一個(gè)真正的極簡主義設(shè)計(jì)。這樣,一定要在元素周圍比你平時(shí)添加更多的空白。

空白對平衡即將出現(xiàn)在頁面中的少量元素是必要的。

平衡、對齊、對比

雖然大部分的布局可以通過空白和良好的線框?qū)崿F(xiàn),還是要特別注意一下設(shè)計(jì)的基本原則。與極簡設(shè)計(jì)相關(guān)的三個(gè)最重要的因素是平衡、對齊和對比。

要確保您的設(shè)計(jì)遵循這些原則,但并不需要一個(gè)補(bǔ)充的視覺輔助以看起來“完成”了。

請同時(shí)注意其它基本設(shè)計(jì)原理。回檢它們并實(shí)驗(yàn)不同的選擇來實(shí)現(xiàn)最佳的效果。查看 “設(shè)計(jì)的原理”以獲取更多參考。

當(dāng)過度設(shè)計(jì)成為一個(gè)習(xí)慣

過度設(shè)計(jì)有時(shí)會成為一種習(xí)慣。無論你多么艱難的嘗試將一個(gè)設(shè)計(jì)保持簡單,它最終變得凌亂和復(fù)雜。要修正這一點(diǎn),我們必須養(yǎng)成新的習(xí)慣。

試著在每個(gè)項(xiàng)目之前回顧上面的技巧并讓它們貫穿整個(gè)設(shè)計(jì)流程。每次集中精力開發(fā)一個(gè)習(xí)慣。比如,努力在將內(nèi)容放到空白上之前減少和簡化它們。

如果您發(fā)現(xiàn)自己左右為難,“有什么遺漏了”,可以先試著把東西拿出來,而不是加入一些新的東西。

極簡主義的每一個(gè)方面,需要不同的天賦。你將這些原理實(shí)踐的越多,你的設(shè)計(jì)就將變得越簡單。

另外,一旦你使用了這里討論到的技術(shù),看一下最終的產(chǎn)品并查看一下你是否能找到更進(jìn)一步簡化這個(gè)結(jié)果的方法。

你可以專注于在設(shè)計(jì)過程中你不能確定的區(qū)域,而且你也可以向其他設(shè)計(jì)師詢問以指出你可能遺漏的元素。

極簡網(wǎng)站設(shè)計(jì)欣賞

下面是一個(gè)極簡主義網(wǎng)站設(shè)計(jì)的簡要展示??匆幌挛覀冇懻摰脑硎侨绾螌?shí)現(xiàn)的。同樣也可以看一下哪個(gè)打破了我們的指南,并思考它們?yōu)槭裁催€可行。

一些趨勢

正如你能看到的,極簡主義網(wǎng)站設(shè)計(jì)也有一些清晰的趨勢。了解這些趨勢有助于在多個(gè)方面增強(qiáng)我們的設(shè)計(jì)。

我們應(yīng)不僅僅能從其它設(shè)計(jì)師創(chuàng)造的布局中獲得靈感,還要能有意識地打破這些趨勢以形成我們自己的創(chuàng)造性的方法。

接下來讓我們討論一下一些趨勢。

黑白設(shè)計(jì)

最值得注意的趨勢之一就是黑白色彩的廣泛應(yīng)用。這是很明顯的:除紋理、形狀和內(nèi)容以外,色彩也是應(yīng)該被簡化的。但最近它可以做過頭,就顯得有點(diǎn)沉悶。

看一下上面展示的一些確定色彩的網(wǎng)站,看一下它們是如何從其它極簡網(wǎng)站中被突出出來的。同樣,思考一下即便是在如此強(qiáng)烈的色彩使用下它們是如何能夠保持極簡的。 有趣的排版

基于排版網(wǎng)站設(shè)計(jì)和極簡主義緊密的聯(lián)系到一起。

當(dāng)設(shè)計(jì)師乏于用別的方法激發(fā)用戶,他們往往會利用有趣的排版。用排版作為唯一的視覺元素你甚至可以走得更遠(yuǎn)。

這是一個(gè)大膽的技術(shù),但本身仍然是一個(gè)趨勢。尋找保持獨(dú)特的同時(shí)讓排版增強(qiáng)設(shè)計(jì)的方法。

Flash

一個(gè)驚人數(shù)量的極簡主義網(wǎng)站設(shè)計(jì)是基于Flash的。通過這么少的視覺刺激,一個(gè)設(shè)計(jì)可以從微妙的動畫獲益而不用被壓倒。

同時(shí),F(xiàn)lash移除了設(shè)計(jì)流程中的某些限制。非傳統(tǒng)的線框、排版和其它元素可以比傳統(tǒng)方法更容易的實(shí)現(xiàn)。

結(jié)束

極簡主義網(wǎng)站設(shè)計(jì)出現(xiàn)多種形式,可是我們常常看到相同的形式重復(fù)了。趨勢可以變得咄咄逼人,而我們在理解一個(gè)趨勢可行的同時(shí)必須與模仿的沖動做斗爭

無論如何,極簡主義可以是很漂亮的而且將會在未來幾年內(nèi)出現(xiàn),所以學(xué)習(xí)它的一些技術(shù)會不能相信的有益,無論對你的客戶或你自己的項(xiàng)目。

但是如果你對極簡主義風(fēng)格不感興趣,這個(gè)教程和難懂的原理可以幫你簡化你的設(shè)計(jì),總之這是件好事情

本文來源于成都網(wǎng)站建設(shè)公司與成都網(wǎng)站設(shè)計(jì)制作公司-創(chuàng)新互聯(lián)成都公司!

網(wǎng)站題目:漂亮而不空洞的極簡網(wǎng)站設(shè)計(jì)
文章地址:http://www.muchs.cn/news25/315025.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供定制開發(fā)、企業(yè)建站網(wǎng)站收錄、營銷型網(wǎng)站建設(shè)、手機(jī)網(wǎng)站建設(shè)電子商務(wù)

廣告

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

h5響應(yīng)式網(wǎng)站建設(shè)