首頁?>?知識(shí)?資訊?>?最簡單的網(wǎng)站設(shè)計(jì)案例?>?正文

最簡單的網(wǎng)站設(shè)計(jì)案例

2010/6/1 0:00:00 · 稿源:傳誠信

極簡主義是通過設(shè)計(jì)減少1只把最重要的因素。極簡跨度的多學(xué)科的表達(dá),以及其他藝術(shù)形式,如音樂和文學(xué)。對(duì)于網(wǎng)頁設(shè)計(jì)師,雖然,簡約可以恐嚇,難以掌握。

任何人都可以掌握極簡。從本質(zhì)上講,極簡主義是關(guān)于違約金的事情到了最起碼的設(shè)計(jì)要素的功能需要。這是關(guān)于到離現(xiàn)場沒有其他東西可以不與該設(shè)計(jì)的目的干擾刪除。下面是對(duì)簡約設(shè)計(jì)的一些原則,以及對(duì)當(dāng)前的趨勢(shì)和探索更多的例子。

少就是多

“少即是多”是可能的最低限度的運(yùn)動(dòng)最知名的口頭禪。它是由建筑師推廣在描述簡約美學(xué)密斯凡德羅。

在網(wǎng)頁設(shè)計(jì),少即是多是通過使用所必需的元素只有一個(gè)給定的設(shè)計(jì)實(shí)現(xiàn)。少用,以達(dá)到效果是更重要的是我們的目標(biāo)超過了設(shè)計(jì)的各個(gè)部分的總和。

范例

北王國
簡單,直接排版和色彩裸使用的設(shè)計(jì),為的美感,但很少。

Northkingdom in Principles Of Minimalist Web Design, With Examples

過夜
一個(gè)簡單的設(shè)計(jì),使含量高于所有其他元素。簡單的雙邊界的上方和下方有助于劃定某些地區(qū)不凌亂的設(shè)計(jì)內(nèi)容。

Sleepover in Principles Of Minimalist Web Design, With Examples

林德瓦爾A及D
簡單的線畫的一張椅子上,幾乎看不出來,如果你不會(huì)去尋找它,體現(xiàn)了“少即是多”的思想。

Lindvall in Principles Of Minimalist Web Design, With Examples

你的鄰居
另一個(gè)簡單的設(shè)計(jì),還有更多的圖形之一。

Yourneighbors in Principles Of Minimalist Web Design, With Examples

Sharpenr
簡單的導(dǎo)航和圖形添加到最低限度的總體感覺這里。該圖形是大膽,他們?cè)跊]有加入雜亂的視覺沖擊。

Sharpenr in Principles Of Minimalist Web Design, With Examples

省略不用的東西

在他們的著作 風(fēng)格的要素,施特龍克和白創(chuàng)造了“省略不必要的話?!边@是適應(yīng)簡約哲學(xué)“省略不必要的東西?!皳Q句話說,不包括在您的設(shè)計(jì)中不必要的元素。

想想什么是必要的內(nèi)容和您的網(wǎng)站功能。然后,只集中在那些東西,不遺漏任何直接貢獻(xiàn)無論是內(nèi)容或功能。請(qǐng)記住,雖然,一定的設(shè)計(jì)和圖形元素,將直接影響到您網(wǎng)站的可讀性或可用性。

范例

起了&
一個(gè)簡單的灰色背景,白色邊框周圍的圖像和簡單的排版是必要的最低限度此頁面元素。如果任何被拆除,該網(wǎng)站將沒有影響,但是它。

Upandonward in Principles Of Minimalist Web Design, With Examples

拉克倫貝利
一個(gè)單一的形象和垂直導(dǎo)航是因?yàn)樗兊煤唵巍?/p>

Lachlanbailey in Principles Of Minimalist Web Design, With Examples

薩拉爾廷
另外一個(gè)單一的形象和垂直導(dǎo)航的例子。

Sarahhultin in Principles Of Minimalist Web Design, With Examples

阿列克謝杜布羅夫斯基
這個(gè)網(wǎng)站更進(jìn)了一步,并忽略任何圖像,選擇僅1頭和簡單的導(dǎo)航代替。

