網(wǎng)頁(yè)設(shè)計(jì)合適的頁(yè)面尺寸是多少？網(wǎng)頁(yè)設(shè)計(jì)合適尺寸，已經(jīng)有了很大改變，不需要擔(dān)心設(shè)備尺寸不同的問(wèn)題，以目前主流形式來(lái)看，有以下：1、pc端網(wǎng)頁(yè)的設(shè)計(jì)稿尺寸是寬度1920px，高度最小是1080px ， 主

網(wǎng)頁(yè)設(shè)計(jì)合適的頁(yè)面尺寸是多少？

網(wǎng)頁(yè)設(shè)計(jì)合適尺寸，已經(jīng)有了很大改變，不需要擔(dān)心設(shè)備尺寸不同的問(wèn)題，以目前主流形式來(lái)看，有以下：

1、pc端網(wǎng)頁(yè)的設(shè)計(jì)稿尺寸是寬度1920px，高度最小是1080px ， 主體內(nèi)容在1200px內(nèi)就行，比較規(guī)范。

2、移動(dòng)端網(wǎng)頁(yè)的設(shè)計(jì)尺寸可以考慮680px和720px

HTML5移動(dòng)網(wǎng)頁(yè)的設(shè)計(jì)稿尺寸應(yīng)該是多少？

HTML5的移動(dòng)端網(wǎng)頁(yè)設(shè)計(jì)稿，通常情況下，內(nèi)容區(qū)為750px或960px或者1080px的，一般不小于750px像素大?。▽挾龋?/p>

設(shè)計(jì)稿可以比750px大，但是絕對(duì)不能比750px小，這個(gè)主要是由于當(dāng)前手機(jī)的分辨率相對(duì)較高（iPhone 6是375物理像素，但實(shí)際像素為其兩倍，也就是750，這個(gè)750就是這么來(lái)的）

如果設(shè)計(jì)圖稿過(guò)小，前端在實(shí)現(xiàn)圖稿的時(shí)候里面的圖片大小在高分辨率的情況下會(huì)顯得模糊不清，所以這也是為何要“大”分辨率

此外需要注意的是，要保證頁(yè)面的基準(zhǔn)字體大小，在320px的設(shè)計(jì)稿當(dāng)中，最小字體不宜小于12像素，其他像素的設(shè)計(jì)稿當(dāng)中，等比例換算即可（12/320px*設(shè)計(jì)稿像素值）

手機(jī)端網(wǎng)頁(yè)尺寸是多少？

我們?cè)谧鍪謾C(jī)網(wǎng)站的時(shí)候，一定要關(guān)注手機(jī)網(wǎng)站的頁(yè)面尺寸，網(wǎng)站頁(yè)面尺寸的大小直接影響到網(wǎng)站的美觀度，以及用戶的體驗(yàn)。尺寸的定位也叫做兼容性，兼容性也包括很多方面，并不是尺寸定位這一點(diǎn)。由于PC端網(wǎng)站的尺寸都是可以固定的，而固定的點(diǎn)也體現(xiàn)在寬度上。PC端網(wǎng)站常用的寬度尺寸是1024像素（px），不需要前端人員在這個(gè)頁(yè)面的基礎(chǔ)上耗費(fèi)功夫。但是對(duì)于手機(jī)網(wǎng)站就要特別注意了，如果我們用640px作為標(biāo)準(zhǔn)，那么當(dāng)用戶用320px的手機(jī)訪問(wèn)的時(shí)候，守舊就只能顯示網(wǎng)站的一半大小。如果出現(xiàn)這種情況，就會(huì)影響用戶體驗(yàn)，用戶會(huì)直接關(guān)閉網(wǎng)站。所以，當(dāng)我們?cè)谧鍪謾C(jī)端網(wǎng)站的時(shí)候，一定要先了解目前主流手機(jī)的尺寸大小。而目前主流手機(jī)有IOS系統(tǒng)和Android系統(tǒng)，我們只需要了解這兩個(gè)系統(tǒng)下的手機(jī)的各種尺寸就可以了。

1、IOS系統(tǒng)

