我們日常生活中使用的微信小程序數量(liang)眾多，很大一(yi)部分原因是(shi)(shi)由于小(xiao)程序的(de)開發(fa)難度相比APP要低得(de)多，更(geng)低的(de)門檻意味著小(xiao)程序的(de)制(zhi)作(zuo)成本也會降低，中小(xiao)企(qi)業想要打入移動端市(shi)場有了更(geng)好(hao)的(de)選擇(ze)。確實從技術(shu)難度上(shang)來(lai)說，小(xiao)程序更(geng)加親民，但是(shi)(shi)在設(she)計(ji)制(zhi)作(zuo)時還是(shi)(shi)有一(yi)些基礎的(de)規范需要注(zhu)意的(de)，而不是(shi)(shi)想怎(zen)么做就怎(zen)么做。

一、尺寸規范

小程序(xu)的(de)開(kai)發尺(chi)(chi)(chi)寸(cun)是(shi)rpx（responsive pixel），采用這個尺(chi)(chi)(chi)寸(cun)的(de)目的(de)就(jiu)是(shi)為(wei)了讓(rang)制作出來(lai)的(de)小程序(xu)只需一稿(gao)就(jiu)能適配所有的(de)屏幕(mu)尺(chi)(chi)(chi)寸(cun)。px指的(de)是(shi)物理(li)分(fen)辨率(lv)，而手(shou)機的(de)顯示分(fen)辨率(lv)則是(shi)pt，以iphone6為(wei)例，它(ta)的(de)物理(li)像素為(wei)750*1334，而它(ta)的(de)屏幕(mu)尺(chi)(chi)(chi)寸(cun)則是(shi)375*667，這時候你以prx作為(wei)尺(chi)(chi)(chi)寸(cun)單位，那1rpx=0.5px。如果是(shi)別的(de)手(shou)機尺(chi)(chi)(chi)寸(cun)，它(ta)就(jiu)會根據倍率(lv)變為(wei)其他數值。一般來(lai)說，在設(she)計時默認按照iphone6的(de)尺(chi)(chi)(chi)寸(cun)即可。

二、組件規范

小程(cheng)序(xu)的(de)所(suo)有頁(ye)面，包括小程(cheng)序(xu)內嵌(qian)網頁(ye)和(he)插件，微(wei)信都(dou)會在其右上角放置(zhi)官方小程(cheng)序(xu)菜(cai)單(dan)。開(kai)發者不可對(dui)其內容(rong)自定(ding)義，但可選擇深淺兩種基本配色(se)以適應頁(ye)面設計(ji)風格(ge)——來自小程(cheng)序(xu)設計(ji)指南(nan)。

在這個(ge)基礎上，頁(ye)面(mian)還有哪些地方需要(yao)(yao)注意的呢(ni)？首先(xian)是(shi)返(fan)回鍵，小程序的操(cao)作(zuo)邏(luo)輯和APP有些許不(bu)同，現在全(quan)面(mian)屏(ping)手機的操(cao)作(zuo)都是(shi)直接在屏(ping)幕側邊橫向內(nei)滑就(jiu)可以(yi)返(fan)回上一頁(ye)，而小程序想要(yao)(yao)返(fan)回就(jiu)必須要(yao)(yao)點左上角的返(fan)回鍵。所(suo)以(yi)在頁(ye)面(mian)頂部最左側，一定要(yao)(yao)記(ji)得添加(jia)返(fan)回鍵，以(yi)免用戶意外退出。

小(xiao)程序(xu)的(de)(de)導(dao)航欄(lan)通(tong)常設置在底部，可以根據實際(ji)需要設置2-4個(ge)欄(lan)目。如(ru)果(guo)你的(de)(de)小(xiao)程序(xu)功能(neng)相對簡單，在首頁已經做好(hao)了各個(ge)頁面的(de)(de)入(ru)口(kou)，那也可以將(jiang)導(dao)航欄(lan)直(zhi)接刪除(chu)。由(you)于體積大小(xiao)的(de)(de)限制，就算(suan)做了導(dao)航欄(lan)，也不能(neng)像APP一(yi)樣添(tian)加(jia)豐富的(de)(de)視覺效果(guo)，靜(jing)態切換更(geng)為合(he)適(shi)。

其實這些(xie)規(gui)范對于原本就是開發相關的(de)從業人員(yuan)來(lai)說(shuo)，很快就能適應，畢竟和APP開發類(lei)似，只需稍微花些(xie)時間(jian)就能習(xi)(xi)慣。并且這些(xie)規(gui)范很大程(cheng)度上是幫(bang)助(zhu)了開發人員(yuan)，為他們提供了便利(li)。對于不懂技術的(de)人來(lai)說(shuo)，從頭學起的(de)成本依舊不小，經驗上的(de)缺失(shi)都要依靠試錯和學習(xi)(xi)。

我們(men)身邊(bian)的(de)(de)中小企(qi)業(ye)(ye)居多(duo)，他們(men)想要(yao)設計制(zhi)作一(yi)(yi)個微信(xin)小程序真的(de)(de)要(yao)花費那么多(duo)精(jing)力(li)去開(kai)發嗎(ma)？現在自助搭建平臺(tai)發展(zhan)火熱，一(yi)(yi)個模(mo)(mo)板(ban)(ban)就能(neng)輕松(song)解決(jue)的(de)(de)事情(qing)，完全不用(yong)投入大量時間精(jing)力(li)。最(zui)重(zhong)要(yao)的(de)(de)是，模(mo)(mo)板(ban)(ban)開(kai)發的(de)(de)成本更(geng)低，制(zhi)作周(zhou)期(qi)也非常短，這(zhe)樣的(de)(de)性(xing)價比相信(xin)沒有哪個企(qi)業(ye)(ye)可(ke)以拒絕(jue)。

相關文章推薦，點擊閱讀：《從制作到應(ying)用，微信小程序實用教(jiao)程》