農(nóng)副產(chǎn)品市場(chǎng)手機(jī)站設(shè)計(jì)頁(yè)面要求及規(guī)范
農(nóng)副產(chǎn)品市場(chǎng)手機(jī)站設(shè)計(jì)頁(yè)面是有一般的要求及規(guī)范的,但很多人其實(shí)并不了解。建網(wǎng)站雖說(shuō)是建站公司的事情,但是作為手機(jī)網(wǎng)站實(shí)際的擁有者,還是應(yīng)該了解一些的。在這里,易銷互聯(lián)網(wǎng)科技給大家歸納了一下,主要是有以下幾個(gè)方面,希望能夠給大家一些幫助。
農(nóng)副產(chǎn)品市場(chǎng)在設(shè)計(jì)頁(yè)面的時(shí)候一定不會(huì)少,雖說(shuō)比較多,但是主要還是分為8類頁(yè)面:歡迎頁(yè)、首頁(yè)、菜單框、注冊(cè)與登錄、彈出窗口、動(dòng)態(tài)展示交互、詳細(xì)頁(yè)、搜索頁(yè)。
農(nóng)副產(chǎn)品市場(chǎng)手機(jī)站設(shè)計(jì)尺寸規(guī)范
狀態(tài)欄(status bar)、導(dǎo)航欄(navigation)、主菜單欄(submenu)、內(nèi)容區(qū)域(content)。
Logo出矢量圖512*512 icon:29*29 72*72 512*512
iphone
窗體頂端
1.尺寸以及分辨率
320*480,640*960,640*1136 網(wǎng)頁(yè)和移動(dòng)的UI用72px
2.界面基本組成元素
iPhone的APP界面一般由狀態(tài)欄、導(dǎo)航欄、主菜單欄和中間的內(nèi)容區(qū)域組成。因?yàn)閷挾仁枪潭ǖ�,所以設(shè)計(jì)開發(fā)起來(lái)很方便。下面我們說(shuō)說(shuō)這些“欄”的尺寸吧:
狀態(tài)欄:高度 40px
導(dǎo)航欄:高度 88px
主菜單欄:高度 98px;
內(nèi)容區(qū)域:高度為:734px
如果640*1136是910px
iPhone5/5s的640*1136的尺寸,其實(shí)就是中間的內(nèi)容區(qū)域高度增加到910px。
3.字體
窗體頂端
32~36px 32px,注釋等提示文本28px。
窗體底端
窗體頂端
不同則img-line.png,[email protected]
窗體頂端
Android
1.尺寸以及分辨率
提到Android的尺寸,480*800、720*1280。點(diǎn)9切圖所有手機(jī)的適配。
Android界面尺寸:480*800、720*1280、1080*1920。
2.界面基本組成元素
與ios的一樣,還是有狀態(tài)欄、導(dǎo)航欄和主菜單欄,以720*1280的尺寸,狀態(tài)欄的高度應(yīng)為50px,導(dǎo)航欄的高度96px,主菜單欄的高度96px。內(nèi)容區(qū)域高度為:1038px(1280-50-96-96=1038) 窗體底端
Android系統(tǒng)采用可自適應(yīng)的屏幕支持,由于屏幕尺寸種類繁多,簡(jiǎn)單可歸為ldpi(240*320)、mdpi(320*480)、hdpi(480*800)、xhdpi(720*1280)
字體:android原生的字體,與微軟雅黑很像。字體大小范圍為16px~32px
IOS:寬度640PX 高度1136px
iOS屏幕尺寸有這幾種:320*480,960*480,1024*768
機(jī)網(wǎng)站開發(fā)_國(guó)互網(wǎng)窗體底端
Ipad端
iPad界面尺寸:1024*768、2048*1536
單位:像素72dpi,在設(shè)計(jì)的時(shí)候并不是每個(gè)尺寸都要做一套,尺寸按自己的手機(jī)來(lái)設(shè)計(jì),比較方便預(yù)覽效果,一般用640*960或者640*1136的尺寸來(lái)設(shè)計(jì)。
單位
iOS的尺寸單位為pt,Android的尺寸單位為dp�! �
單位之間的換算關(guān)系隨倍率變化:
1倍:1pt=1dp=1px(mdpi、iPhone 3gs)
1.5倍:1pt=1dp=1.5px(hdpi)
2倍:1pt=1dp=2px(xhdpi、iPhone 4s/5/6)
3倍:1pt=1dp=3px(xxhdpi、iPhone 6)
4倍:1pt=1dp=4px(xxxhdpi)
單位決定了我們的思考方式。我們?cè)?span style="font-family: 'Helvetica Neue', Helvetica, 'Hiragino Sans GB', 'Microsoft YaHei', Arial, sans-serif; line-height: 25.6px; white-space: normal; color: rgb(255, 0, 0);">農(nóng)副產(chǎn)品市場(chǎng)手機(jī)站設(shè)計(jì)和開發(fā)過(guò)程中,應(yīng)該盡量使用邏輯像素尺寸來(lái)思考界面。設(shè)計(jì)Android應(yīng)用時(shí),有的設(shè)計(jì)師喜歡把畫布設(shè)為1080x1920,有的喜歡設(shè)成720x1280。給出的界面元素尺寸就不統(tǒng)一了。Android的較小點(diǎn)擊區(qū)域尺寸是48x48dp,這就意味著在xhdpi的設(shè)備上,按鈕尺寸至少是96x96px。而在xxhdpi設(shè)備上,則是144x144px。
農(nóng)副產(chǎn)品市場(chǎng)手機(jī)站設(shè)計(jì)頁(yè)面所用版式常規(guī)的有六種:列表式(搜索產(chǎn)品和新聞模塊)、、抽屜式(產(chǎn)品模塊)、圖表式(圖表模塊)、行為擴(kuò)展式、彈出式(彈出頁(yè)面)、圖片滑動(dòng)式(banner 或產(chǎn)品)。
易銷互聯(lián)網(wǎng)科技十年電商經(jīng)驗(yàn),專業(yè)手機(jī)站設(shè)計(jì),如果您有任何有關(guān)網(wǎng)站設(shè)計(jì)疑問(wèn),都可以來(lái)此咨詢。