IOS系統(tǒng)的蘋果手機(jī)，從iphone 4到現(xiàn)在iphone xs max，尺寸也是越來(lái)越大。對(duì)于IOS系統(tǒng)的手機(jī)，一般只要考慮兩個(gè)尺寸就可以了，一個(gè)是720px，另一個(gè)是1080px。如果是平板電腦的話，也可以通過(guò)跳轉(zhuǎn)來(lái)識(shí)別，但很多企業(yè)會(huì)建立一個(gè)以ipad為首的網(wǎng)站，方便ipad用戶來(lái)訪問(wèn)。

2、Android系統(tǒng)

Android系統(tǒng)常見的手機(jī)尺寸有480、720和1080px三種。

3、主流尺寸

對(duì)于手機(jī)網(wǎng)站的建設(shè)，更多的是針對(duì)320、480、640px。所以前端技術(shù)只需要進(jìn)行一段簡(jiǎn)單的判斷就可以了。當(dāng)然，如果還有其它尺寸，也可以進(jìn)行再次識(shí)別。

4、識(shí)別

一個(gè)手機(jī)網(wǎng)站之所以會(huì)出現(xiàn)半屏或者超屏的現(xiàn)象，完全是因?yàn)樽煮w大小的原因。所以，在手機(jī)網(wǎng)站更多時(shí)候不會(huì)使用px來(lái)寫代碼，而會(huì)使用em或者rem進(jìn)行一種自適應(yīng)的區(qū)分。但要記住em和rem不能同時(shí)出現(xiàn)在同一個(gè)頁(yè)面中，不然就會(huì)出現(xiàn)一大一小的加載停留情況。

PC端和移動(dòng)端網(wǎng)頁(yè)設(shè)計(jì)的字體規(guī)范是什么？

感謝邀請(qǐng)，如果幫助到您記得關(guān)注我哈~

PC端網(wǎng)頁(yè)當(dāng)中默認(rèn)字體為宋體，我們?cè)僭O(shè)計(jì)時(shí)候需要注意最小中文字12像素必須選擇宋體，字的屬性選擇無(wú)。因?yàn)橹形淖种挥?2像素宋體效果無(wú)才能看清。大于12、14我們一般用黑體。最小英文Arial可以是9像素一般很少用。移動(dòng)端ios我們?cè)O(shè)計(jì)字體為蘋方，安卓我們就用黑體就可以。

為什么移動(dòng)端UI要有設(shè)計(jì)規(guī)范？

你好，關(guān)于移動(dòng)端為啥要有設(shè)計(jì)規(guī)范，我認(rèn)為至少有3方面原因。

1.對(duì)設(shè)計(jì)師而言：為后續(xù)版本迭代和多人協(xié)作提供指導(dǎo)，保持產(chǎn)品的統(tǒng)一性；因?yàn)?個(gè)項(xiàng)目從開始到后邊的更新迭代，會(huì)經(jīng)歷很長(zhǎng)時(shí)間，涉及到的設(shè)計(jì)師可能會(huì)多個(gè)，但是每個(gè)人的風(fēng)格不一樣，會(huì)影響整體的視覺(jué)體驗(yàn)，所以有了規(guī)范，讓設(shè)計(jì)師們?cè)诋a(chǎn)品視覺(jué)能統(tǒng)一，方便更新迭代。

2.對(duì)開發(fā)而言：提供標(biāo)準(zhǔn)化的組件樣式，減少開發(fā)重復(fù)時(shí)間。

因?yàn)橛辛艘?guī)范，后續(xù)維護(hù)就方便很多，設(shè)計(jì)師不用再次標(biāo)注，開發(fā)不用重新去寫樣式，直接換內(nèi)容。

3.對(duì)使用者而言:符合大眾的視覺(jué)體驗(yàn)。因?yàn)楝F(xiàn)實(shí)中人們對(duì)移動(dòng)端產(chǎn)品的設(shè)計(jì)在字體 圖標(biāo) 間距等上已經(jīng)有了大致的習(xí)慣。

下圖是我收藏的部分規(guī)范分享給大家，大家一起學(xué)習(xí)