Alekseidubrovsky1 in Principles Of Minimalist Web Design, With Examples

減去直到它突破

當(dāng)起草一個(gè)極其簡約設(shè)計(jì),盡量減去分子停止工作,直到設(shè)計(jì)的方式行事。當(dāng)網(wǎng)站上的突破的邊緣,你知道你所取得的最簡約的設(shè)計(jì)成為可能。

請(qǐng)記住,“休息”,是在設(shè)計(jì)相關(guān)。技術(shù)功能的方法只有一個(gè)衡量的東西壞了。易用性的考慮也同樣重要。請(qǐng)確保您的網(wǎng)站仍是用戶友好,提供了經(jīng)驗(yàn),你想旅客有。

范例

Anothercompany
一個(gè)有單列的身體和三欄頁腳簡約設(shè)計(jì)。如果任何元素被刪除,網(wǎng)站將不便于使用。

Anothercompany in Principles Of Minimalist Web Design, With Examples

工程在沉默
這個(gè)信息體系結(jié)構(gòu)的元素,包括崗位之間的路段和列之間的空白區(qū)域的邊界,是至關(guān)重要的一切保持視覺美觀,有組織,有可讀性。

Worksinsilence1 in Principles Of Minimalist Web Design, With Examples

布雷特阿瑟照片
另一個(gè)使用一個(gè)最小的元素很好的例子。

Brettarthur in Principles Of Minimalist Web Design, With Examples

丹尼蓋伊攝影
黑色的背景設(shè)置此除了許多其他超簡約設(shè)計(jì)。請(qǐng)注意在較低的形象權(quán)全屏幕選項(xiàng)。

Dannyguy in Principles Of Minimalist Web Design, With Examples

布賴恩丹納赫
另一個(gè)網(wǎng)站,選用了一個(gè)單柱和大膽的版式。

Briandanaher in Principles Of Minimalist Web Design, With Examples

每一個(gè)細(xì)節(jié)計(jì)數(shù)

在簡約的設(shè)計(jì),每一個(gè)細(xì)節(jié)具有重要意義。你選擇離開,是至關(guān)重要的。阿邊界附近的圖像,顏色調(diào)色板,白色的空間,每一個(gè)部分成為重要的整體外觀和感覺時(shí),該網(wǎng)站的內(nèi)容很少。

想想你想要的感覺,讓您的網(wǎng)站訪問者,然后決定的細(xì)節(jié),將傳授這種感覺。雖然許多設(shè)計(jì)師認(rèn)為簡約是一刀切,但仍有個(gè)別設(shè)計(jì)元素為基礎(chǔ)的不同的情感空間。一個(gè)簡約質(zhì)樸的網(wǎng)站可以很容易地與現(xiàn)代,清新,含蓄和復(fù)雜,精致典雅,或任何在兩者之間,完全基于其細(xì)節(jié)。

范例

執(zhí)行編輯
如在頭超大字體和元素之間的邊界詳細(xì)細(xì)令行政編輯網(wǎng)站脫穎而出。

Executiveedits in Principles Of Minimalist Web Design, With Examples

恭Szczupak攝影
微妙的程式化的箭頭和下拉陰影是,增加這個(gè)網(wǎng)站的視覺吸引力的重要細(xì)節(jié)。

Christinaszczupak in Principles Of Minimalist Web Design, With Examples

黎晃
這里的細(xì)節(jié),圓形,灰色框,紅色字體的效果,肯定加起來也超過了個(gè)人部分的總和。

Khahoang in Principles Of Minimalist Web Design, With Examples

一個(gè)君子規(guī)則
一切都在頂部從厚厚的黑邊到本網(wǎng)站版式組合使優(yōu)雅和成熟。

Rulesofagentleman in Principles Of Minimalist Web Design, With Examples

瑞安威姆斯
間距和內(nèi)容安排在這里,伴隨著優(yōu)雅的字體和簡單的線條,為重新設(shè)計(jì)。

Ryanwillms in Principles Of Minimalist Web Design, With Examples

