武漢天琥設(shè)計培訓(xùn)學(xué)校-武漢怎么學(xué)設(shè)計方案-武漢學(xué)設(shè)計方案-網(wǎng)頁設(shè)計注重要點

對即將過去的一年中網(wǎng)頁設(shè)計發(fā)展進行回顧，總會發(fā)現(xiàn)很多讓我們感到欣喜的變化。去年我們預(yù)測了2014年互聯(lián)網(wǎng)設(shè)計出現(xiàn)的趨勢，比如交互設(shè)計、個性化排版、全屏大圖吸引瀏覽者注意力等。其中很多預(yù)計的趨勢在2014年確實成為設(shè)計的主流，并且將在2014年延續(xù)。

　　1. 個性化排版

　　我個人是個性化排版的支持者，自然也希望看到越來越多的網(wǎng)絡(luò)設(shè)計嘗試個性化的風(fēng)格，其中比較突出的一點是個性化字體的增多：用自己獨特設(shè)計的字體代替標(biāo)準印刷體，讓設(shè)計更加獨特。比如Stuff and Nonsense這個網(wǎng)站提供設(shè)計字體服務(wù)，讓字體在體現(xiàn)個性的同時保留專業(yè)印刷風(fēng)格。我們期待著在2014年設(shè)計出的網(wǎng)站能夠更多地從細節(jié)體現(xiàn)個性。

　　2. 扁平化設(shè)計

　　去年的趨勢中，我們提到了借殼設(shè)計(skeuomorphism)，指模仿現(xiàn)實事物盡可能把手機元素(如圖表、背殼等)設(shè)計得更加具體、擬物。而 扁平化的極簡主義則是和擬物性相背行，在iOS7中明顯感到更加簡化的圖表替代了原本精致的描繪，更加突出應(yīng)用的實際效果，反應(yīng)使用應(yīng)用的感受，而不是局限在某個應(yīng)用的外在形象上。蘋果公司在今年竭力推進扁平化設(shè)計，幾乎所有可以修改的設(shè)計都加入了扁平化的元素。

　　3.大背景圖打敗幻燈片動態(tài)顯示

　　要說網(wǎng)絡(luò)設(shè)計*的趨勢，大概是大背景圖片的使用。

　　大型背景圖片(large hero areas，是從印刷設(shè)計借用到網(wǎng)絡(luò)設(shè)計中的專業(yè)名詞，通常是鋪滿整個屏幕的圖片，配上幾句簡介的文字)，常出現(xiàn)在網(wǎng)站首頁上。大圖片背景的清晰度不一，有的配以模糊的背景，有的(如realtii)則采用清晰的圖片。大型背景圖片迅速取代了曾一度熱門的幻燈片圖片顯示插件，成為網(wǎng)頁設(shè)計元素中吸引瀏覽者注意力的主要途徑，而幻燈片滾動顯示的使用價值已經(jīng)被否定。

　　4. 移植手機閱讀體驗

　　交互網(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è)計的互動性增加，用戶界面更加友好。

　　5.視頻代替文本

　　如果在一段視頻介紹和文本介紹中選擇，估計大部分瀏覽者都會選擇前者。此外視頻和網(wǎng)絡(luò)(尤其是大背景圖片)匹配性強。

　　網(wǎng)絡(luò)視頻的制作的成本不斷降低，網(wǎng)絡(luò)傳播性強，與社交媒體網(wǎng)站的兼容性好。網(wǎng)絡(luò)硬件的發(fā)展讓此前因為網(wǎng)速和流量限制的視頻插件越來越普及，顯然在同樣的時間和篇幅里，視頻傳遞的信息量要遠超過文本。

　　此外，視頻能觀看人數(shù)，相比文本能獲得更好的宣傳反饋。

　　6.長滾動網(wǎng)頁

　　手機讓人們習(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)頁到底有多長

　　7. 簡單配色

　　網(wǎng)頁設(shè)計的配色改變反應(yīng)了人們審美需求的改變。2014年預(yù)計同色系網(wǎng)站設(shè)計將成為主流，而簡化配色的概念，則是把參與網(wǎng)站設(shè)計的顏色局限到1到2個。

　　8. 內(nèi)容簡化

　　2014 年似乎是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í)慣。

　　9.棄用分欄模式

　　單欄模式常見于博客或雜志樣式的網(wǎng)站，但采用這種模式的網(wǎng)站正在增加，放棄分欄，重新整合內(nèi)容已經(jīng)成為當(dāng)下網(wǎng)絡(luò)設(shè)計的發(fā)展趨勢之一。這種設(shè)計給人的視覺效果更好，內(nèi)容也顯得更加整齊，同時網(wǎng)絡(luò)設(shè)計本身也更為簡單。

　　10. 修圖

　　網(wǎng)站放什么圖也是個關(guān)鍵的問題，怎樣才能讓網(wǎng)站上的一幅圖看起來與眾不同?Instagram等類似工具來幫您~顏色疊加、濾鏡效果、模糊圖像等，借助PS專業(yè)工具，能讓一幅圖錦上添花，起到不一樣的效果。

　　11. 異類設(shè)計元素

　　此外新生網(wǎng)站還采取各種異類元素營造不一樣的風(fēng)格(如上圖)，增加圖片表現(xiàn)力。HTML5插件的普及也讓網(wǎng)站更加生動。未來必定還會有更加新奇的網(wǎng)站設(shè)計元素來滿足我們的視覺體驗(如 30個神奇的視差滾動 parallax scrolling 網(wǎng)站典范)。讓我們拭目以待~

　　學(xué)設(shè)計，到天琥，*就業(yè)，就好業(yè)，1元學(xué)設(shè)計，聽課送U盤。