習(xí)慣，是一個強大的敵人。對于設(shè)計師來說，尤其如此。

　　微信小程序是近兩年才出現(xiàn)的新事物，而網(wǎng)頁設(shè)計出現(xiàn)已經(jīng)超過20多年。目前大多數(shù)的設(shè)計師都是脫胎于網(wǎng)頁設(shè)計師，并且不少設(shè)計師從事網(wǎng)站設(shè)計超過五年以上。這就產(chǎn)生了一個問題長時間從事網(wǎng)頁設(shè)計，會形成一些設(shè)計習(xí)慣，而這樣的設(shè)計習(xí)慣是不適合微信小程序設(shè)計的。

　　本文，我們就來討論這樣一個問題僅僅從設(shè)計的角度而言，網(wǎng)站設(shè)計與微信小程序設(shè)計，究竟有哪些不同？

　　輸入設(shè)備不同導(dǎo)致的設(shè)計差異

　　PC端的輸入主要依靠鍵盤和鼠標，輸入精度較高，所以，這就影響了網(wǎng)站設(shè)計。例如，網(wǎng)站的排版，即便是較為緊湊，體驗影響不大，不會導(dǎo)致誤操作。但是，智能手機的輸入，主要依靠攝像頭，由于鍵盤小，使用鍵盤輸入會導(dǎo)致出錯率高，也體驗不好。

　　這樣的差異，導(dǎo)致了PC網(wǎng)頁設(shè)計和微信小程序設(shè)計的差異。

　　舉例來說，一家金融公司的網(wǎng)站和小程序，當(dāng)需要輸入卡號的時候，網(wǎng)站上面可以讓用戶直接輸入卡號，但是，微信小程序可以引導(dǎo)用戶通過拍照識別卡號的方式，完成輸入。

　　自由作文和話題作文導(dǎo)致的設(shè)計差異

　　在筆者看來，網(wǎng)頁的設(shè)計自由度更大，但是小程序的設(shè)計自由度更小。為什么呢？這是因為微信為小程序提供了很多無法改變的欄目、格式、樣式、配色。

　　例如，菜單配色方面，微信只為小程序提供深淺兩種配色方案，而菜單配色方案往往影響整個頁面的配色，為了配合既定的配色方案，小程序頁面配色只能選擇匹配微信提供的配色方案。

　　還例如，官方小程序菜單將放置在界面固定位置，開發(fā)者在設(shè)計界面時請預(yù)留出該區(qū)域空間，并且，需要開發(fā)者周圍的交互，與官方固定交互小匹配。也是因為如此，大多數(shù)小程序都選擇了在固定位置左側(cè)，設(shè)計了搜索欄。

　　設(shè)計藝術(shù)與用戶體驗的優(yōu)先不同

　　網(wǎng)站設(shè)計被眾多設(shè)計師認為是可以體現(xiàn)出設(shè)計藝術(shù)的，包括使用藝術(shù)元素、交互藝術(shù)、設(shè)計師個人喜好等等，可以在PC網(wǎng)頁設(shè)計中體現(xiàn)出來。但是，在信小程序設(shè)計中，體驗藝術(shù)的空間非常有限。

　　例如，圖標、交互、反饋效果等，在PC網(wǎng)頁設(shè)計的時候，都能夠體現(xiàn)出個性藝術(shù)。但是，在設(shè)計小程序的時候，圖標、交互、反饋效果，都是微信自動提供的，只能使用微信提供的標準件，設(shè)計藝術(shù)就很難體現(xiàn)?？梢哉f，微信小程序?qū)⒂脩趔w驗置于設(shè)計藝術(shù)之前。

　　綜上，就是我們總結(jié)的網(wǎng)頁設(shè)計與微信小程序設(shè)計的不同點，僅供參考。