找出一個(gè)從來(lái)沒(méi)人用過(guò)的布局可能有難度，但是要設(shè)計(jì)出出人意表的網(wǎng)站還是不難的。錯(cuò)位的元素，少見(jiàn)的配色，不一樣的動(dòng)效與變化，都能促成一個(gè)令人難忘的優(yōu)秀網(wǎng)頁(yè)。今天的推薦，與此相關(guān)。
出于種種原因，絕大多數(shù)的網(wǎng)站都遵循著相同的規(guī)則來(lái)設(shè)計(jì)整體的布局。用戶約定俗成的習(xí)慣，硬件所限定的交互方式，可用性和易用性規(guī)則下的設(shè)計(jì)手法，它們讓我們所看到的網(wǎng)頁(yè)如此的相似。從微博到推特，從蘋(píng)果官網(wǎng)到小米官網(wǎng)，從Facebook到計(jì)生委的官網(wǎng)，它們都沿著相似的柵格系統(tǒng)，然后添加內(nèi)容。
不過(guò)，同這些傳統(tǒng)的網(wǎng)站布局不一樣的網(wǎng)站并沒(méi)有什么錯(cuò)。這些不同于傳統(tǒng)的網(wǎng)頁(yè)布局，常常能給人不同的觀感，賦予個(gè)性，啟發(fā)靈感，帶來(lái)跳出來(lái)定勢(shì)之外的想法。今天搜集的這些網(wǎng)站有作品展示，也有電影網(wǎng)站，有博客，也有企業(yè)官網(wǎng)。希望這些各不相同的網(wǎng)站，能給你帶來(lái)思想的靈光。
Yatzer
Yatzer 網(wǎng)站的獨(dú)特設(shè)計(jì)旨在激發(fā)訪客的靈感。網(wǎng)站同樣借助柵格來(lái)構(gòu)建整體布局，但是你會(huì)發(fā)現(xiàn)網(wǎng)頁(yè)元素并沒(méi)有在縱向上保持對(duì)齊，這種錯(cuò)落的美感讓頁(yè)面顯得更加有趣而難忘。
Sylvian Reucherand
當(dāng)你第一次打開(kāi)Sylvian 的作品合集的時(shí)候，你會(huì)發(fā)現(xiàn)頁(yè)面頗為極簡(jiǎn)，并且文字是相互重疊的。當(dāng)鼠標(biāo)懸停在“see more”上面的時(shí)候，頁(yè)面和元素會(huì)自然伸展，讓你看到某個(gè)移動(dòng)端APP的設(shè)計(jì)稿預(yù)覽圖。頁(yè)面元素布局并不平衡，整體偏左，很有意思。
Lane & Associates
這個(gè)來(lái)自 Lane & Associates 的展示頁(yè)看起來(lái)漂亮而簡(jiǎn)約，最獨(dú)特的地方在于當(dāng)你滾動(dòng)頁(yè)面的時(shí)候，圖片會(huì)隨機(jī)地在頁(yè)面中漂動(dòng)。設(shè)計(jì)師似乎并不想讓這些圖片固定在某個(gè)地方，或者排成行列。自然隨性的設(shè)計(jì)非常獨(dú)特。
Quechua
Quechua 春夏裝合集頁(yè)面中，許多元素同樣采用的是錯(cuò)落重疊的設(shè)計(jì)。說(shuō)起來(lái)，圖片、文字和按鈕等多種元素在頁(yè)面中重疊排布的自由式布局在近年來(lái)越來(lái)越流行了。
Readymag
Readymag 是一個(gè)免費(fèi)的在線排版指南，整個(gè)指南由四個(gè)部分組成，而布局上也相當(dāng)?shù)暮?jiǎn)單直觀。不過(guò)當(dāng)你看到一個(gè)關(guān)于Futura 和 Grarmond 字體的章節(jié)的時(shí)候，你會(huì)發(fā)現(xiàn)字體纖細(xì)瘦長(zhǎng)的段落并沒(méi)有居中對(duì)齊，這種差異頗有意思。
VN Star
VN Star 是一個(gè)地產(chǎn)開(kāi)發(fā)集團(tuán)，他們的網(wǎng)站在頁(yè)頭的設(shè)計(jì)上非常獨(dú)特，圓形元素被加入其中，被作為視覺(jué)的中心，同不同的元素產(chǎn)生交疊，在動(dòng)效加持下產(chǎn)生有趣的效果。
88 and 90 Lex
88 and 90 Lex 這個(gè)頁(yè)面真正讓人感到獨(dú)樹(shù)一幟的是他們的導(dǎo)航設(shè)計(jì)，它們并沒(méi)有置于頂端，也沒(méi)有放在底部，而是作為整個(gè)頁(yè)面的主體，放置在頁(yè)面的中央。
Christopher Ireland
這是一個(gè)布局相當(dāng)整潔的網(wǎng)站設(shè)計(jì)，如果你仔細(xì)查看其中圖片布局會(huì)發(fā)現(xiàn)，它們其實(shí)并沒(méi)有嚴(yán)格按照已知的柵格系統(tǒng)來(lái)進(jìn)行布局。在確定這一點(diǎn)再來(lái)看被組織的如此的整齊漂亮的頁(yè)面，你會(huì)感受到網(wǎng)站的獨(dú)創(chuàng)性。
Brian Hoff
許多網(wǎng)站都試圖規(guī)避配色過(guò)于復(fù)雜的背景，但是Brian Hoff的網(wǎng)站則不然，多彩且造型多樣的幾何圖形相互交疊在一起，視覺(jué)上相當(dāng)?shù)挠腥�。網(wǎng)頁(yè)另外一個(gè)有意思的設(shè)計(jì)是它的按鈕，當(dāng)你鼠標(biāo)懸停其上的時(shí)候，形狀會(huì)發(fā)生改變。
Frames by Franke
這個(gè)著陸頁(yè)是為廚房用的廚具和電器所設(shè)計(jì)的，不同尺寸的圖片和視頻沿著中間軸分散排布著，每個(gè)部分都配備著文字內(nèi)容。這樣的布局方式不復(fù)雜，但是一樣漂亮，也令人難忘。
Pierre Georges
Pierre Georges 在創(chuàng)意設(shè)計(jì)上非常的獨(dú)到。他所設(shè)計(jì)的頁(yè)面中，許多元素并不是遵循我們?nèi)粘？吹降哪切╉?yè)面的邏輯，那些略顯尷尬和格格不入的元素讓頁(yè)面變得不同凡響。
Sztafeta Pokolen
網(wǎng)站的導(dǎo)航設(shè)計(jì)是基于傳統(tǒng)的設(shè)計(jì)來(lái)做的，但是它隨著獨(dú)特的頁(yè)面布局，結(jié)合了一些新的設(shè)計(jì)手法。整個(gè)網(wǎng)站的配色不復(fù)雜但是非常漂亮，插畫(huà)和字體的選取，在整個(gè)布局設(shè)計(jì)下，顯得大氣而壯觀。
Haute Horlogerie
這是一個(gè)制表匠的網(wǎng)站著陸頁(yè)，首頁(yè)的文字介紹部分的排版布局是最令人著迷的，簡(jiǎn)單的配色和些許的交疊讓它顯得不同凡響。
Webydo
這個(gè)網(wǎng)站同樣沒(méi)有使用過(guò)于激烈、離經(jīng)叛道的設(shè)計(jì)，但是簡(jiǎn)單的錯(cuò)位布局會(huì)讓人注意到，難以忘懷。
|
