APP界面設(shè)計，IOS字體規(guī)范與多屏幕適配（1）(4)

移動界面設(shè)計由于針對繁雜的設(shè)備尺寸，適配和字體規(guī)范往往是新手容易頭疼的問題。這次主要介紹IOS的設(shè)計規(guī)范與流程。由于iphone 6的出現(xiàn)，蘋果手機的分辨率也多了起來，適配進(jìn)而也變的復(fù)雜。。。

先看市面上iPhone4、5、6、6 Plus的分辨率

分辨率與像素（分辨率單位是程序所說的單位——點即pt，像素為真實Pixel）

1.iphone4分辨率320*480pt，像素640*960px

2.iphone5分辨率320*568pt，像素640*1136px

3.iphone6分辨率375*667pt，像素750*1334px

4.iphone6 Plus分辨率414*736pt，像素1242*2208（注：Plus屏幕的實際分辨率只有1920*1080，實際情況是在此分辨率下渲染的圖像等比降低到1080P）

另外，iPhone6和iPhone 6Plus都有標(biāo)準(zhǔn)模式和放大模式2種分辨率：

看到如此多的分辨率，是不是有點暈的感覺，仔細(xì)拆分：

1.iPhone4和iPhone5寬度一樣，5只是比4高176像素，所以5和4一套規(guī)范即可；

2.iPhone6的放大模式分辨率是640＊1136，和iPhone5正好相同；

3.iPhone6的標(biāo)準(zhǔn)模式分辨率為750*1334，整體放大1.5倍正好是iPhone6 Plus的放大模式1125*2001。

我們來看淘寶購物車的截圖（從左到右依次為iPhone4、5、6）：

我們可以看出iPhone 4、5、6共用一套字體大小規(guī)范。

而iPhone6 plus在放大模式下的字體正好是在此基礎(chǔ)上放大了1.5倍：

看到這里明白了吧，對于字體我們只需要做一套iPhone 6的字號大小規(guī)范，Plus上直接放大1.5倍即可。

下面我們來看IOS上具體字體常用字號規(guī)律；

首先，一個視覺舒適的APP界面，字號大小對比要合適，并且各個不同界面大小對比要統(tǒng)一。

先說一般規(guī)律（72像素/英寸下的字號大小規(guī)律）：

導(dǎo)航欄標(biāo)題：大概34px-42px；現(xiàn)在標(biāo)題越來越小，一般34或36比較合適。

標(biāo)簽欄文字：20－24px。ios自帶應(yīng)用都是20px。個人認(rèn)為標(biāo)簽欄時（圖標(biāo)＋文字）形式的的話不要大于22比較合適。

正文：28px－36px，新聞類基本都在用36，比如網(wǎng)易新聞?wù)牟糠帧?/p>

下面是IOS人際界面指南上的具體要求：

1）正文樣式在大字號下使用 34 px字體大小，最小也不應(yīng)小于 22 。

2）通常來說，每一檔文字大小設(shè)置的字體大小和行間距的差異是 2 px。一般為了區(qū)別開標(biāo)題和正文字體大小差異要至少為4px。

3）標(biāo)題和正文樣式使用一樣的字體大小。為了將其和正文樣式區(qū)分，標(biāo)題樣式使用中等效果。（注意：mac電腦上默認(rèn)使用黑體就有中等和細(xì)體2個選項）。

最后，最后關(guān)于字號大小規(guī)律，最好找比較好的應(yīng)用截圖，然后量出現(xiàn)有規(guī)律直接套用即可：

關(guān)于多屏幕適配問題請看IOS字體規(guī)范與多屏幕適配（2）.