手機網(wǎng)站設(shè)計尺寸及界面布局

隨著手機網(wǎng)民的巨曾以及各個手機應(yīng)用平臺的上線，幾乎所有的互聯(lián)網(wǎng)應(yīng)用都紛紛往手機平臺上遷移。但是當(dāng)前的手機種類繁多，手機屏幕的大小、分辨率各異，因此既要考慮應(yīng)用在不同屏幕大小上的兼容，又要保持其一致性，那么手機網(wǎng)站設(shè)計尺寸及界面布局是怎么樣滿足這一要求的呢?很多人不是很清楚下面小編給大家介紹一下：

在客戶端的設(shè)計過程中，針對不同的屏幕大小，應(yīng)該如何來設(shè)計?是否每個大小的屏幕尺寸都需要一個新的界面布局，

一.屏幕大小正確理解

說起屏幕大小的時候，會有兩種表達(dá)方式，1) 我的屏幕2.4寸，你的屏幕3.5寸，2)這個屏幕分辨率 240*320，那個屏幕分辨率為320*480。但在設(shè)計過程中，屏幕的分辨率和屏幕的實際尺寸必須同時考慮，屏幕物理尺寸：屏幕對角線長的實際尺寸，如2.4寸，3.5寸等等;屏幕分辨率：屏幕所能顯示像素的多少。物理尺寸決定了屏幕的實際尺寸，而分辨率可以表示屏幕上可以呈現(xiàn)的像素點數(shù)，屏幕密度決定了屏幕的精細(xì)程度。相同的屏幕大小，如果分辨率高，則屏幕元素更精細(xì)。一個界面元素在屏幕里的實際尺寸卻是與屏幕密度相關(guān)，屏幕密度較小的屏上，界面元素的實際尺寸就會大些。

二.設(shè)計過程與屏幕適配思路

確定目標(biāo)的屏幕大小，屏幕大小由寬度和高度兩個因素決定，但是在布局手機客戶端的過程中，最關(guān)心的是寬度值。寬度確定后，高度可以由滾動或者翻頁來顯示所有內(nèi)容;文字可以在適當(dāng)?shù)奈恢谜坌?標(biāo)題欄可以伸縮適配屏幕寬度等等。但并不是不考慮高度，圖標(biāo)、文字、特殊的組件不僅需要考慮寬度，也需要考慮整個屏幕的布局是否與之適配。

由于手機系統(tǒng)各異，手機的屏幕尺寸五花八門，屏幕的性能也呈現(xiàn)多樣性，還有觸摸屏和非觸屏的區(qū)分，這四個變量結(jié)合起來，會有無數(shù)種不同的情況，如何能使你的應(yīng)用完美地展現(xiàn)給用戶，適配固然很重要，但是更重要的是你要在適配之前，確定應(yīng)用的目標(biāo)群體也很重要啦，一定要選擇適合自己的。