網(wǎng)站建設(shè)發(fā)展方向

作者：佚名   時(shí)間：2014-12-19   分享到：

1、更加靈活的排版

　　隨著對(duì)內(nèi)容呈現(xiàn)形式要求的不斷提升，用戶(hù)和設(shè)計(jì)師都會(huì)對(duì)文字和內(nèi)容排版提出新的規(guī)范。

　　事實(shí)上，網(wǎng)頁(yè)排版和傳統(tǒng)的平面排版有著巨大的差異，而在即將到來(lái)的2015年，你會(huì)發(fā)現(xiàn)越來(lái)越多的傳統(tǒng)網(wǎng)站開(kāi)始轉(zhuǎn)型，逐漸拋棄小字體+密集布局設(shè)計(jì)。其實(shí)這并非什么新鮮事，早在2006年，網(wǎng)頁(yè)設(shè)計(jì)界就已經(jīng)開(kāi)逐漸轉(zhuǎn)變了，只是傳統(tǒng)網(wǎng)站很難放棄多年以來(lái)的設(shè)計(jì)風(fēng)格和規(guī)則而已。

　　有研究表明，影響網(wǎng)頁(yè)可讀性的主要有3個(gè)因素：

　　1、字體大小

　　2、列寬度

　　3、行高度

　　而研究表明，較大的文本大小更加有利于在屏幕上閱讀內(nèi)容。網(wǎng)頁(yè)設(shè)計(jì)師門(mén)現(xiàn)在已經(jīng)開(kāi)始提升響應(yīng)式網(wǎng)頁(yè)布局中，字體排版與圖片、整體結(jié)構(gòu)之間的關(guān)系，以提升閱讀體驗(yàn)。如何讓文字內(nèi)容哪怕在跨平臺(tái)的狀況下都始終保持最佳的視覺(jué)效果，是未來(lái)網(wǎng)頁(yè)設(shè)計(jì)中至關(guān)重要的事情。

　　那么真正優(yōu)秀的網(wǎng)頁(yè)排版設(shè)計(jì)都是怎樣的的呢?看這里：《百變隨心!35款兼容性極佳的響應(yīng)式網(wǎng)頁(yè)排版設(shè)計(jì)》

　　2、網(wǎng)頁(yè)Coding的衰落

　　其實(shí)網(wǎng)頁(yè)開(kāi)發(fā)分工一直處于一種高度分裂的狀態(tài)：設(shè)計(jì)師完成網(wǎng)站的視覺(jué)設(shè)計(jì)，而前端/程序員則需要將設(shè)計(jì)實(shí)現(xiàn)出來(lái)。但是這一狀況正在逐漸改變，因?yàn)榫W(wǎng)頁(yè)設(shè)計(jì)工具正在變得越來(lái)越強(qiáng)大，更加智能。

　　越來(lái)越多的設(shè)計(jì)師可以不寫(xiě)一行代碼就創(chuàng)建出網(wǎng)站，利用圖形設(shè)計(jì)軟件的新特性和新功能，設(shè)計(jì)師所創(chuàng)建的網(wǎng)站不僅代碼干凈漂亮，而且能通過(guò)W3C的驗(yàn)證。

　　這是具有重大意義的轉(zhuǎn)變，新工具令網(wǎng)頁(yè)開(kāi)發(fā)的門(mén)檻逐漸降低，設(shè)計(jì)師們也能在不觸及復(fù)雜技術(shù)的前提下，獨(dú)立創(chuàng)建出現(xiàn)代而專(zhuān)業(yè)化的網(wǎng)站。

　　如此一來(lái)，設(shè)計(jì)師可以更加專(zhuān)注于設(shè)計(jì)，而這些無(wú)Coding開(kāi)發(fā)平臺(tái)則可以更加專(zhuān)注于技術(shù)和代碼演進(jìn)，確保所有最新的設(shè)計(jì)都能完美呈現(xiàn)。之前從事前端工作的開(kāi)發(fā)者逐漸過(guò)度成為Web程序員，而這些平臺(tái)就是他們發(fā)光發(fā)熱的地方。

　　3、響應(yīng)式設(shè)計(jì)的進(jìn)化