視覺技工
這比許多簡約更詳細(xì)的網(wǎng)站,特別是在邊境及其他微妙的圖形。

Visualcraftsman in Principles Of Minimalist Web Design, With Examples

Electricgecko
淡淡的顏色框后面的內(nèi)容設(shè)置此設(shè)計(jì)外。

Electricgecko in Principles Of Minimalist Web Design, With Examples

顏色微創(chuàng)

顏色呈現(xiàn)在一個(gè)簡約的設(shè)計(jì)更加重要。選擇正確的調(diào)色板或口音的顏色是至關(guān)重要的。許多設(shè)計(jì)者選擇一個(gè)簡單的黑色,白色和/或灰色的調(diào)色板,但簡約中任何有彩虹色的余地。

細(xì)節(jié)一樣,用較少的顏色變成關(guān)鍵要素。注意你的顏色選擇,以及它們?nèi)绾闻c他人交往的意義。

范例

凱爾索倫貝格設(shè)計(jì)
微妙的柔和色彩設(shè)置除了某些內(nèi)容在這里。

Kylesollenberger in Principles Of Minimalist Web Design, With Examples

Pixelbot網(wǎng)頁設(shè)計(jì)
鮮艷的顏色,否則站出來反對(duì)這種非黑即白的設(shè)計(jì)。

Pixelbot in Principles Of Minimalist Web Design, With Examples

MattBango.com
微妙的藍(lán)色色調(diào),但強(qiáng)調(diào)這另有黑色,白色和灰色的設(shè)計(jì)特別的地方。

Mattbango in Principles Of Minimalist Web Design, With Examples

第二和公園
暗色調(diào)的工作做好了簡約的設(shè)計(jì),特別是與灰色相結(jié)合。

Secondandpark in Principles Of Minimalist Web Design, With Examples

Glinga
帶有灰色背景和彩色口音簡單的網(wǎng)站。

Glinga in Principles Of Minimalist Web Design, With Examples

Deartoy
另一個(gè)簡單的設(shè)計(jì)彩色口音。

Deartoy in Principles Of Minimalist Web Design, With Examples

Superawesome
洋紅是一個(gè)最低限度的網(wǎng)站受歡迎口音的顏色。

Superawesome in Principles Of Minimalist Web Design, With Examples

一個(gè)生活的思考
一個(gè)有很多比許多其他網(wǎng)站的網(wǎng)站色彩簡約,但調(diào)色板是經(jīng)過深思熟慮的。

Thinkingforaliving in Principles Of Minimalist Web Design, With Examples

國家
另一個(gè)偉大的調(diào)色板色彩的網(wǎng)站。

Nation in Principles Of Minimalist Web Design, With Examples

白色的空間是至關(guān)重要的

白色(或負(fù))空間是任何簡約設(shè)計(jì)骨干。你離開了一個(gè)設(shè)計(jì)同樣重要,因?yàn)槟氵M(jìn)去是空白的關(guān)鍵,強(qiáng)調(diào)對(duì)他人的某些內(nèi)容。

白色空間“,使”設(shè)計(jì)簡約,在很大程度上。沒有它,你最終得到一個(gè)網(wǎng)格設(shè)計(jì)或油漬或其他樣式的并不是真正的最低限度。

范例

Rikcat產(chǎn)業(yè)
充足的元素之間的空間不斷從凌亂的感覺這個(gè)網(wǎng)站。

Rikcatindustries in Principles Of Minimalist Web Design, With Examples

直道
另外一個(gè)空白的元素噸左右的例子。

Straightline in Principles Of Minimalist Web Design, With Examples

UX的52周
灌裝頁面上的每一個(gè)欄是沒有必要,就證明對(duì)UX的網(wǎng)站的52個(gè)星期在這里。

52weeksofux in Principles Of Minimalist Web Design, With Examples

地鐵畫廊
地鐵畫廊付出非常關(guān)注白色空間,降低了信件的權(quán)利在其類別頭間距。

Metrogallery in Principles Of Minimalist Web Design, With Examples

空白工作室
充足的空白,是用在這里。

Blankstudio in Principles Of Minimalist Web Design, With Examples

