技術的革新帶動了設計行業的的迅猛發(fā)展,這(zhè)使得設計師和開(kāi)發(fā)者有了更廣闊的的探索天地。而網頁設計也越發(fā)不再那麼(me)循規蹈矩,許多團隊和公司都(dōu)做了很多思考和創意。所以在我們适應著(zhe)現代設計潮流的同時(shí),不妨也來看看現階段網頁設計大緻的趨勢和風格吧。
響應式網頁設計
(Responsive Web Design)
現在越來越多用戶都(dōu)擁有多種(zhǒng)終端:台式機,筆記本,平闆電腦,手機,能(néng)夠适應不同尺寸顯示屏的網頁是現在的潮流,甚至是未來很長(cháng)一段時(shí)間的設計趨勢。那麼(me)響應式網頁設計就(jiù)是來解決這(zhè)個問題的。這(zhè)種(zhǒng)特别的開(kāi)發(fā)方式能(néng)保證網頁适應不同的分辨率,讓網頁要素重組,使其無論在垂直的平闆電腦還(hái)是智能(néng)手機上,都(dōu)能(néng)達到最好(hǎo)的視覺效果。
除了多終端的多樣化,我們還(hái)可以看到我們的電腦屏幕,手機屏幕都(dōu)在不斷變大,而在對(duì)未來生活的預測、概念設計裡(lǐ),“屏幕”這(zhè)個産物更是被運用到多種(zhǒng)新平台上。例如微軟發(fā)布的“未來生活概念視頻”裡(lǐ),廚房、室内牆壁、辦公室玻璃牆面(miàn)都(dōu)成(chéng)爲了交互平台。所以我們可以發(fā)現,響應式網頁設計所具備的良好(hǎo)的适應性和可塑性,在未來的網頁設計裡(lǐ)將(jiāng)占有舉足輕重的位置。
全屏網頁設計
(Full Screen Design)
所謂設計不分家,近年來平面(miàn)設計裡(lǐ)“純淨”“留白”等概念也被互聯網設計吸取,爲了更簡單明了的突出主體,提供更舒适的感官感受,很多網站開(kāi)始采用全屏網頁設計,利用精心挑選設計的漂亮背景,加上合理的頁面(miàn)布局,視覺沖擊力大可很好(hǎo)的吸引觀者注意。通常頁面(miàn)内的文字内容不會(huì)特别多(所出現的少量文字加上精美的排版將(jiāng)會(huì)變得更加吸引人),主要以圖片展示爲主。這(zhè)個樣子的網站多用于攝影團隊或個人作品集展示會(huì)比較常見。雖然簡單養眼,但是承載信息有限,公司部門的主頁很少見這(zhè)樣的設計。
視差滾動設計
(Parallax Design)
視差設計可以說(shuō)是近年來網頁設計中的一大突破,也備受推崇。視差滾動是讓多層背景以不同速度滾動,以形成(chéng)一種(zhǒng)3D立體的運動效果,給觀者帶來一種(zhǒng)獨特的視覺感受。
除此以外,鼠标滾輪的流暢體驗,讓用戶在觀看此類網站時(shí)有一種(zhǒng)控制感,簡單來說(shuō)這(zhè)是有響應的交互體驗。就(jiù)好(hǎo)像童年看到走馬燈,轉動它你就(jiù)能(néng)看到人物動起(qǐ)來,還(hái)能(néng)欣賞故事(shì)。視差滾動設計的趣味也在于此。所以無論是網站還(hái)是電商商品宣傳頁都(dōu)經(jīng)常采用視差設計,吸引眼球也很受用戶喜愛。
扁平化設計
(Flat Design)
扁平化設計可以說(shuō)是去繁從簡的設計美學(xué)。去掉所有裝飾性的設計,可以說(shuō)是對(duì)之前所推崇的拟物化設計的颠覆。我們不能(néng)妄加評論說(shuō)這(zhè)是好(hǎo)還(hái)是不好(hǎo),隻能(néng)說(shuō)它提供了一種(zhǒng)新的設計思維。扁平化設計是否會(huì)成(chéng)爲將(jiāng)來的趨勢我們也無法回答,盡管褒貶不一,備受争議,但是就(jiù)現在來說(shuō)它是當下的一種(zhǒng)潮流。
滾動偵測網頁設計
(Scrollspy)
利用CSS的實現將(jiāng)導航欄固定在網頁頂部(大多數是頂部,當然也有側面(miàn)或底部),并將(jiāng)版面(miàn)内容按照導航順序垂直或橫向(xiàng)排布,使得用戶點擊相應導航tab時(shí)頁面(miàn)自動滑到相應頁面(miàn),而若點擊内容,導航也將(jiāng)随之改變。這(zhè)樣的網頁設計頁面(miàn)基本不會(huì)跳轉,每一個tab所指向(xiàng)的頁面(miàn)内容也基本一屏顯示完整,所以在頁面(miàn)呈現的内容上會(huì)有所局限。爲不影響布局一般也會(huì)伴随自适應。
滾動偵測式的網頁會(huì)給設計師帶來了很大挑戰——要在有限空間内保證内容呈現的完整性,故設計師會(huì)在版面(miàn)上下足功夫。而這(zhè)類網站結構和視差設計有異曲同工之處,所以我們發(fā)現很多網站會(huì)結合兩(liǎng)者,給觀者帶來不一樣的視覺感受和用戶體驗。
無限滾動模式
(瀑布流)
有一些網站内容很多,但他們并沒(méi)有簡單分頁,而是采用的是一種(zhǒng)垂直瀑布流的方式布局。將(jiāng)那些内容垂直排布,當用戶縱向(xiàng)滾動時(shí),内容會(huì)不斷更新好(hǎo)像永無止境。這(zhè)樣的瀑布流很早之前就(jiù)開(kāi)始流行,最早采用該布局的是pinterest。這(zhè)樣的滾動頁面(miàn)就(jiù)大大減少了分頁的數量,個人認爲對(duì)于這(zhè)類信息量大,每日更新數據快的網站是比較不錯的方案。
網頁的風格化設計
現在的網頁早已不再像過(guò)去受諸多條件和技術限制了。其呈現方式頗爲豐富。風格從清新到複古,插畫手繪到拟真設計,無奇不有。無論是版面(miàn)版式,還(hái)是設計元素,用标新立異這(zhè)個詞形容絕不爲過(guò)。根據自己撇到的冰山一角,提一下對(duì)我感觸最深的變化:
(1)平面(miàn)設計感的加強
網頁設計随著(zhe)設備和技術的革新,早已突破了過(guò)去單一框架的限制,變得更加靈活。所以就(jiù)頁面(miàn)風格更多地開(kāi)始向(xiàng)平面(miàn)設計靠近,許多頁面(miàn)設計得極賦海報和雜志的版式感。時(shí)尚而富有沖擊力。
(2)注重字體設計
近年來很多設計師將(jiāng)字體設計也融入了網頁設計中,并作爲設計的一個重要元素提升整個網頁品味。通過(guò)使用CSS3設計師可以擁有許多自定義的字體,這(zhè)給網頁的視覺設計也增加了一個重要的設計思路。
(3)豐富靈活的動畫
Html5和flash的廣泛應用,讓網頁的交互動畫變得更加生動有趣。
通過(guò)觀察這(zhè)些趨勢如何影響現代網站設計,或許可以爲網頁設計師帶去指引,發(fā)散出新想法。
雖然設計師和開(kāi)發(fā)者都(dōu)需要和市場接軌并跟上潮流的腳步,但是所謂的潮流是當下的,未來确是未知的。我們的确需要保證自己不被行業趨勢甩到隊尾,但更重要的是在浪潮中适應和學(xué)習。