隨著移動(dòng)端的大力普及,移動(dòng)端網(wǎng)站也正日益發(fā)揮著越來越大的作用。由于設(shè)備尺寸、分辨率、顯示效果等方面的差異,移動(dòng)端網(wǎng)站在設(shè)計(jì)方面同PC端網(wǎng)站也有著不同。這里我們以字體為例,來看看移動(dòng)端網(wǎng)站通常采用什么樣的字體。
移動(dòng)端網(wǎng)站通常選用什么字體呢?我們知道,盡管安卓的市場份額很大,但是安卓機(jī)是一個(gè)開放的底層系統(tǒng),不易統(tǒng)一。所以設(shè)計(jì)師通常會選擇以蘋果手機(jī)iPhone上的顯示效果為準(zhǔn)。那么,在模擬iPhone瀏覽器默認(rèn)的文字時(shí)設(shè)計(jì)師就拿不準(zhǔn)應(yīng)該選用什么字體了。在Windows平臺下設(shè)計(jì)iOS產(chǎn)品是一個(gè)很嚴(yán)重的問題。那就是Windows下暫時(shí)無方法完整渲染出蘋果系統(tǒng)的效果。在上圖中我們可以看到,在Mac機(jī)上模擬iOS默認(rèn)字體時(shí)可以直接使用蘋果原生的字體:黑體-簡(HEITI-SC )。渲染模式選為蘋果渲染模式即可。如果是PC機(jī)需要模擬iOS默認(rèn)字體,那么用黑體簡會有比較大的出入,反而使用華文細(xì)黑-渾厚模式比較接近默認(rèn)字體。
首先需要說明的是,由于我們設(shè)計(jì)圖像時(shí)的屏幕并不是Retina的屏幕,所以我們需要設(shè)計(jì)看起來是12像素大小的文字時(shí),我們需要在PS里建立一個(gè)24像素的文本框。這就讓我們無法直接看到真實(shí)手機(jī)上顯示的效果了。所以我們需要不斷地存成圖片然后導(dǎo)入到真機(jī)里測試效果。那么如果我們需要設(shè)計(jì)的移動(dòng)網(wǎng)站里有很多文字文本,那么多大尺寸的文字才是適合閱讀的呢?雖然不同的人有著不同的觀點(diǎn),但是總結(jié)說來,一般小于22PX的文字基本上是難以閱讀的,在進(jìn)行移動(dòng)端網(wǎng)站文字調(diào)整的時(shí)候需要注意。