最典型的例子，iPhone3gs的屏幕像素是320x480，iPhone4s的屏幕像素是640x960剛好兩倍，然而兩款手機(jī)都是35英寸的所以，我們要引入最重要的一個(gè)概念像素密度，也就是PPIpixelsperinch這項(xiàng)指標(biāo)是連接數(shù)字世界與物。

1從中間尺寸向上和向下適配的時(shí)候界面調(diào)整的幅度最小375pt下的設(shè)計(jì)效果適配到414pt和320pt偏差不會(huì)太大假設(shè)以414pt為基準(zhǔn)做出很優(yōu)雅的設(shè)計(jì)，到320pt可能元素之間比例就不是那么回事了，比如圖片和文字之間視覺比例可能。

如果app有通知，要提供一個(gè)有新通知時(shí)顯示在狀態(tài)欄的通知圖標(biāo)整體大小為24 x 24 dp ，圖形實(shí)際區(qū)域?yàn)?22 x 22 dp 注android規(guī)范提供的尺寸單位是dp，若設(shè)計(jì)稿尺寸設(shè)為720 x 1280 ，圖標(biāo)大小需在規(guī)范要求的尺寸數(shù)字上乘以2。

指尖平均為810mm，所以最佳的熱區(qū)尺寸應(yīng)設(shè)定為10mmX10mm 位置和命令 按鈕應(yīng)放置在用戶能夠直接找到或者他有預(yù)期能看到的地方例如，iOS UI 設(shè)計(jì)規(guī)范給明了按鈕的合理位置按鈕要執(zhí)行的命令和位置的關(guān)系按鈕要執(zhí)行的命令非常。

按鈕的最小值是44*44px，同樣的，在iPhone4以上的設(shè)備里面要翻倍在android里面也是差不多的，一般要求是44*44以上，不過iOS要求會(huì)嚴(yán)格一些具體的細(xì)節(jié)你可以下載一個(gè)官方的iOS和android的UI設(shè)計(jì)規(guī)范，在網(wǎng)上是有的。

6接著需要提供APP圖標(biāo)尺寸200*200，PNG格式APP啟動(dòng)頁尺寸1080*1920，PNG格式7然后其他功能，例如第三方分享導(dǎo)航推送功能等，可根據(jù)需要，自由搭配8最后需要支付一定費(fèi)用就可以進(jìn)行下載了。

移動(dòng)平臺(tái)設(shè)計(jì)指導(dǎo)規(guī)范告訴了我們什么在蘋果的iPhone人機(jī)界面設(shè)計(jì)規(guī)范中指出，最小的點(diǎn)擊目標(biāo)尺寸是44 x 44像素微軟的Windows手機(jī)用戶界面設(shè)計(jì)和交互指南中建議使用34 x 34像素的尺寸，最小也要26 x 26 像素諾。

1主圖尺寸800*800像素6張2詳情頁P(yáng)C端750px ，移動(dòng)端640px3PC端首頁寬度默認(rèn)是990px，側(cè)邊欄790px150px選項(xiàng)4全屏通欄是1920px5店招尺寸為1920*120px也可以1920*150px6詳情頁寬度。

750像素寬淘寶移動(dòng)端banner的設(shè)計(jì)尺寸建議為750像素寬，這樣的尺寸可以適應(yīng)各種移動(dòng)設(shè)備的屏幕大小，并且在保持內(nèi)容清晰可見的同時(shí)也能節(jié)省加載時(shí)間，高度可以根據(jù)具體需求來調(diào)整。

目前比較好的解決辦法是下載Axure 2如果是給itouch或者iPhone用的，比較好辦，直接用320×480的分辨率畫好輔助線，然后畫原型 3按F5生成原型的時(shí)候，在“MobileDevice”選項(xiàng)中可以設(shè)置適配移動(dòng)設(shè)備的特殊原型 4設(shè)置。

移動(dòng)端頁面尺寸設(shè)計(jì)應(yīng)該考慮哪些細(xì)節(jié)我們看到的電商網(wǎng)站如聚美優(yōu)品等的手機(jī)界面大都是直接按照手機(jī)尺寸設(shè)計(jì)的，那么你知道移動(dòng)端頁面尺寸設(shè)計(jì)應(yīng)該考慮哪些細(xì)節(jié)嗎小編就來與大家聊一聊這個(gè)問題有個(gè)常識(shí)大家都知道，屏幕上的。

浮窗設(shè)計(jì)元素不一樣 Android里可以看到各種浮窗，流量，清理內(nèi)存等等iOS暫時(shí)還不支持這樣的浮窗越獄的貌似可以iOS和Android的UI區(qū)別七圖標(biāo)尺寸和命名規(guī)范不一樣 1iOS和Android手機(jī)的APP圖標(biāo)尺寸規(guī)范和圖標(biāo)命名規(guī)范 2。

前端技術(shù)可以善加利用設(shè)備的像素密度，只需一行代碼，瀏覽器便會(huì)使用app的顯示方式來渲染頁面根據(jù)像素密度，按相應(yīng)倍率縮放移動(dòng)端頁面尺寸設(shè)計(jì)要考慮哪些因素如果你已經(jīng)看過了整篇文章，相信你對(duì)于移動(dòng)端頁面尺寸設(shè)計(jì)要考慮。

1建議是640乘以960或者640乘以1008，制作的話建議用微客場(chǎng)景平臺(tái)2用各種分辨率的移動(dòng)智能手機(jī)查看我們?cè)O(shè)計(jì)的H5頁面時(shí)，當(dāng)然，也會(huì)出現(xiàn)內(nèi)容顯示不全，甚至一些重要內(nèi)容和按鈕都會(huì)被遮擋3背景圖片必須采用背景覆蓋來實(shí)現(xiàn)。

要根據(jù)不同手機(jī)不同的屏幕分辨率來規(guī)定尺寸一般做效果圖主流都是做480*800來測(cè)試，iphone4或s就用640*960，但這個(gè)都只是效果圖，真正開發(fā)還需要切圖用點(diǎn)9來做屏幕適配常見手機(jī)顯示屏分辨率96x65，96x96，128x96。