　　在過(guò)去的幾年中，設(shè)計(jì)響應(yīng)式的網(wǎng)站的時(shí)候，主要考慮桌面端、平板和手機(jī)屏幕的適配。但是隨著智能手表、智能電視和智能家具的蓬勃發(fā)展，響應(yīng)式所需要“響應(yīng)”的屏幕尺寸范疇再一次得到了擴(kuò)展。

　　不過(guò)總的來(lái)說(shuō)，響應(yīng)式網(wǎng)站設(shè)計(jì)還是萬(wàn)變不離其宗的：《有對(duì)比才有看頭!響應(yīng)式WEB設(shè)計(jì)的9項(xiàng)基本原則》

　　雖然現(xiàn)在手機(jī)和平板的交互都已為大眾所熟悉，但是為之進(jìn)行響應(yīng)式設(shè)計(jì)的時(shí)候依然存在獨(dú)特的挑戰(zhàn)，那就是屏幕尺寸、分辨率的分裂帶來(lái)的適配工作量的增加。

　　即便解決了平板和手機(jī)上的瀏覽的問(wèn)題，你還得面對(duì)新加入的設(shè)備。比如在智能手表上，網(wǎng)頁(yè)瀏覽的方式都是截然不同的，你需要為之重新思考導(dǎo)航的方式。在手表上瀏覽手機(jī)版的網(wǎng)頁(yè)都是一件吃力的事情，而在TV端瀏覽桌面端的網(wǎng)頁(yè)的話(huà)，體驗(yàn)也是災(zāi)難性的。

　　這些新問(wèn)題的解決方案可能還有待時(shí)間來(lái)沉淀，但是在2015年底智能設(shè)備市場(chǎng)的膨脹，會(huì)促使網(wǎng)頁(yè)設(shè)計(jì)師們來(lái)考慮新設(shè)計(jì)，以應(yīng)對(duì)技術(shù)的革新。

　　4、扁平化設(shè)計(jì)會(huì)覆蓋每一個(gè)像素

　　隨著主流廠(chǎng)商在設(shè)計(jì)風(fēng)格上走向一致，扁平化的設(shè)計(jì)會(huì)在接下來(lái)的一年中急劇膨脹。在過(guò)去的幾年中，微軟的Metro UI、蘋(píng)果的Flat Design和谷歌的Material Design 先后選擇了扁平風(fēng)，使得這一設(shè)計(jì)風(fēng)尚真真正正成為了設(shè)計(jì)的主流。

　　隨著Google的Material Design的成熟，越來(lái)越多的大牛也開(kāi)始鉆研它了：《學(xué)霸的自學(xué)筆記!MATERIAL DESIGN設(shè)計(jì)規(guī)范學(xué)習(xí)心得》

　　盡管現(xiàn)在依然有人在強(qiáng)調(diào)扁平化設(shè)計(jì)在UI設(shè)計(jì)上存在問(wèn)題，但是普遍的認(rèn)知是，扁平化設(shè)計(jì)總體上是一門(mén)促進(jìn)網(wǎng)頁(yè)設(shè)計(jì)前進(jìn)的技術(shù)。

　　扁平化設(shè)計(jì)的發(fā)展，主要還是取決于我們消費(fèi)網(wǎng)喏內(nèi)容的方式和屏幕背后 支撐網(wǎng)頁(yè)發(fā)展的技術(shù)。扁平化設(shè)計(jì)與極簡(jiǎn)設(shè)計(jì)原則相通，而這種設(shè)計(jì)可以明顯讓網(wǎng)頁(yè)更加輕量級(jí)，更加易用、快速，更突出內(nèi)容。

　　扁平化設(shè)計(jì)已經(jīng)不僅僅在審美上更具吸引力，它實(shí)實(shí)在在地令訪(fǎng)客更容易沉浸到內(nèi)容中，無(wú)干擾地同網(wǎng)站進(jìn)行交互。

　　5、圖片：更大=更好

　　不僅網(wǎng)站上的文字越來(lái)越大，圖片也是!

