極簡主義網(wǎng)站設(shè)計(jì)的案例發(fā)布者：本站     時(shí)間：2019-11-13 09:11:05

極簡主義網(wǎng)站設(shè)計(jì)是一門被低估的藝術(shù)，我們都聽過“少即是多”的說法，但這是一個(gè)說起來容易做起來難的原則。隨著技術(shù)的進(jìn)步為網(wǎng)站設(shè)計(jì)開辟了新的更多可能性，越來越難以抗拒添加一些花哨的裝飾。

極簡主義的網(wǎng)站設(shè)計(jì)有利于用戶更快的加載時(shí)間和更好的匹配屏幕尺寸之間的兼容性。更重要的是，一個(gè)簡單的UI設(shè)計(jì)與移動(dòng)瀏覽相協(xié)調(diào)，不會(huì)損害桌面或用戶體驗(yàn)。

極簡主義哲學(xué)的核心思想是必須圍繞內(nèi)容進(jìn)行網(wǎng)站設(shè)計(jì)的，在網(wǎng)站術(shù)語中，設(shè)計(jì)人員從粗糙的內(nèi)容開始，然后構(gòu)建足夠的用戶界面來確定他們的目標(biāo)并輕松地導(dǎo)航到它。

頂部CSS動(dòng)畫的例子，以及如何編碼他們

極簡主義美學(xué)是這種哲學(xué)的視覺表現(xiàn)，極簡主義的設(shè)計(jì)使用了大量的白色，或者至少是統(tǒng)一的顏色、空間，但不要把簡潔和無趣混為一談。你必須小心選擇你的頁面布局，否則你有限的調(diào)色板設(shè)計(jì)元素會(huì)給人沉悶而不是優(yōu)雅的印象。

下面，我們收集了我們非常喜歡的極簡主義網(wǎng)站設(shè)計(jì)，希望能給你的極簡網(wǎng)站設(shè)計(jì)帶來靈感。

01、HalloBasis

這個(gè)網(wǎng)站只是用一些超大的元素來陳述

（圖片來源：HalloBasis）

杜塞爾多夫設(shè)計(jì)工作室以能夠很好地代表客戶進(jìn)行項(xiàng)目溝通而自豪。這個(gè)WordPress網(wǎng)站作為工作室的在線投資組合網(wǎng)站，是一個(gè)與眾不同的極簡主義網(wǎng)站設(shè)計(jì)的光輝典范。

由于其超大的美學(xué)效果，該網(wǎng)站用很少的元素做出了一個(gè)大膽的聲明，這增加了輔助訪問的額外好處。事實(shí)上，你可能會(huì)認(rèn)為你選擇的瀏覽器的縮放功能已經(jīng)達(dá)到極限，這是可以理解的，比如標(biāo)題寬度為770px，字體大小為17.5vw。所以在排版上，它很大，墨西拿Sans字體適合它的粗大和可讀性。真正令人耳目一新的是，這既適用于導(dǎo)航鏈接，也適用于接受cookie的自定義GDPR提示，使用主屏幕上的按鈕在德語和英語翻譯之間切換也很容易。

02、爵士樂調(diào)頻

這個(gè)由Anagrama設(shè)計(jì)的設(shè)計(jì)使事情變得簡單和引人注目

（圖片來源：Jazz FM羅馬尼亞）

這個(gè)位于布加勒斯特的廣播電臺(tái)色彩豐富的網(wǎng)站在讓音樂自己說話方面做得很好，乍一看，Anagrama的“爵士調(diào)頻羅馬尼亞”（Jazz FM Romania）只是邀請游客通過一個(gè)三角形的播放按鈕觀看現(xiàn)場直播，該按鈕占據(jù)了一半的視區(qū)。我們得到了一個(gè)標(biāo)志和現(xiàn)在播放的軌道顯示，但它是最低限度的引人注目的黑色對黃色的方案。這只是標(biāo)題，然而，單一，長頁結(jié)構(gòu)繼續(xù)與更多的活力看-盡管總是與模仿性的網(wǎng)站設(shè)計(jì)在腦海中。

最值得注意的是，有大量漂亮的“爵士”SVG插圖，當(dāng)然，無論您的屏幕大小，這些插圖都具有驚人的清晰度。版式再次走大，感謝節(jié)省經(jīng)濟(jì)的文本，主要是標(biāo)題標(biāo)簽詳細(xì)說明在其他地方爵士樂調(diào)頻可以享受。其他有趣的功能包括一個(gè)干凈和明確的七天時(shí)間表，滾動(dòng)調(diào)頻調(diào)諧器tickertape，甚至一個(gè)爵士音樂節(jié)指南。