趨勢(shì)

在北京有很多簡約的設(shè)計(jì)趨勢(shì)。有些已出現(xiàn)了這么久,“趨勢(shì)”,甚至可能是不正確的詞來使用。在任何情況下,下列因素,正處于良好的使用各種簡約設(shè)計(jì)。

灰色

灰色簡約的設(shè)計(jì)是至關(guān)重要的。它的燈罩是用于背景,文本,圖像和幾乎所有其他要素往往有黑色和白色或其他顏色組合。

布賴恩霍夫
灰色可作為口音,不只是字體或背景。

Brianhoff in Principles Of Minimalist Web Design, With Examples

邁克爾克羅寧
當(dāng)然,也使一個(gè)灰色的大背景顏色,它會(huì)呈現(xiàn)出冷靜,與冰冷的藍(lán)色基調(diào)相結(jié)合。

Michaelcronin in Principles Of Minimalist Web Design, With Examples

羅斯甘
另一個(gè)灰色的背景非常簡單的設(shè)計(jì)。

Rossgunter in Principles Of Minimalist Web Design, With Examples

排序設(shè)計(jì)
中型的灰色允許與活版印刷對(duì)比度好,同時(shí)也使在后臺(tái)強(qiáng)于淺灰色的影響。

Sortdesign in Principles Of Minimalist Web Design, With Examples

杰克奧斯本
灰色使得它尤其適合對(duì)梯度。

Jackosborne in Principles Of Minimalist Web Design, With Examples

5平方
結(jié)合多種色調(diào)的灰色借給沒有雜亂的視覺興趣。

5squared in Principles Of Minimalist Web Design, With Examples

大字體

大字體常用于圖像的地方來添加更多的圖形感興趣的網(wǎng)站。

艾倫布萊克設(shè)計(jì)
超大字體用于整個(gè)網(wǎng)站。

Blakeallendesign in Principles Of Minimalist Web Design, With Examples

凱爾斯蒂德
大字體標(biāo)題是一個(gè)最低限度的熱門選擇。它使一個(gè)影響,同時(shí)也傳達(dá)重要信息。

Kylesteed in Principles Of Minimalist Web Design, With Examples

EndGrain
在另一頭超大的例子。

Endgrain in Principles Of Minimalist Web Design, With Examples

Dunnodt
結(jié)合不同大小的字體是一個(gè)偉大的方式來增加視覺趣味而不凌亂。

Dunnodt in Principles Of Minimalist Web Design, With Examples

文字是圖片
大字體也很流行的口音,而不是一個(gè)聯(lián)絡(luò)點(diǎn)。

Wordsarepictures in Principles Of Minimalist Web Design, With Examples

賴恩埃文斯
另一個(gè)網(wǎng)站,結(jié)合了多種字體大小。這是一個(gè)非常適合網(wǎng)頁時(shí)沒有多少內(nèi)容。

Ryanevans in Principles Of Minimalist Web Design, With Examples

微小的小人
不同類型的大小和顏色,使設(shè)計(jì)為逮捕。

Tinyvillain in Principles Of Minimalist Web Design, With Examples

司巴黎
另一個(gè)很好的例子,在大字體的標(biāo)題。

Divisionparis in Principles Of Minimalist Web Design, With Examples

背景圖案和圖像

微妙的背景圖案和大膽的圖像可以添加一個(gè)巨大的利益,最低限度的視覺設(shè)計(jì)。

Jeroenhoman.com
一個(gè)微妙的油漬模式給這個(gè)設(shè)計(jì)一個(gè)緊張的感覺。

Jeroenhoman in Principles Of Minimalist Web Design, With Examples

曼集團(tuán)
保持在灰度圖像的背景雜波增加而沒有增加視覺趣味。

Neimangroup in Principles Of Minimalist Web Design, With Examples

IdeaPaint
一個(gè)大背景仍然是最低限度的圖像時(shí),該網(wǎng)站的其他內(nèi)容很簡單。

Ideapaint in Principles Of Minimalist Web Design, With Examples

班頓
在細(xì)致的紋理,并在這背景圖案是美觀而不被壓倒。