　　受限于帶寬，之前的網(wǎng)站開(kāi)發(fā)者和設(shè)計(jì)師都需要在網(wǎng)站的圖片上精打細(xì)算，但是隨著時(shí)間的推移，這越來(lái)越不是問(wèn)題了。其結(jié)果是，越來(lái)越多的網(wǎng)站開(kāi)始使用高清大圖素材了。

　　那些所謂的越來(lái)越多的網(wǎng)站就在這里：《這才叫氣吞山河!20個(gè)史詩(shī)級(jí)的大屏全景網(wǎng)站設(shè)計(jì)》

　　在2015年，使用高清大圖作為**會(huì)成為一大趨勢(shì)，相應(yīng)的，將會(huì)有更多響應(yīng)式調(diào)整圖片尺寸的技術(shù)、**圖片調(diào)色工具以及圖片服務(wù)器負(fù)載調(diào)整工具涌現(xiàn)。

　　此外，2015年的另外一大趨勢(shì)就是使用大圖**。模糊濾鏡和彩色濾鏡疊加在**上，讓文字無(wú)需陰影就可以“浮”**之上。隨著設(shè)計(jì)師越來(lái)越多地使用大圖**來(lái)設(shè)計(jì)，你將會(huì)越來(lái)越頻繁地看到這種網(wǎng)站。

　　6、視差滾動(dòng)

　　也許最明朗、最令人印象深刻的網(wǎng)頁(yè)設(shè)計(jì)趨勢(shì)就是視差滾動(dòng)了。

　　為什么它們令人印象深刻，看看這些案例就明白了：《最新的別放過(guò)!30個(gè)盡顯創(chuàng)意的視差滾動(dòng)網(wǎng)站設(shè)計(jì)》

　　在2014年里，視差滾動(dòng)的網(wǎng)頁(yè)越來(lái)越多，甚至蘋(píng)果和Google這樣的企業(yè)也在自己的產(chǎn)品頁(yè)面上使用了視差滾動(dòng)的設(shè)計(jì)。不言自明，視差滾動(dòng)式設(shè)計(jì)確實(shí)有效地提高了用戶(hù)的參與度!

　　使用滾動(dòng)替代點(diǎn)擊式導(dǎo)航讓網(wǎng)站交互的活躍度提高了好幾個(gè)層次。視差滾動(dòng)有效地減少了多頁(yè)面式網(wǎng)站的頁(yè)面加載次數(shù)，更重要的是，它使得內(nèi)容和頁(yè)面的過(guò)度更加流暢自然，信息源源不斷地呈現(xiàn)，不會(huì)因?yàn)橥蝗荒硞�(gè)頁(yè)面加載不出來(lái)而導(dǎo)致體驗(yàn)下降。

　　7、網(wǎng)頁(yè)信息圖的黎明

　　人都是視覺(jué)動(dòng)物，當(dāng)數(shù)據(jù)以更加圖形化、視覺(jué)化的方式呈現(xiàn)出來(lái)的時(shí)候，我們更容易接受。這也是為什么信息圖會(huì)逐漸普及開(kāi)來(lái)，信息圖正是以這種簡(jiǎn)單直觀的方式來(lái)表現(xiàn)內(nèi)容，讓信息的留存度直線(xiàn)提升。正是因此，越來(lái)越多的網(wǎng)站開(kāi)始使用信息圖式的呈現(xiàn)手法。

　　信息圖式的網(wǎng)頁(yè)設(shè)計(jì)最典型的，就是時(shí)間軸設(shè)計(jì)，案例在此:《超越傳統(tǒng)思維!20個(gè)創(chuàng)意驚人的時(shí)間軸展示網(wǎng)站設(shè)計(jì)》

　　而這就是設(shè)計(jì)趨勢(shì)，我們稱(chēng)之為Webgraphics!它像信息圖一樣內(nèi)容豐富，表現(xiàn)直觀，但涉及到網(wǎng)頁(yè)中的具體元素的時(shí)候，還允許用戶(hù)與之進(jìn)行交互，這是單純的信息圖做不到的。這也是為什么Webgraphics比信息圖在視覺(jué)上更加吸引用戶(hù)，也擁有更高的用戶(hù)留存率。