03、超級(jí)手語

這個(gè)站點(diǎn)提供了一個(gè)問題的解決方案，而沒有反復(fù)強(qiáng)調(diào)信息

根據(jù)其無障礙的理念，優(yōu)步創(chuàng)建了一個(gè)網(wǎng)站，專門教授客戶基本的手語，這樣他們就可以與聽力受損的司機(jī)互動(dòng)。優(yōu)步手語是一個(gè)有節(jié)制的設(shè)計(jì)大師課程。它通過簡短的視頻向用戶展示如何簽署簡單的常用短語（是、否、左轉(zhuǎn)等），甚至他們的名字。幾乎沒有抄本，也沒有解釋；內(nèi)容不言自明，證明你不需要巧妙的詞語來捕捉重要的品牌信息。

04、Evoulve

精簡的元素和神奇的動(dòng)畫創(chuàng)造了一種發(fā)現(xiàn)的氛圍

Evoulve是一家致力于將新興技術(shù)轉(zhuǎn)化為可行產(chǎn)品的公司，屏幕上的元素非常少：簡單的文本注釋和非常少的導(dǎo)航選項(xiàng)，背景是緩慢旋轉(zhuǎn)的地球和星空。然而，每一個(gè)都是精心制作的，微妙的CSS動(dòng)畫增強(qiáng)了魔法的感覺，創(chuàng)造了一種發(fā)現(xiàn)的心情。

05、修補(bǔ)

這個(gè)手表零售網(wǎng)站的用戶界面被簡化為最基本的

Tinker是一個(gè)手表品牌，它有一個(gè)簡單的概念：顧客可以選擇表盤大小、表帶顏色和金屬的任何組合。沒有不必要的功能或細(xì)節(jié)。公司網(wǎng)站的用戶界面明確了這一概念；用戶可以從有限的選項(xiàng)中輕松地選擇理想的組合。

06、Leen Heyne

珠寶商把觀眾的目光引向了它的網(wǎng)站

除了珠寶，Leen Heyne的單色logo和公司名稱是主頁上唯一重要的視覺元素，周圍廣闊的空白讓用戶的眼睛很容易被產(chǎn)品吸引。

07、我們不是塑料

對比在這里產(chǎn)生了興趣

對比是保持極簡設(shè)計(jì)有趣的另一個(gè)有用的視覺策略，德國UX工程師Roland Losslein的網(wǎng)站W(wǎng)e Ain't Plastic在中心圖片和上面的文字和圖標(biāo)之間建立了一個(gè)鮮明的對比。

08、Nua Bikes

Nua Bikes平衡其主頁上的元素

Nua Bikes’site是極簡主義的，因?yàn)樵谄聊簧蠈?shí)際上有很多元素。然而，通過壓縮文本和最大化空白，該公司能夠?qū)⒆⒁饬ξ狡洚a(chǎn)品——自行車上。

09、Sendamessage.to

這個(gè)網(wǎng)站有一個(gè)明確的目的

有趣的，如果可能是愚蠢的，發(fā)送信息。讓人們通過手勢來定制給朋友的信息，貧瘠的黑色背景為主圖像和文本中粗體的白色字母增添了力量。

10、Maaemo

大氣視頻設(shè)置場景

米其林三星級(jí)的挪威餐廳Maaemo的網(wǎng)站用極簡主義來營造一種階級(jí)感，視覺處理對于講故事來說是完美的，正如網(wǎng)站展示的菜肴制作的高清照片。

11、艾娃

與艾娃交談

這個(gè)科幻驚悚片《機(jī)械姬》的宣傳網(wǎng)站的黑白配色方案和排版的一致性保持了文本的焦點(diǎn)，與電影明星AI機(jī)器人Ava的互動(dòng)對話。

12、Symbolset

色彩變化的背景活躍了這個(gè)極簡主義的網(wǎng)站

（圖片來源：symbolset.com）

圖標(biāo)字體供應(yīng)商Symbolset通過最小化競爭元素并添加色彩鮮艷、不斷變化的背景，將人們的注意力吸引到網(wǎng)站設(shè)計(jì)的中間交互區(qū)域。