網頁設計這樣就對了！十招教你做出最棒的網站！

RWD響應式網頁的設計，已經成為現在做網站的基本條件之一。另外SDT小編再與大家分享十招網頁設計的概念，有了這些祕招，你也能做出最潮的時尚網站！

【第一招】圖大！還要更大！

source:http://www.borngroup.com/

自從響應式網站風行後，我們常常看到進入網站就是非常大的圖(或影片)，使用者對於影像的接受度，遠遠超過贅述的文字，一張好的圖，除了能夠立馬就吸引到觀眾的目光，加深印象外，更直接替代掉廢話連篇。

【第二招】多媒體體驗

source:http://barstories.jackdaniels.com

運用Html5網頁技術，可以將多媒體置入網頁之中，讓使用者有耳目一新的感受，同時也加強互動的概念，但還是要特別注意效能表現，免得過多的效果反而讓網站不好用。

【第三招】視差效果設計

source:http://www.quoplus.com/

視差設計也是今年設計的一個風潮，將網頁瀏覽時的上下(或左右)移動，設計在視覺上和背景間的差距呈現，可以創造出更多的驚喜。例如上面的耳機網站中，就運用這樣的技巧在展現各種耳機顏色，質感非常棒！

【第四招】用動畫說故事

source:http://habitatweb.mx/

前面有提到多媒體的部分，而在新的html5設計上，也更多了"動畫"的呈現模式，將會動的元素，搭配網頁瀏覽時的文字內容，讓使用者在觀看時，更能一步步引導，深化腦內的印象度。

【第五招】扁平化設計

source:http://colinanddewi.com/

扁平化設計在APP的表現上早就已經是引領潮流的王道，而在網頁設計上，也有著相同趨勢，無論是 icon 、圖像、字體、按鈕，都已變化為簡潔的扁平設計，反而會讓使用者有一種質樸輕鬆的使用經驗。

【第六招】打破格子吧！

source:https://pixelgrade.com/demos/rosa/

source:http://www.world-of-swiss.com/

以往的網頁設計，強調版面規劃完整、直線切版、將網頁內容一塊一塊的呈現在首頁上，但現在因應手機版的使用度越來越高，突破框架式的思考也才符合未來的設計概念，同時也更能展現網頁的特殊設計風格。

【第七招】運用拼貼

source:http://dynamit.com/

相對於突破框架式的設計，還是有許多網站的設計，是以拼貼的方式來表現，但這個拼貼，不代表就是非常規律的格子，反而是有設計風格的多樣化拼貼，如此更能展現網站圖像式的內容，吸引使用者目光。

【第八招】引導按鈕元件

source:http://humcreative.com/about/

進入一個網站最怕就是迷路，因此許多網站都將導航列(Navigation bar)放在最上方，明顯之處。不過現在也有設計人希望將這些引導的按鈕，置入在網頁之中，創造出更多的使用者互動與趣味。不過重點還是要記住：千萬不能讓使用者迷路阿！

【第九招】導入Google地圖

source:http://nitwinski.com/

Google map提供API可以串接，也讓自己網站可以多樣化的呈現與地圖相關的資訊。

【第十招】多層次呈現

source:http://necotrans.com/

利用多個圖層的相互疊壓，創造出獨特的設計風格，這種方式也比較適合資訊很多的網站，有效率的運用空間來對使用者說明所有內容。

SDT小編結語：

有了這十招的醍醐灌頂，對網頁設計或是需要規劃網站的人來說，應該是個很不錯的建議，不過就像所有的武功絕招一樣，學習每個技巧或觀念還是要能夠應用與消化，而不是硬把不適合的東西加入網站設計之中，這樣只會讓使用者覺得眼花撩亂。還是要仔細思考自己的網站對象是誰？誰來使用？目的為何？才能真正做出一個同時具備實用與設計感的好網站。



以上非翻譯文章，小編概念與原文作者並不一定完全相同
圖文參考資料來源：http://99designs.com/designer-blog/2015/01/16/top-web-design-trends-2015/