Bunton in Principles Of Minimalist Web Design, With Examples

弗朗切斯科豐特
另一種微妙的油漬格局。

Francescofonte in Principles Of Minimalist Web Design, With Examples

凱特琳沃辛頓攝影
這灰褐色油漬模式是意料中事。

Caitlinworthington in Principles Of Minimalist Web Design, With Examples

簡單的網(wǎng)格

網(wǎng)格不一定是自然簡約,但簡單的可以把以裸設(shè)計(jì)。

菲茨羅伊和芬蘭
簡單的網(wǎng)格,為組織同樣大小的圖像意義。

Fitzroyandfinn in Principles Of Minimalist Web Design, With Examples

新品牌
像這樣簡單的網(wǎng)格組織不增加復(fù)雜性。

Brandnew in Principles Of Minimalist Web Design, With Examples

設(shè)計(jì)沃普
更傳統(tǒng)的網(wǎng)格設(shè)計(jì),具有大量的空白讓看事情很少。

Designwoop in Principles Of Minimalist Web Design, With Examples

福蒂恩
另一種使用簡單的網(wǎng)格,以組織圖像很好的例子,這包括文本的時(shí)間。

Fortyone in Principles Of Minimalist Web Design, With Examples

事情
這看起來簡單的網(wǎng)格掩蓋了仔細(xì)的念頭在它去了。

Things1 in Principles Of Minimalist Web Design, With Examples

企業(yè)風(fēng)險(xiǎn)觀賞
這是一套,除了由電網(wǎng)的鋪設(shè),在導(dǎo)航以上(效果訪問該網(wǎng)站的檢查出來)和微妙的網(wǎng)格線。

Corporateriskwatch in Principles Of Minimalist Web Design, With Examples

積極憂郁
像這樣簡單的電網(wǎng)工程,以及舉辦不同大小的圖像,也。

Positivelymelancholy in Principles Of Minimalist Web Design, With Examples

界上可以找到許多簡約網(wǎng)站。我不知道誰喜歡設(shè)計(jì)界更傾向于有一個(gè)最低限度的審美界還是選擇適合簡約的設(shè)計(jì),因?yàn)樗麄兲貏e好。在任何情況下,各界都經(jīng)常發(fā)現(xiàn)在頁眉和也被用于航海口音。

iLTD
一個(gè)簡單的圓形圖案的頭。

Iltd1 in Principles Of Minimalist Web Design, With Examples

西蒙J亨特
另一個(gè)在頭圈,這與一個(gè)字母的時(shí)間。

Simonjhunter in Principles Of Minimalist Web Design, With Examples

弗蘭克奇梅羅
另一個(gè)標(biāo)志圓形會(huì)標(biāo)。

Frankchimero in Principles Of Minimalist Web Design, With Examples

Indextwo
而另一位。

Indextwo in Principles Of Minimalist Web Design, With Examples

徠卡
徠卡的標(biāo)志是一個(gè)明亮的紅色圓圈,在其產(chǎn)品和營銷材料,包括其網(wǎng)站上使用。

Leica in Principles Of Minimalist Web Design, With Examples

印務(wù)局
而另一位。

Ioadv in Principles Of Minimalist Web Design, With Examples

保佑
這樣的循環(huán)肩章也很受歡迎。

Bless in Principles Of Minimalist Web Design, With Examples

亞歷康奈爾
一個(gè)更抽象的設(shè)計(jì)與圓形標(biāo)志。

Alexcornell in Principles Of Minimalist Web Design, With Examples

羅亞爾
圈子不僅用于標(biāo)識(shí),雖然。這里有一個(gè)用圓圈內(nèi)容很好的例子。

Royale in Principles Of Minimalist Web Design, With Examples

獎(jiǎng)金:透明度

這是不是一個(gè)真正的趨勢(shì)本身,因?yàn)樗皇墙?jīng)常出現(xiàn)在簡約的設(shè)計(jì)。但它可以使一個(gè)巨大的視覺沖擊力及應(yīng)該得到更多的設(shè)計(jì)師使用最低限度。

