2014年網(wǎng)站設(shè)計(jì)趨勢(shì)

    我最近一次重新設(shè)計(jì)我的網(wǎng)站Hitched是在約五年前。自那時(shí)以來(lái)，發(fā)生了很多變化，尤其是近年移動(dòng)設(shè)備的迅速崛起。雖然我們多年前就確保我們的網(wǎng)站可在移動(dòng)設(shè)備上瀏覽，但它并沒(méi)有（現(xiàn)在仍然沒(méi)有）針對(duì)小型設(shè)備進(jìn)行優(yōu)化。不用說(shuō)，我們正拼命工作，以盡快改進(jìn)網(wǎng)站。

    在我們努力為網(wǎng)站更換新外衣之際，我碰巧發(fā)現(xiàn)了當(dāng)前一些我們可能會(huì)、也可能不會(huì)追隨的設(shè)計(jì)趨勢(shì)，不管怎樣，我希望能和大家分享。

    連續(xù)滾動(dòng)。這是福布斯網(wǎng)站已經(jīng)采用的一種設(shè)計(jì)元素。在你向下滾動(dòng)頁(yè)面時(shí)，你不用點(diǎn)擊就會(huì)自動(dòng)進(jìn)入下一篇文章。由于你連續(xù)滾動(dòng)屏幕，這改變了網(wǎng)站設(shè)計(jì)中的其它元素。例如，你在打開(kāi)第二篇文章時(shí)，除非你添加了浮動(dòng)導(dǎo)航和其它元素，否則你會(huì)失去非常重要的“頂部折起”功能。

    較大的字體。雖然多年來(lái)我們未對(duì)網(wǎng)站進(jìn)行重大改造，但幾個(gè)月前我們悄悄加大了我們文章頁(yè)面的字體大小。明年，我預(yù)計(jì)字體還會(huì)變得更大。這么做的一個(gè)重要原因是計(jì)算機(jī)和其它目前使用的設(shè)備的屏幕分辨率得到了得高，屏幕也更大，這讓之前流行的標(biāo)準(zhǔn)字體大小顯得十分細(xì)小。

    更加靈敏的移動(dòng)設(shè)計(jì)。我較早前提到過(guò)移動(dòng)設(shè)備是如何影響網(wǎng)頁(yè)設(shè)計(jì)的。公關(guān)公司W(wǎng)alker Sands發(fā)現(xiàn)，2013年第三季度，移動(dòng)設(shè)備在全部網(wǎng)站訪問(wèn)流量中占據(jù)了28%的份額，比去年同期上升了67%。我們的數(shù)字顯示，移動(dòng)設(shè)備目前占Hitched全部訪問(wèn)流量的近60%。幾年來(lái)這一趨勢(shì)一直在上升，2014年仍將持續(xù)。過(guò)去對(duì)此采用的設(shè)計(jì)方法是創(chuàng)建一個(gè)專(zhuān)門(mén)面向移動(dòng)設(shè)備的網(wǎng)站，但現(xiàn)在網(wǎng)站反應(yīng)更加靈敏，能夠根據(jù)設(shè)備和屏幕進(jìn)行相應(yīng)調(diào)整。這意味著網(wǎng)站發(fā)布者無(wú)需維護(hù)兩個(gè)完全不同的網(wǎng)站，而可以專(zhuān)注于一個(gè)能根據(jù)終端情況做出相應(yīng)反應(yīng)的網(wǎng)站。

    扁平化設(shè)計(jì)�？雌饋�(lái)移動(dòng)設(shè)備真的是推動(dòng)了一切事物的發(fā)展。自從蘋(píng)果公司發(fā)布經(jīng)過(guò)徹底改造、完全采用扁平化設(shè)計(jì)的iOS 7以來(lái)，扁平化審美迅速席卷桌面系統(tǒng)和網(wǎng)站設(shè)計(jì)領(lǐng)域（公平地說(shuō)，扁平化設(shè)計(jì)最先由Windows采用）。例如，我們使用的社交書(shū)簽共享網(wǎng)站AddThis在11月更新了他們的共享按鈕，采用了新的扁平化設(shè)計(jì)�？雌饋�(lái)扁平化設(shè)計(jì)不僅僅是提供了新的外觀，它還提升了性能。AddThis提到新按鈕比他們?cè)瓉?lái)的按鈕小了40%。考慮到扁平化設(shè)計(jì)排除了所有那些能迅速吃掉寶貴流量的陰影和漸變效果，這實(shí)際上極具意義。

    視差滾動(dòng)。我第一次看到網(wǎng)站使用視差滾動(dòng)是2012年《紐約時(shí)報(bào)》網(wǎng)站上一篇題為“Snow Fall”的特寫(xiě)文章。自那時(shí)起，其它網(wǎng)站也在采用這一技術(shù)，看起來(lái)在2014年，這將成為一個(gè)標(biāo)準(zhǔn)設(shè)計(jì)。如果你不熟悉視差滾動(dòng)，我將對(duì)它做一簡(jiǎn)要說(shuō)明。視差滾動(dòng)將網(wǎng)頁(yè)以多層呈現(xiàn)，其中背景層以不同于前景層的速度滾動(dòng)（實(shí)際上背景層可能根本沒(méi)有移動(dòng)）。其它技術(shù)也可以配合使用，比如動(dòng)畫(huà)可以實(shí)現(xiàn)某些特別而帶動(dòng)感的效果。我們最近發(fā)布了“2013年假日禮品指南”，其中包括由FiftyThree公司開(kāi)發(fā)的一款名為“Pencil”的新式觸控筆。我提到這點(diǎn)是因?yàn)樗麄兊漠a(chǎn)品站點(diǎn)非常有效地利用視差滾動(dòng)技術(shù)對(duì)“Pencil”這款產(chǎn)品進(jìn)行了分解和說(shuō)明。我希望視差滾動(dòng)和其它設(shè)計(jì)趨勢(shì)能對(duì)你下一次重新設(shè)計(jì)網(wǎng)站有所啟發(fā)。