2014-10-17 藍藍設(shè)計的小編
如何讓網(wǎng)頁設(shè)計更具現(xiàn)代感?2014年網(wǎng)站設(shè)計又會有怎樣的變化趨勢?回顧2013年,Metro設(shè)計,全屏大圖設(shè)計都是2013流行的趨勢!下面我們將為大家列出2014最有可能流行的WEB前端設(shè)計趨勢!
我個人是個性化排版的支持者,自然也希望看到越來越多的網(wǎng)絡(luò)設(shè)計嘗試個性化的風(fēng)格,其中比較突出的一點是個性化字體的增多:用自己獨特設(shè)計的字體代替標準 印刷體,讓設(shè)計更加獨特。比如“Stuff and Nonsense”這個網(wǎng)站提供設(shè)計字體服務(wù),讓字體在體現(xiàn)個性的同時保留專業(yè)印刷風(fēng)格。我們期待著在2014年設(shè)計出的網(wǎng)站能夠更多地從細節(jié)體現(xiàn)個性。
2014年的10大趨勢中,我們提到了“借殼”設(shè)計(skeuomorphism),指模仿現(xiàn)實事物盡可能把手機元素(如圖表、背殼等)設(shè)計得更加具體、擬 物。而“扁平化”的極簡主義則是和“擬物性”相背行,在iOS7中明顯感到更加簡化的圖表替代了原本精致的描繪,更加突出應(yīng)用的實際效果,反應(yīng)使用應(yīng)用的 感受,而不是局限在某個應(yīng)用的外在形象上。蘋果公司在今年竭力推進扁平化設(shè)計,幾乎所有可以修改的設(shè)計都加入了扁平化的元素。
蘋果公司向來是電子產(chǎn)品設(shè)計的導(dǎo)向標,推動其他產(chǎn)品設(shè)計紛紛追隨iOS7的設(shè)計風(fēng)格,同時網(wǎng)絡(luò)設(shè)計也開始大批量地采用扁平化思路。預(yù)計這種風(fēng)潮在2014年仍將持續(xù)。
要說網(wǎng)絡(luò)設(shè)計最大的趨勢,大概是大背景圖片的使用。
大型背景圖片(large hero areas,是從印刷設(shè)計借用到網(wǎng)絡(luò)設(shè)計中的專業(yè)名詞,通常是鋪滿整個屏幕的圖片,配上幾句簡介的文字),常出現(xiàn)在網(wǎng)站首頁上。大圖片背景的清晰度不一, 有的配以模糊的背景,有的(如realtii)則采用清晰的圖片。大型背景圖片迅速取代了曾一度熱門的幻燈片圖片顯示插件,成為網(wǎng)頁設(shè)計元素中吸引瀏覽者 注意力的主要途徑,而幻燈片滾動顯示的使用價值已經(jīng)被否定。預(yù)計這種大圖片設(shè)計的流行趨勢在2014年仍將持續(xù)。
交互網(wǎng)頁設(shè)計越來越普遍,網(wǎng)頁設(shè)計順應(yīng)人們對手機的依賴,變得越來越像手機的交互界面。設(shè)計師們更注重網(wǎng)站在手機屏幕上顯示的實際效果,手機將成為網(wǎng)絡(luò)瀏覽的主要方式,因此屏幕尺寸的差異對用戶體驗的影響也將被納入網(wǎng)頁設(shè)計的考慮范圍。
此外,融合社交媒體功能,提供訂閱郵件,借助滾動條設(shè)計瀏覽的“長”網(wǎng)站,快速加載網(wǎng)頁等都將讓網(wǎng)站設(shè)計的互動性增加,用戶界面更加友好。
如果在一段視頻介紹和文本介紹中選擇,估計大部分瀏覽者都會選擇前者。此外視頻和網(wǎng)絡(luò)(尤其是大背景圖片)匹配性強。
網(wǎng)絡(luò)視頻的制作的成本不斷降低,網(wǎng)絡(luò)傳播性強,與社交媒體網(wǎng)站的兼容性好。網(wǎng)絡(luò)硬件的發(fā)展讓此前因為網(wǎng)速和流量限制的視頻插件越來越普及,顯然在同樣的時間和篇幅里,視頻傳遞的信息量要遠超過文本。
此外,視頻能追蹤觀看人數(shù),相比文本能獲得更好的宣傳反饋。
手機讓人們習(xí)慣用“滾動條”控制的方式閱讀網(wǎng)頁、尋找資訊,這樣的閱讀習(xí)慣也影響了網(wǎng)絡(luò)設(shè)計,頁面出現(xiàn)更多兩側(cè)留白與更多的交互設(shè)計。幾年前這種不見底的 下拉式網(wǎng)站并不受好評,但手機瀏覽器讓人們逐漸接受了這種長條形網(wǎng)站布局。此外內(nèi)容的編排上也更適合閱讀理解。此外國內(nèi)很多購物網(wǎng)站或貼吧都加上了“點擊 返回頁面最上端”的功能,更加方便了瀏覽長網(wǎng)頁。而事實很有可能是,瀏覽者只顧往下滾動,根本不會在意網(wǎng)頁到底有多長……
網(wǎng)頁設(shè)計的配色改變反應(yīng)了人們審美需求的改變。2014年預(yù)計同色系網(wǎng)站設(shè)計將成為主流,而“簡化配色”的概念,則是把參與網(wǎng)站設(shè)計的顏色局限到1到2個。
如上面的網(wǎng)站圖例,只用了一個顏色(藝術(shù)設(shè)計中黑/白被不被納入顏色計算中)。配色簡單的趨勢似乎和平面化同步,但也不絕對。有些網(wǎng)站甚至擯棄色彩,采用純黑白(以及兩者之間的漸變色)設(shè)計,有時在其中加入一點色彩吸引注意力或渲染效果,比如加入醒目的紅色。
2013年似乎是“King Content”流行的一年。所謂“King Content”,是指適應(yīng)社交互動媒體網(wǎng)站(如Facebook,Twitter等)出現(xiàn)的簡潔高度概括的提示信息內(nèi)容。信息內(nèi)容的簡化以為著篇幅的縮 短,文章采用Twitter風(fēng)格來適應(yīng)人們注意力的縮短。注意到現(xiàn)在網(wǎng)絡(luò)上很少再出現(xiàn)長于250字的介紹,太長的內(nèi)容已經(jīng)不再適應(yīng)人們快速瀏覽的閱讀習(xí) 慣。
單欄模式常見于博客或雜志樣式的網(wǎng)站,但采用這種模式的網(wǎng)站正在增加,放棄分欄,重新整合內(nèi)容已經(jīng)成為當(dāng)下網(wǎng)絡(luò)設(shè)計的發(fā)展趨勢之一。這種設(shè)計給人的視覺效果更好,內(nèi)容也顯得更加整齊,同時網(wǎng)絡(luò)設(shè)計本身也更為簡單。
這種單欄設(shè)計提供讀者更好的瀏覽體驗,擯棄了復(fù)雜的內(nèi)容堆積分散閱讀注意力,主體內(nèi)容能在整個頁面流暢地一字排開。我個人希望這種閱讀模式能在2014年保持下去。
藍藍設(shè)計的小編 http://www.miumiuwan.com