幻燈片新聞
標(biāo)志中的透明度,讓這個(gè)設(shè)計(jì)巧妙的無雜波創(chuàng)造新的問題。

Slideshowpress in Principles Of Minimalist Web Design, With Examples

更多的例子

下面是一些例子,激勵(lì)你。

Brancozero
Brancozero in Principles Of Minimalist Web Design, With Examples

FLOWmarket
Flowmarket in Principles Of Minimalist Web Design, With Examples

馬戲家族
Circusfamily in Principles Of Minimalist Web Design, With Examples

Reknit
Reknit in Principles Of Minimalist Web Design, With Examples

德古拉工作室
Draculastudio in Principles Of Minimalist Web Design, With Examples

扎卡里普爾曼
Zacharypulman in Principles Of Minimalist Web Design, With Examples

Laboixeta
Laboixeta in Principles Of Minimalist Web Design, With Examples

SkilledConcept
Skilledconcept in Principles Of Minimalist Web Design, With Examples

天與我的父親
Dayswithmyfather in Principles Of Minimalist Web Design, With Examples

NeueBlanc
Neueblanc in Principles Of Minimalist Web Design, With Examples

Winkreative
Winkreative in Principles Of Minimalist Web Design, With Examples

Madewithpixels
Madewithpixels in Principles Of Minimalist Web Design, With Examples

痤瘡生產(chǎn)
Acneproduction in Principles Of Minimalist Web Design, With Examples

?

選擇北京網(wǎng)站建設(shè)公司-傳誠信,優(yōu)質(zhì)服務(wù),絕對(duì)不容錯(cuò)過 !
1. 優(yōu)秀的網(wǎng)絡(luò)資源,穩(wěn)定的網(wǎng)站和速度保證?
配送雙線獨(dú)立ip空間,國際A級(jí)BGP機(jī)房,99.5% 的主機(jī)在線時(shí)間)?
2. 7年北京網(wǎng)站建設(shè)經(jīng)驗(yàn),優(yōu)秀的技術(shù)和設(shè)計(jì)水平,更放心?
3. 全程省心服務(wù),不必?fù)?dān)心自己不懂網(wǎng)絡(luò),更省心。?

-----------------------------------------------------------------------------------------------------
我們的與眾不同之處:

??? 免費(fèi)網(wǎng)絡(luò)營銷顧問:我們?yōu)槟峁┟赓M(fèi)的網(wǎng)絡(luò)營銷顧問服務(wù),您需要了解關(guān)于如何開展網(wǎng)絡(luò)營銷,電子商務(wù),網(wǎng)站設(shè)計(jì)等的事宜,歡迎隨時(shí)聯(lián)系我們。

??? seo友好的網(wǎng)站管理系統(tǒng):除了優(yōu)質(zhì)的網(wǎng)站空間,網(wǎng)站管理系統(tǒng),和網(wǎng)站設(shè)計(jì)外,我們的網(wǎng)站管理系統(tǒng)更是seo友好的,包括:自定義欄目名,Google Sitemap自動(dòng)生成,靜態(tài)頁面生成等等,讓您的網(wǎng)站。

???? 免費(fèi)網(wǎng)絡(luò)營銷培訓(xùn):如何更好的投放網(wǎng)絡(luò)廣告,如何提高網(wǎng)絡(luò)廣告的投資回報(bào),如何發(fā)帖子,
??? ?如何優(yōu)化網(wǎng)站,我們有豐富的經(jīng)驗(yàn)開放給您!祝君成功!

聯(lián)系我們:010-62199213 62122723-808 賈先生
北京網(wǎng)站建設(shè)公司-傳誠信網(wǎng)站:jzztb.org.cn?點(diǎn)擊查看經(jīng)典網(wǎng)站案例!

北京傳誠信網(wǎng)站建設(shè)2010年建站套餐及優(yōu)惠!點(diǎn)擊查看!

?
  • 相關(guān)推薦
  • 大家在看
熱文
  • 熱門
  • 最新
客戶服務(wù)
咨詢熱線

010-62199213

24小時(shí)咨詢熱線

139-1050-5354